NextLearn UI/UX
Experience-first UI/UX design for NextLearn, featuring a gamified LMS dashboard and a distraction-free course player.
Executive Summary
The biggest challenge in digital education is student retention. NextLearn was struggling with a 70% dropout rate due to a fragmented and outdated user interface. Campaignsquat Ltd was commissioned to design the entire web ecosystem—from the public marketplace to the complex internal management tools. Using Figma, we engineered a unified, gamified, and distraction-free environment. The result was a 45% increase in course completion rates and a 60% boost in daily engagement, transforming NextLearn into a market-leading LMS.
Client Background
NextLearn is a professional certification platform that had outgrown its initial setup. They needed a cohesive digital infrastructure to handle thousands of students and hundreds of instructors. Their legacy system faced User Disconnection (boring, textbook-style interface), Operational Chaos (no centralized management for payouts or disputes), Conversion Barriers (confusing multi-page checkout), and Mobile Inefficiency where quizzes and video players were almost unusable.
The Challenge
Massive Information Architecture
Mapping out a seamless flow for 50+ unique pages, including Category hubs, Lesson players, and Account settings without overwhelming the learner.
Multi-Portal UI Consistency
Designing three distinct user experiences—Student, Instructor, and Super-Admin—while maintaining a singular brand DNA across all interfaces.
Gamification Engine
Creating a visual 'Success Path' in Figma using experience points (XP), progress rings, and achievement milestones to drive long-term motivation.
Data-Heavy Dashboards
Designing an Admin interface that makes complex financial reporting, instructor payouts, and user analytics instantly understandable through 'Surgical Precision'.
Project Goals
✓ Design a High-Conversion Marketplace to drive course enrollments.
✓ Build a Distraction-Free Course Player to maximize focus and retention.
✓ Develop an Instructor Management Portal for curriculum building and earnings tracking.
✓ Create a Universal Admin Dashboard for total control over users, content, and revenue.
The Solution
We utilized an Atomic Design & Modular Framework to ensure the platform remains scalable: 1. Global Design System: Created a library of 600+ Figma components for total consistency. 2. User-Centric Course Player: Designed a 'Focus-Mode' interface that hides non-essential elements during playback. 3. Instructor Hub Design: Focused on 'Ease of Authoring' with a drag-and-drop UI for curriculum building and visual student heatmaps. 4. Admin Command Center: Engineered the backend with a sidebar-driven UI for KYC management and platform-wide sales monitoring. 5. Interactive Prototyping: Built a high-fidelity prototype in Figma to test the end-to-end journey from discovery to certification.
Key Features Implemented
Dynamic Home & Category Pages
Targeted UI for different learning paths and skill levels to simplify course discovery.
Student Dashboard & Gamification
Personalized 'Learning Path' tracker with streaks, badges, and progress visualization.
LMS Course Player (Focus Mode)
A custom video interface with integrated Q&A, note-taking, and downloadable resources.
Instructor Portal
Dedicated tools for course uploads, student messaging, and real-time revenue analytics.
One-Page Checkout UI
A secure, frictionless e-commerce experience with saved payment methods to reduce abandonment.
Super-Admin Command Center
Advanced tools for content moderation, financial reporting, and platform-wide user management.
Results
✓ Increased Retention: Completion rates rose by 45% due to the new gamified progress visualization.
✓ Operational Clarity: The Admin Dashboard reduced management overhead by 50% through automated reporting.
✓ Conversion Success: Premium course sales grew by 25% within the first 90 days post-launch.
✓ Mobile Engagement: 60% of students now complete quizzes on their phones, thanks to the thumb-friendly mobile UI.
✓ Engagement Boost: 60% increase in daily active users interacting with community features.
Campaignsquat Ltd didn't just design a website; they built our entire business infrastructure. From the public site to the internal management panels, every pixel is optimized for learning and growth. It's the most intuitive LMS we have ever seen.
— NextLearn Group
Key Takeaways
✔ In E-learning, 'Focus Mode' design is critical for improving student course completion rates.
✔ Gamification elements like streaks and XP are not just fun; they are powerful retention tools.
✔ Instructor success depends on the 'Ease of Authoring'—simpler tools lead to better content.
✔ A unified Design System is essential when managing multiple user portals (Student/Admin/Instructor).
Future Steps
- 1. Personalized AI Dashboard
- Designing a UI for an AI-powered mentor that suggests courses based on student performance..
- 2. Social Learning Hub
- A community-driven page within the dashboard for collaborative student projects..
Ready to build something extraordinary together?
Let's transform your complex product vision into a high-performance ecosystem, custom-engineered for absolute scale.
Have a project in mind?
Submit your project scope below to initiate a structured consultation. Our technical team reviews submissions to prepare a custom roadmap.
Tell us what you're building
Websites • SaaS • Mobile • Software
Start a Project
Tell us about your project goals and we will respond promptly.