END-TO-END PRODUCT DESIGN — INSIGHTS → FLOWS → PROTOTYPE (DEMO) → SYSTEM → HANDOFF
A clarity-first planning system that turns messy deadlines into clear next actions
Built a focus-first journey that helps users prioritize, schedule, and progress—packaged as an interactive demo and deck-ready narrative for fast alignment.
Designed to ship: reusable components + edge states + handoff-ready specs for consistent rollout.
Journey map • process flows • storyboard/deck beats • hi-fi mockups • interactive prototype • visual specs
Metrics: 8 screens • 10 components • 3 story iterations • 6 feedback loops • 1 demo flow
ROLE
Product/UX Designer
EXPERTISE
End-to-end UX • Prototyping • Design Systems • Usability
YEAR
2025
Study Planner is a focus-first planning system that turns messy academic deadlines into clear next actions—without overplanning or guilt loops. I translated user + workflow needs into a clarity-first journey (capture → prioritize → schedule → progress → adjust), then built a demo-ready UX system that’s easy to explain, easy to test, and ready to ship.
Instead of “more features,” it prioritizes decision clarity + resilience: 1–3 daily priorities, a Next Best Action model, frictionless rescheduling, and predictable edge states (empty/loading/error/recovery) that keep momentum on imperfect days. Deliverables were designed for reuse (components, variants, interaction rules, specs) so teams can iterate fast, collaborate smoothly with engineering, and scale the system consistently over time.
Timeline
3–5 weeks — Discovery → Journey/Flows → Hi-fi → Interactive demo (code-ready behaviors) → Validation loops → Handoff
Background
Students don’t fail because they lack ambition—they drop off when planning becomes cognitive overload: too many tasks, unclear priorities, and the “missed day = reset” mental model. Study Planner reduces decision fatigue with a clarity-first workflow and quick feedback loops, supported by a component-driven UI system that scales—making progress feel simple, calm, and repeatable.
Deliverables
Journey map • flow diagrams • interactive prototype • narrative walkthrough/deck beats • component + state system • handoff specs
End-to-end product design packaged as a customer-ready story: requirements → journey → deck/demo assets → interactive prototype → system → handoff—built to reduce decision friction and handle real-life variability (missed days, changing workload, low-energy moments).
1) Cross-functional + constraints
Partnered with PM + Engineering to translate study workflow constraints into decision moments, edge states, and handoff-ready specs—aligning early on feasibility so what we demo matches what ships.
2) Story templates / flows / diagrams
Used repeatable templates to produce journey maps, process flows, and concept diagrams—making the before → after narrative easy for stakeholders to grasp and reducing downstream rework.
3) Fast iteration
Iterated quickly from flows → wireframes → hi-fi → interactive prototype, incorporating feedback loops to refine clarity, hierarchy, microcopy, and reschedule/recovery behaviors.
Research & Insights
Goal: understand why students drop routines and what “good planning” feels like.
Quick interviews + lightweight survey to map pain points (overplanning, unclear priorities, guilt loops).
Synthesized into JTBD + success metrics: faster task selection, fewer “what now?” moments, higher perceived control.
Key insight: students don’t need more reminders—they need a system that chooses the next action and supports recovery.
IA & User flows
Designed around decision moments (not screens):
Core journey: onboarding → capture tasks → prioritize (1–3) → schedule → daily check-in → reschedule/recovery
Predictable behavior via a state system (empty/loading/error/recovery)
Crafted “Today” information hierarchy to keep attention narrow, action-oriented, and demo-friendly
Design, prototyping & iteration
Started low-fi for structure, then moved to hi-fi with accessible typography + reusable components
Prototyped key interactions: quick prioritize, Next Best Action CTA, one-tap reschedule, minimum-effort mode
Ran quick validation loops on hierarchy clarity, microcopy comprehension, and confusion points under constraints
Handoff-ready specs
Documented components, variants, spacing, and edge states for consistent implementation
Provided interaction notes (missed-day logic, reschedule rules, error handling) to reduce back-and-forth with engineering
Packaged the work as a demo-ready narrative + reusable system for scalable reuse
Deliverables
Journey map • flow diagrams • story beats/deck • interactive prototype • component + state library • handoff specs
Smart task breakdown
Converts high-level goals (e.g., “Finish Chapter 5”) into sequenced, do-able steps with estimated effort + time blocks. Adds context (deadline, difficulty, dependencies) to reduce planning friction and keep execution realistic.
Impact → less overwhelm • clearer starting point • faster follow-through
Focus-first Today view
A single screen optimized for fast decision-making and momentum:
Top 1–3 priorities with a clear “why this matters” cue
Time blocks + Next Best Action (clarity-first CTA)
Progress + status states (empty/loading/error/recovery) to keep the UI predictable
Actionable microcopy (non-judgmental, no-guilt language)
Impact → fewer “what now?” moments • quicker starts • higher perceived control
Recovery and rescheduling
When users miss a day, the system supports graceful recovery instead of reset:
One-tap reschedule based on remaining days + available time
Minimum-effort mode (short, realistic plan to restart momentum)
Non-punitive progress logic + clear next steps after slip-ups
Edge-case coverage (missed day, overloaded day, incomplete task, conflicts) with handoff-ready rules
Impact → stronger return-to-routine behavior • less drop-off after misses • more consistent progress
“Designed a focus-first study planner that reduces overwhelm and helps students start faster, plan realistically, and stay consistent—through clarity-first priorities and a recovery system for imperfect days.”
Faster planning, more doing
Moved users from manual scheduling to guided breakdown + “Next Best Action” and a single-screen Today view.
Impact → faster task selection, fewer “what now?” moments, quicker start-to-study behavior.
Better consistency through recovery
Designed one-tap reschedule, minimum-effort mode, and non-punitive streak logic so missed days don’t feel like a reset.
Impact → higher return-to-routine behavior, more completed sessions even on low-energy days.
Higher confidence and clarity
Made priorities visible with 1–3 focus slots, clear time blocks, and predictable edge states (empty/loading/error/recovery).
Impact → higher perceived control, studying feels manageable instead of chaotic; easier to iterate based on feedback.