A UX design assessment for Educase India — a complete referral programme experience from persona research through high-fidelity screens, covering both the student referrer and the school admin.
Client Educase India Role UX Designer (Assessment) Deliverables Research · Wireframes · Hi-Fi Screens
Overview
Educase India is a B2B EdTech platform that helps schools digitise their operations — admissions, fee management, timetables, and communications. Despite strong product-market fit, the company had no structured referral programme, meaning organic school-to-school growth was going unmeasured and unrewarded.
The assessment brief was to design a mobile-first referral system that would motivate existing users (students, parents, school staff) to refer new schools, track their progress transparently, and earn meaningful rewards — while giving admins visibility over the entire referral pipeline.
Process
I followed a condensed UX process suited to an assessment timeline — emphasising empathy and structure before jumping to visuals.
1. Define the two user types
I identified two fundamentally different users who would interact with the referral system in very different ways — a student referrer (Priya) who shares codes and earns cashback, and a school manager-admin (Rahul) who oversees all referral activity and payouts.
5. Design 11 hi-fi screens
I designed a complete screen set spanning both user types: Onboarding → Dashboard → Share → Referral Status → Rewards & Tiers → Leaderboard → Notifications → Empty State → Error State → Admin Dashboard → Admin Tracking.
Research
Two personas sat at opposite ends of the system — one sharing codes for personal reward, one managing a programme at institutional scale. Designing for both simultaneously was the central tension of this project.
User Journey
I mapped Priya's journey across 7 stages, capturing her emotional state at each moment, the friction points pulling her mood down, and the design solutions that resolve them. This became the direct blueprint for which screens to build and in what order.
Lo-Fi Wireframes
Before investing time in colour and styling, I wireframed the two most critical screens — Create Profile and My Dashboard — to establish the right information hierarchy and validate the layout logic. Wireframes let me identify problems cheaply: I caught that the dashboard needed a progress-towards-next-reward section before moving to hi-fi.
→ Photo upload at top — establishes personal identity and trust in the system before asking for data
→ +91 pre-filled — reduces friction for the core Indian market audience
→ Single CTA — no secondary buttons to create decision paralysis
The dashboard needed to answer Priya's biggest questions at a glance: How many did I refer? How many converted? How much have I earned? What's next?
→ 4-stat grid — Total Refs, Converted, Earned, Pending — maps directly to Priya's mental model of progress
→ Next Reward progress bar — creates forward momentum and reduces the chance of drop-off between tiers
→ Recent Referrals list — addresses the "no updates" pain point by surfacing status inline on the home screen
Hi-Fidelity Screens
The visual system uses a calm blue primary palette — trustworthy and familiar for Indian app users — with green for success states, amber for progress indicators, and clear typographic hierarchy using a single sans-serif. All screens are designed for mobile-first at 390px width.
Onboarding → Dashboard
Priya's first two screens. The onboarding auto-populates known data and the dashboard greets her by name with an immediate overview of her impact.
✓ Personalised greeting ("Good morning, Priya 👋") immediately signals the app knows who she is
✓ ₹2,400 earned is displayed prominently in rupees — grounding the reward in local currency rather than abstract points
✓ Bottom nav tabs (Home, Share, Status, Rewards) mirror the exact mental model from the journey map stages
Directly addresses Priya's pain point — "hard to copy and share referral link." The screen puts the code front and centre with a one-tap copy, then lists all sharing channels including a native contacts importer.
✓ Humanised code format — "EDU-PRIYA-42" is far more memorable than a random string, and reinforces personal identity
✓ WhatsApp as first channel — placed top-left because research showed it is the dominant sharing tool for the target demographic
✓ Import from Contacts CTA — removes the app-switching friction identified in the journey map, keeping the flow entirely in-app
✓ Headline "Earn ₹200 per referral" on screen answers the "unclear benefit" pain from Stage 1 of the journey
Directly resolves the "Waits" stage anxiety — Priya can now see each referral, its unique ID, date, and current status (Success / Pending / Declined) in a filterable list.
✓ Filter tabs (All / Success / Pending / Declined) give Priya immediate agency to focus only on what she cares about
✓ Colour-coded status badges (green/amber/red) allow status scanning without reading — optimised for a quick glance
✓ REF-XXXX IDs and dates provide an audit trail that builds trust and answers "did it go through?"
Two screens that work together to drive long-term engagement — the Rewards screen shows what Priya has earned and where she sits in the tier structure; the Leaderboard adds social competition to sustain motivation.
✓ Three tiers (Bronze ₹200/ref → Silver ₹350 → Gold ₹500) resolve the "confusing multi-tier structure" pain with clear, labelled thresholds
✓ Badges Earned section (First Ref, 5 Streak, Fast Ref) introduces gamification that rewards behaviour beyond just volume
✓ Leaderboard shows Priya her own rank highlighted — even when she's not in the top 3, the "You (Priya) +" row keeps her anchored to the competition
Rahul's world. The admin view provides macro-level programme health at a glance — total referrals, conversion rate, rewards paid — and surfaces top performers to reward or investigate.
✓ 57% conversion rate and ₹1.2L rewards paid at a glance — the two numbers Rahul needs most, removed from a spreadsheet and surfaced live
✓ Top Referrers leaderboard with payout amounts makes fraud investigation intuitive — outliers are immediately visible
✓ Dark navy header distinguishes the admin environment from the referrer app — preventing accidental context confusion
The screens most commonly skipped in assessments — but they define the quality of the overall experience. Empty and error states prevent confusion for new users; the notifications screen closes the loop on the "feels ignored" pain point.
Design Decisions
Each pain point from the persona and journey map research maps directly to a specific design choice in the final screens.
Reflection
