Focus Keyword: edtech ux design

URL slug: /projects/edtech-ux-design-wise-wings

SEO Title: 7 UX Decisions That Made This Edtech UX Design Work — Wise Wings Education

Meta Description: This edtech UX design for Wise Wings Education covers end-to-end product design, UX strategy, and interface design — clean flows, structured layouts, and trust built from first click.

Edtech UX Design: Wise Wings Education Case Study

Edtech UX design is one of the most consequential areas of product design working today. When an interface creates friction between a student and their learning, the cost isn’t just a bad user experience — it’s lost momentum, lost confidence, and lost time that can’t be recovered.

Wise Wings Education is a purpose-led learning platform serving K–12 students and their parents across Tier-2 and Tier-3 Indian cities. Their existing product had grown organically — features added as requests came in, with no cohesive UX logic holding it together. The result was a fragmented interface causing drop-off at the exact moments that mattered most.

Category: Product Design · UX Strategy · UI Design Duration: 8 weeks Role: UX Research, Information Architecture, UI Design Deliverables: User Research · Affinity Mapping · Information Architecture · Wireframes · UI Design · Component Library (60+ elements) · Prototype · Usability Testing · Design System Documentation

Table of Contents

1. Overview
2. The Challenge
3. Problem Space
4. Process
5. Outcome
6. Key Takeaway

1. Overview

Wise Wings came to this project with a product that worked — technically. Courses existed. Enrollment was possible. Progress could be tracked. But the experience of doing any of those things was creating friction at every turn, and that friction was costing the platform users it couldn’t afford to lose.

The goal for this edtech UX design engagement was precise: reduce friction at three critical touchpoints — course discovery, enrollment, and progress tracking — and establish a visual language that feels credible to parents while remaining genuinely engaging for students. Two audiences, one interface, one 8-week window.

This is the defining complexity of edtech UX design at the K–12 level — the person using the product and the person paying for it are rarely the same. Every design decision has to work for both simultaneously, without compromising either.

2. The Challenge

Edtech UX design for a K–12 platform introduces a complexity most product briefs don’t carry: the person using the product and the person making the decision to use it are often different people entirely.

Students need an interface that feels engaging, clear, and forward-moving. Parents need an interface that communicates credibility, progress transparency, and value for money. These aren’t the same design requirements. In many cases they pull in opposite directions.

The previous interface had been designed without this distinction. Navigation, content hierarchy, and progress communication had all been built for a single undifferentiated user — which meant it served neither audience well. Drop-off was happening not because users didn’t want to continue, but because the interface was giving them no clear reason to.

Good edtech UX design doesn’t split the difference between two audiences. It gives each audience a view built around how they actually think about the product — and connects those views into a single coherent system underneath.

3. Problem Space

• No design system; inconsistent UI across 40+ screens with no shared component logic.
• Course discovery relied entirely on search — no browse structure, no recommendation logic, no contextual entry points.
• Enrollment flow had 7 steps with a completion rate under 35%.
• Progress tracking was a single percentage bar — no milestone logic, no motivational structure, no sense of forward momentum.
• Mobile traffic was 78% of total but the interface had been built desktop-first with no mobile-specific design consideration.
• Parent and student mental models had never been separated in the product architecture.
• Empty states, error states, and loading states were unstyled — critical trust moments left completely undesigned.

4. Process

Discovery: Research as the Foundation of Edtech UX Design

Weeks 1–2 were entirely research. Eight parent interviews and five student usability sessions were conducted, producing a dataset synthesised into an affinity map covering observed behaviours, expressed frustrations, and inferred anxieties.

Three core anxiety patterns surfaced consistently across both parent and student sessions:

“I don’t know if this is the right course.”

“I don’t know where my child is in the programme.”

“I don’t know what to do next.”

These three statements became the brief. Every subsequent edtech UX design decision was evaluated against whether it resolved one of these three anxieties — directly, specifically, and without creating a new one in its place. Research done properly doesn’t just inform design — it makes design feel inevitable.

Strategy: Restructuring the Information Architecture

Weeks 3–4 were devoted to information architecture and structural decisions — the work that determines whether the interface can succeed before a single visual decision is made.

