UI / UX Design
Crextio
Crextio is a web platform that helps CA students practice by chapter, test under real exam pressure, and revise their mistakes in one place.
Year :
2026
Industry :
SaaS Dashboard
Tools :
Figma, PSD, Claude.ai
Project Duration :
2 Months
Overview :
Crextio is a web platform built for Chartered Accountancy students to practice for their exams the way they'll actually be tested — through structured, chapter-wise question sets that mix Descriptive, MCQ, and Case Scenario formats. Rather than a static question bank, it's built around two distinct study modes: a relaxed Tutor Mode for learning at your own pace, and a Timed Mode that simulates real exam pressure. The result is a single system that supports a student from first read-through to final revision.
Problem :
Right now, CA exam prep means juggling PDFs, printed notes, and separate timer apps just to simulate a real exam. Nothing talks to each other. Students can't practice by chapter, track weak areas, or revisit flagged questions — because no single tool does all three.
Solution :
Crextio replaces the folder-hunting with a guided 3-step flow — Group → Paper & Chapter → Topic & Difficulty — so a student builds a precise practice set in seconds.
From there, two modes take over: Tutor Mode, where answers, notes, and confidence ratings are visible instantly for learning — and Timed Mode, with a countdown, locked navigation, and overtime tracking for real exam pressure.
Each question type gets its own layout built around how it's actually tested: split-screen review for Descriptive, instant feedback for MCQs, and a fixed scenario stem with linked sub-questions for Case Scenarios. A Revision Hub, inline Notes, and a results breakdown (score, accuracy, time, correct/partial/wrong) close the loop after every session.
Target Users:
Key screens:
Design Decisions:
Warm palette over corporate blue — amber and beige instead of the cold, clinical tone most exam platforms default to, aimed at reducing exam-related anxiety during long sessions.
Two visually distinct modes — Tutor and Timed Mode share a layout skeleton but diverge in navigation freedom, color cues, and information density, so students always know which "mode" they're in at a glance.
Immediate vs. delayed feedback — Tutor Mode reveals answers instantly to support learning; Timed Mode locks feedback until submission to preserve exam realism.
Case Scenario as a first-class question type — rather than treating it as a variant of MCQ, it got its own navigation pattern (progress dots, fixed scenario panel) to reflect how it's actually tested.
Score card as a single source of truth — correct / partial / wrong / not-attempted counts, time spent, and average time per question all live on one card so a student doesn't have to dig through separate analytics screens to know how they did.
Challenges:
Modeling exam-realistic hierarchy — Group → Paper → Chapter → Category → Question Type → Difficulty is a lot of sequential decision-making to compress into a 3-step flow without it feeling like a form.
Case Scenario navigation — keeping one scenario stem visible and readable while a student moves between several linked sub-questions, without constant re-reading or scroll fatigue.
Designing for two opposing states — a calm, low-pressure Tutor Mode and a high-pressure Timed Mode needed to feel like the same product while behaving very differently (locked navigation, overtime tracking, pause/resume).
Evaluation ambiguity — descriptive answers can't be auto-graded, so the flow had to accommodate handwritten upload, "evaluate later," and (future) AI evaluation without leaving the student stuck mid-session.
Outcomes:
Delivered 61 production-ready screens covering the full study lifecycle — creation, practice, evaluation, revision, and account management — as a complete Figma design system ready for handoff to development.
(Add real metrics here if available — e.g. client/stakeholder feedback, usability test results, or post-launch engagement numbers — these carry more weight than screen count alone.)
Learnings:
Designing for two fundamentally different mental states (relaxed learning vs. timed pressure) inside one product taught me how much small interface decisions — locked navigation, color of a timer, whether an answer is visible — shape how "safe" or "high-stakes" a screen feels to someone using it. It also reinforced that exam-prep tools succeed less on question-bank size and more on how well the product removes friction between "I don't understand this" and "I've fixed it," which is what the Notes + Revision Hub loop was really designed to solve.
More Projects
UI / UX Design
Crextio
Crextio is a web platform that helps CA students practice by chapter, test under real exam pressure, and revise their mistakes in one place.
Year :
2026
Industry :
SaaS Dashboard
Tools :
Figma, PSD, Claude.ai
Project Duration :
2 Months
Overview :
Crextio is a web platform built for Chartered Accountancy students to practice for their exams the way they'll actually be tested — through structured, chapter-wise question sets that mix Descriptive, MCQ, and Case Scenario formats. Rather than a static question bank, it's built around two distinct study modes: a relaxed Tutor Mode for learning at your own pace, and a Timed Mode that simulates real exam pressure. The result is a single system that supports a student from first read-through to final revision.
Problem :
Right now, CA exam prep means juggling PDFs, printed notes, and separate timer apps just to simulate a real exam. Nothing talks to each other. Students can't practice by chapter, track weak areas, or revisit flagged questions — because no single tool does all three.
Solution :
Crextio replaces the folder-hunting with a guided 3-step flow — Group → Paper & Chapter → Topic & Difficulty — so a student builds a precise practice set in seconds.
From there, two modes take over: Tutor Mode, where answers, notes, and confidence ratings are visible instantly for learning — and Timed Mode, with a countdown, locked navigation, and overtime tracking for real exam pressure.
Each question type gets its own layout built around how it's actually tested: split-screen review for Descriptive, instant feedback for MCQs, and a fixed scenario stem with linked sub-questions for Case Scenarios. A Revision Hub, inline Notes, and a results breakdown (score, accuracy, time, correct/partial/wrong) close the loop after every session.
Target Users:
Key screens:
Design Decisions:
Warm palette over corporate blue — amber and beige instead of the cold, clinical tone most exam platforms default to, aimed at reducing exam-related anxiety during long sessions.
Two visually distinct modes — Tutor and Timed Mode share a layout skeleton but diverge in navigation freedom, color cues, and information density, so students always know which "mode" they're in at a glance.
Immediate vs. delayed feedback — Tutor Mode reveals answers instantly to support learning; Timed Mode locks feedback until submission to preserve exam realism.
Case Scenario as a first-class question type — rather than treating it as a variant of MCQ, it got its own navigation pattern (progress dots, fixed scenario panel) to reflect how it's actually tested.
Score card as a single source of truth — correct / partial / wrong / not-attempted counts, time spent, and average time per question all live on one card so a student doesn't have to dig through separate analytics screens to know how they did.
Challenges:
Modeling exam-realistic hierarchy — Group → Paper → Chapter → Category → Question Type → Difficulty is a lot of sequential decision-making to compress into a 3-step flow without it feeling like a form.
Case Scenario navigation — keeping one scenario stem visible and readable while a student moves between several linked sub-questions, without constant re-reading or scroll fatigue.
Designing for two opposing states — a calm, low-pressure Tutor Mode and a high-pressure Timed Mode needed to feel like the same product while behaving very differently (locked navigation, overtime tracking, pause/resume).
Evaluation ambiguity — descriptive answers can't be auto-graded, so the flow had to accommodate handwritten upload, "evaluate later," and (future) AI evaluation without leaving the student stuck mid-session.
Outcomes:
Delivered 61 production-ready screens covering the full study lifecycle — creation, practice, evaluation, revision, and account management — as a complete Figma design system ready for handoff to development.
(Add real metrics here if available — e.g. client/stakeholder feedback, usability test results, or post-launch engagement numbers — these carry more weight than screen count alone.)
Learnings:
Designing for two fundamentally different mental states (relaxed learning vs. timed pressure) inside one product taught me how much small interface decisions — locked navigation, color of a timer, whether an answer is visible — shape how "safe" or "high-stakes" a screen feels to someone using it. It also reinforced that exam-prep tools succeed less on question-bank size and more on how well the product removes friction between "I don't understand this" and "I've fixed it," which is what the Notes + Revision Hub loop was really designed to solve.
More Projects
UI / UX Design
Crextio
Crextio is a web platform that helps CA students practice by chapter, test under real exam pressure, and revise their mistakes in one place.
Year :
2026
Industry :
SaaS Dashboard
Tools :
Figma, PSD, Claude.ai
Project Duration :
2 Months
Overview :
Crextio is a web platform built for Chartered Accountancy students to practice for their exams the way they'll actually be tested — through structured, chapter-wise question sets that mix Descriptive, MCQ, and Case Scenario formats. Rather than a static question bank, it's built around two distinct study modes: a relaxed Tutor Mode for learning at your own pace, and a Timed Mode that simulates real exam pressure. The result is a single system that supports a student from first read-through to final revision.
Problem :
Right now, CA exam prep means juggling PDFs, printed notes, and separate timer apps just to simulate a real exam. Nothing talks to each other. Students can't practice by chapter, track weak areas, or revisit flagged questions — because no single tool does all three.
Solution :
Crextio replaces the folder-hunting with a guided 3-step flow — Group → Paper & Chapter → Topic & Difficulty — so a student builds a precise practice set in seconds.
From there, two modes take over: Tutor Mode, where answers, notes, and confidence ratings are visible instantly for learning — and Timed Mode, with a countdown, locked navigation, and overtime tracking for real exam pressure.
Each question type gets its own layout built around how it's actually tested: split-screen review for Descriptive, instant feedback for MCQs, and a fixed scenario stem with linked sub-questions for Case Scenarios. A Revision Hub, inline Notes, and a results breakdown (score, accuracy, time, correct/partial/wrong) close the loop after every session.
Target Users:
Key screens:
Design Decisions:
Warm palette over corporate blue — amber and beige instead of the cold, clinical tone most exam platforms default to, aimed at reducing exam-related anxiety during long sessions.
Two visually distinct modes — Tutor and Timed Mode share a layout skeleton but diverge in navigation freedom, color cues, and information density, so students always know which "mode" they're in at a glance.
Immediate vs. delayed feedback — Tutor Mode reveals answers instantly to support learning; Timed Mode locks feedback until submission to preserve exam realism.
Case Scenario as a first-class question type — rather than treating it as a variant of MCQ, it got its own navigation pattern (progress dots, fixed scenario panel) to reflect how it's actually tested.
Score card as a single source of truth — correct / partial / wrong / not-attempted counts, time spent, and average time per question all live on one card so a student doesn't have to dig through separate analytics screens to know how they did.
Challenges:
Modeling exam-realistic hierarchy — Group → Paper → Chapter → Category → Question Type → Difficulty is a lot of sequential decision-making to compress into a 3-step flow without it feeling like a form.
Case Scenario navigation — keeping one scenario stem visible and readable while a student moves between several linked sub-questions, without constant re-reading or scroll fatigue.
Designing for two opposing states — a calm, low-pressure Tutor Mode and a high-pressure Timed Mode needed to feel like the same product while behaving very differently (locked navigation, overtime tracking, pause/resume).
Evaluation ambiguity — descriptive answers can't be auto-graded, so the flow had to accommodate handwritten upload, "evaluate later," and (future) AI evaluation without leaving the student stuck mid-session.
Outcomes:
Delivered 61 production-ready screens covering the full study lifecycle — creation, practice, evaluation, revision, and account management — as a complete Figma design system ready for handoff to development.
(Add real metrics here if available — e.g. client/stakeholder feedback, usability test results, or post-launch engagement numbers — these carry more weight than screen count alone.)
Learnings:
Designing for two fundamentally different mental states (relaxed learning vs. timed pressure) inside one product taught me how much small interface decisions — locked navigation, color of a timer, whether an answer is visible — shape how "safe" or "high-stakes" a screen feels to someone using it. It also reinforced that exam-prep tools succeed less on question-bank size and more on how well the product removes friction between "I don't understand this" and "I've fixed it," which is what the Notes + Revision Hub loop was really designed to solve.