ProjectsSM Simon MahmudLive product
SKITTO / Case study

Skitto (Revamp)

This project focused on the complete redevelopment of skitto.com, transitioning it from a legacy website into a modern, feature-rich platform utilizing cutting-edge technologies. The redesign prioritized enhancing user experience, boosting performance, and incorporating dynamic features to address evolving user needs.

Open live product Read the project story
Company
SKITTO
Role
Frontend engineering
Year
Selected work
Duration
Product delivery
skitto-revamp / interface
Skitto (Revamp) interface

The project is a redevelopment of Skitto website with a focus on modern design, feature rich content and enhanced user experience. The revamped website features a sleek and intuitive interface built with Tailwind CSS and Material UI, providing users with a seamless browsing experience. The core architecture is built with Next.js, utilizing the Next.js App Router for efficient routing and optimization. Additionally, revalidating caching is integrated for seamless data management, allowing for real-time updates and efficient data fetching.

Next.jsFramerMotionChakraUITailwindCSS
02 / Outcome

What changed after the work.

01

Achieved a 40% increase in user engagement metrics post-launch

02

Improved UX for users

03

OTT platform visits increased by 25% within the first month of launch

03 / Engineering decisions

Challenge, implementation, outcome.

01
Challenge

Making the design responsive and accessible across devices

Implementation

Built dashboard UI

Outcome

Achieved a 40% increase in user engagement metrics post-launch

02
Challenge

Animation trigger and myltiple design change logic from a single component

Implementation

Integrated GraphQL APIs

Outcome

Improved UX for users

03
Challenge

Optimizing performance while maintaining rich animations and dynamic content

Implementation

Material UI for a modern and responsive user interface

Outcome

OTT platform visits increased by 25% within the first month of launch

04 / System view

How the product moves.

component-based + API-driven

01Api
02Render logic
03Server/Client
04UI

Core features

  • Google analytics implementation for user behavior tracking
  • Custom animations and transitions using Framer Motion
  • Flexiplan like custom pack maker
  • Plan listing & OTT platform

My contribution

  • Built dashboard UI
  • Integrated GraphQL APIs

Performance and quality

  • Optimized heavy response using dynamic imports
  • Lazy-loaded big data mapped components
  • Manual testing for tracking flows
  • API response validation
Next case study

Grameenphone

GpFi (Revamp)