The most significant structural change: separating parent and student navigation entirely. The previous architecture treated both users identically. The new architecture gives each user a view built around their actual mental model — students see their learning journey, parents see their child’s progress and account management. Same underlying product, two genuinely different entry points.

Enrollment flow reduced from 7 steps to 3 by collapsing redundant fields and deferring optional data collection to post-signup. This single edtech UX design decision had the largest measurable impact on completion rates in subsequent testing. Reducing steps is rarely about removing information — it’s about understanding which information is actually necessary at which moment.

Course discovery restructured from search-only to a three-layer browse architecture: category → subcategory → course. Search retained as a power-user shortcut, not the primary navigation mechanism. Users who don’t know what they’re looking for can’t search for it — browse gives them a way in.

Execution: Building the Edtech UX Design System

Weeks 5–7 were UI design and component library build. A component library of 60+ elements was designed covering type, colour, form states, card variants, progress indicators, empty states, error states, and loading states.

The design system was built mobile-first throughout — not adapted for mobile after the fact. Every component was designed at mobile dimensions first, then extended for tablet and desktop. Given the 78% mobile traffic split, designing desktop-first and retrofitting would have been the wrong approach from the start. Mobile-first edtech UX design isn’t a methodology preference — it’s a response to where the users actually are.

Progress tracking was redesigned as a visual milestone map — a sequential set of illustrated stages that a student moves through as they complete a course. The percentage bar communicated completion mathematically. The milestone map communicates it narratively — creating motivation and forward momentum that a number alone cannot produce.

Card design for course discovery was developed in three density variants: compact for list view, standard for grid, and feature for promoted or recommended content. This flexibility allows the same edtech UX design component logic to serve every content context without creating visual inconsistency across the product.

Empty states, error states, and loading states were designed with the same care as primary UI. In edtech UX design, these moments are trust moments — a user who hits an unstyled error state loses confidence in the product immediately. Every state in the component library was given a voice that matched the brand and a layout that communicated clearly what had happened and what to do next.

Refinement: Testing the Edtech UX Design

Week 8: two rounds of moderated usability testing with six participants across parent and student segments. Three areas refined based on observed behaviour:

• Course card information density reduced — parents were reading every detail before deciding; less information per card actually increased decision confidence by reducing cognitive load.
• CTA placement on the enrollment flow adjusted — users were looking for the primary action in a different position than the initial design assumed.
• Milestone map interaction model iterated — initial version required a tap to reveal milestone details; revised version surfaced key information inline, removing an unnecessary step from a moment that should feel effortless.

Each iteration was validated against the three core anxiety statements from the discovery phase. The test for any refinement wasn’t aesthetic — it was functional: does this resolve uncertainty faster than the previous version?

[Insert Project Image Here]

Edtech UX design for Wise Wings Education — information architecture, component library, mobile interface, and progress milestone map.

5. Outcome

• Enrollment flow completion rate improved from 35% to 71% in usability testing — a 2× lift from a single structural change.
• Average session duration increased by 2.4 minutes across both parent and student segments.
• Component library of 60+ elements handed off with full design system documentation.
• Development team reported 40% faster implementation time versus previous screen-by-screen handoff approach.
• Mobile experience rated significantly higher than desktop in post-testing satisfaction scores — the first time in the product’s history.
• Parent anxiety scores across all three identified patterns reduced measurably between round 1 and round 2 of testing.
• Empty and error states designed and documented for the first time — zero unstyled edge cases at handoff.

See a similar research-led UX approach applied to an AI product →

6. Key Takeaway

The most impactful decision in this edtech UX design project wasn’t a UI decision at all. It was separating the parent and student mental models at the information architecture level — before any visual work began.

Once the navigation reflected how each user actually thought about the product, the interface decisions became faster, clearer, and more defensible. Every layout choice, every component decision, every copy refinement had a research finding behind it. That foundation is what made an 8-week end-to-end edtech UX design engagement possible without a single direction change mid-project.

When users stop dropping off, it’s rarely because the interface got prettier. It’s because someone took the time to understand exactly where they were getting lost — and removed the obstacle. That’s the job. And in edtech UX design, where the stakes are a student’s momentum and a parent’s trust, it’s a job worth doing carefully.