Learning path

Overview

This case study explores the transformation of evulpo, an e-learning platform, from a traditional curriculum-based system to a new gamified learning experience.

Through design thinking, cross-functional collaboration, and gamification, we created a space exploration-themed learning journey guided by the learning buddy Vulpy, resulting in significant improvements in student activation and retention rates.

Challenges

The education sector has rapidly adopted online learning platforms, with educators recognizing their potential to enhance traditional classroom experiences. However, most platforms struggle to create personalized learning journeys for each individual student,which considers their unique learning styles, interests, and abilities.

User Behavior Analysis

Data from evulpo revealed a critical engagement pattern: Students actively completed assigned exercises (high task completion rate) Critical gap: Students stopped engaging after finishing required work No exploration of related lessons or supplementary exercises Missing opportunities for deeper learning and skill reinforcement

Key Research Insights

Based on learning science research, we identified this must-have principles:

• Short learning pieces are crucial for effective information absorption
• Learning materials must include video, audio, text, and exercises
• Elements help learners align goals and stay motivated - "It doesn't feel like learning"
• Assessment and feedback are critical components
• Well-designed interface significantly influences study time and completion rates

Desktop Research & Competitive Analysis

For the structure and design of the learning path, I created a comprehensive mood-board for the UI and analyzed leading EdTech platforms to understand best practices in personalized learning experiences.

• Mimo: Microlearning approach and progression mechanics
• Duolingo: Gamification and streak mechanics
• Brilliant: Interactive problem-solving methodology
• Century: Adaptive learning path

Internal Workshop

I structured and led an online workshop with 9 cross-functional team members from technical, design, marketing, and business areas. The workshop helped align the team on strategy and next steps, established a shared vision for the new learning experience, outlined technical and design requirements, and created a framework for implementation.

In this large-scale project, we encountered numerous complex challenges that required strategic thinking and cross-functional collaboration. The following section highlight key obstacles I navigated as UX Designer - from transforming existing content for personalized learning experiences to balancing user needs with technical constraints.
I used design thinking methods, particularly the "How Might We" framework to address key challenges.

Challenge

Data showed students dislike answering too many questions to access learning materials - each additional question increased drop-off rates. However, personalization required substantial user information.

My Strategy

I created a system architecture diagram to bridge the gap between technical possibilities and user experience needs.
This helped me:

• Identify hidden challenges in the user flow
• Gain better overview of the entire experience
• Establish clear communication framework with developers and stakeholders
• Define how the learning path engine would work

Solution

Working with two graphic designers we developed a space exploration gamification concept that transformed the learning experience into a story.
This narrative became our onboarding foundation, where students meet their companion Vulpy, who introduces them to the learning journey filled with collectible milestones, avatar upgrades, explorer badges, and challenges that reward progress and learning from mistakes. The space exploration theme reduced onboarding friction by making the experience feel like a game rather than work.

Transforming Existing Content into Microlearning Bites

Our existing content structure consisted of longer summaries and videos that weren't optimized for the microlearning approach required for effective personalized learning paths.

This was primarily a technical challenge, but I worked closely with our data scientist to bridge the gap between technical possibilities and learning experience needs.

This was primarily a technical challenge, but I worked closely with our data scientist to bridge the gap between technical possibilities and learning experience needs.

AI-Powered Content Transformation

Working with Language Models (LLM), we successfully transformed existing learning summaries and videos into smaller, digestible learning bites.

My Contribution

• Defined the structure of learning bites
• Validated that learning paths made educational sense
• Ensured content progression followed learning science principles
• Created guidelines for bite-sized content creation

Due to tight project timelines, I structured designs feature-by-feature in Figma, collaborating closely with our Product Manager to align with development assignments and optimize handoff efficiency.

My Approach

• Quickly moved from low to high fidelity for better stakeholder discussions
• Created click-prototypes only for clear, linear paths, for complex decision trees, used static Figma presentations with verbal explanations
• Clear flow documentation for each developer
• Visual design explanation through interface itself, minimal technical text (developers often skip long explanations)

Key Learning

Click-prototypes work best for single-path flows; multiple options require different presentation methods.

Mobile-First Approach

With plans for a mobile app featuring only learning paths, I prioritized mobile design first, then adapted for desktop.

Screen Considerations

• Desktop: Primary platform usage
• Mobile: Growing importance and future app development
• Tablet: Discovered importance during user testing phase

The learning experience is built around a personalized approach where every student embarks on a unique “space exploration mission” guided by the AI tutor, Vulpy.

Each learning path begins with foundational lessons and progresses toward the student’s target lesson, ensuring a gradual and robust understanding of the material. Lessons are delivered in a microlearning format, with summary bites and exercises bites that make complex materials manageable and engaging for learners.

For each exercise the learner gets a reward (points) and collect avatar and explorer badges through their learning journey. In a final test the student can show their knowledge and by correcting previous mistakes get rewarded.

Multi-Language UX Challenge

Designing for 7 different languages meant ensuring interface elements and microcopy worked across vastly different text lengths and cultural contexts. With limited translation review resources, I took ownership of quality assurance, manually checking translations to maintain user comprehension across all languages. This taught me to design flexible UI components that could accommodate text expansion while preserving visual hierarchy and usability.

QA Testing Process

• Took responsibility for translation quality checks
• Ensured user comprehension across languages
• Prepared text for translation during development phase
• Participated human testing rounds
• Wrote detailed technical tickets explaining issues

Learnings

• Multi-language platforms require dedicated quality assurance
• Balanced design integrity with time pressure realities
• Learned to prioritize core functionality over perfection

School-Based User Testing

Location: School in Thalwil
Participants: 9 children aged 11-12
Method: Direct observation and questioning
Team: UX Colleague Alexandra and myself

Findings

Observation proved more valuable than questioning due to children's shyness and peer influence on responses.

Positive Gamification Results

• Students were highly engaged with the point system and badge collection
• Space exploration theme resonated strongly with the 10-12 age group
• Avatar customization was particularly popular among younger students

Areas for Improvement

• I designed it primarily for desktop and smartphone devices, but students used tablets, therefore the navigation wasn't as intuitive as expected.
• We encountered tablet-specific technical issues