March 2024
Skillpath AI Learning App - UI Mobile App
AI-powered learning platform UI concept that won 1st place in UI/UX Competition.
FigmaAdobe XDIllustrator
Overview
AI Learning Concept
Skillpath is a visionary mobile learning application concept that was awarded 1st Place at the Vocational Of Champions UI/UX Competition (UNS). It transforms the traditional e-learning experience by integrating Artificial Intelligence to create hyper-personalized adaptive learning paths. Addressing the industry-wide problem of 'content overload', Skillpath replaces static course catalogs with a dynamic 'Smart Guide' that evolves with the learner. The application serves students and lifelong learners who struggle with self-discipline and curriculum planning.\n\nI designed the entire user experience using Figma for high-fidelity prototyping and Adobe XD for interaction flows. The core innovation lies in the 'AI-First' navigation structure, which removes the friction of choosing 'what to learn next' by presenting a curated daily feed of micro-lessons. The design system features calm, focused aesthetics to reduce cognitive load, predictive progress visualization that motivates users by showing future milestones, and contextual micro-interactions that provide immediate, satisfying feedback for every completed task. This project demonstrates how human-centered design can leverage AI to make complex learning goals feel achievable and engaging.
Key Responsibilities
Impact & Results
- Won 1st Place in UI/UX Competition at UNS
- ~92% positive feedback from competition jury
- Praised for 'innovative use of AI context in UI'
- Selected for university design showcase
Challenges
The Challenge
The primary challenge was designing an interface that felt 'smart' without being intrusive. I had to balance the AI's automated recommendations with the user's need for autonomy, ensuring learners felt guided rather than controlled.
Problem
Self-directed learners often suffer from 'decision paralysis' when facing massive course catalogs. Without a clear, personalized structure, many lose motivation and drop out before completing their first module.
Overwhelming choices
Traditional LMS interfaces present too many options, causing anxiety and hesitation.
Lack of structure
Self-paced students struggle to build their own curriculum and stick to a schedule.
Static content
Generic courses fail to adapt to a learner's specific strengths and weaknesses.
Engagement drop-off
Without personalized feedback, learners lose the emotional connection to their goals.
Solution
Skillpath introduces an adaptive interface where the 'Home' screen is a singular, focused task list generated by AI. I designed the UX to prioritize 'doing' over 'browsing', removing barriers between the user and their learning material.
Adaptive dashboard
A smart home screen that changes daily based on the user's performance and goals.
Focus mode UI
Distraction-free lesson players that maximize screen real estate for content.
Visual mastery paths
Gamified progress maps that show the user exactly where they are in their journey.
Motivational feedback
Positive reinforcement loops designed into completion screens and milestone badges.
Process
The Journey
Problem Discovery
Interviewed students and professionals to uncover why they abandoned previous online courses, identifying 'lack of guidance' as the core issue.
Conceptualization & User Flows
Mapped out the 'Adaptive Learning Loop', defining how user actions would trigger AI adjustments in the interface.
Wireframing the 'Smart Interface'
Created low-fidelity layouts that tested different ways to present AI recommendations without confusing the user.
High-Fidelity Visual Design
Developed a 'Calm Tech' visual language using soft colors and ample whitespace to reduce anxiety during study sessions.
Prototype & Validation
Built a clickable prototype demonstrating the 'Day 1 vs Day 30' evolution of the dashboard, which was key to winning the competition.