Capstone: Designing, Prototyping & Testing a Small App Feature

Empathize/Define first, before anything gets built: TidyTask's own support inbox shows a recurring real complaint — users forget to add a due date when creating a task, then miss it entirely. Define stage: "Users need due-date entry to be fast enough that they don't skip it when adding a task quickly." Ideate, Prototype, and Test come next — and per Chapter 1's own real finding, this loop stays non-linear: if testing later reveals this problem statement was wrong, the process returns here.

A short round of user interviews (asking about the last time someone forgot a due date, not a hypothetical) surfaces a real pattern: most users add tasks in a rush, between other activities. A persona built from that real data — "Sam, the Between-Meetings Task Adder" — goal: add a task with a due date in under 10 seconds, one-handed, on a phone.

TidyTask uses hierarchical navigation. The "Add Task" entry point needs to be a real front door reachable from the main task list directly — not buried two levels down, since Sam's own real goal is speed. No click-count target is enforced (per Chapter 3's own three-click-rule correction) — the entry point's own clarity matters more than counting clicks.

The "Add Task" button is placed in the bottom-right corner of the screen (Fitts's Law's own "magic corner" — effectively infinite target size, reachable one-handed with a thumb). The due-date picker offers a small, curated set of real choices — Today, Tomorrow, This Weekend, Pick a Date — rather than an open calendar by default, applying Hick's Law's real logarithmic relationship to keep decision time low for the common cases.

The task-text field and its due-date picker sit close together (proximity) and share consistent input-field styling (similarity), signaling they belong to the same task. The "Add" button gets real contrast against the surrounding form (Contrast); every date-choice chip repeats the exact same shape and spacing (Repetition); every element aligns to one shared left edge (Alignment).

The "overdue" task label is checked against WCAG's real 4.5:1 contrast requirement before shipping — measured, not eyeballed. Overdue status is shown with both a red color and a text label ("Overdue"), never color alone, per Chapter 6's own real color-blindness finding. Task text uses a real ~50-65 character line length on mobile for comfortable scanning.

Before real user testing, 3 team members independently review the wireframe against Nielsen's 10 heuristics. One real finding: the due-date picker gives no visible confirmation once a date is chosen (a real Visibility of System Status violation) — fixed by highlighting the selected chip before this ever reaches a real test participant.

A rough, low-fidelity wireframe (boxes and labels) tests whether the overall structure and flow make sense first, since the structure is still the open question at this stage (Chapter 8's own real rule of thumb). Once validated, a high-fidelity, interactive prototype is built — real spacing, real type, real color from Steps 5-6 — genuinely clickable, ready for a real test.

A moderated, think-aloud session with 5 real participants (Chapter 2's own real formula) finds a genuine problem: 2 of 5 participants didn't notice the "Pick a Date" option existed at all, defaulting to "Today" even when that wasn't accurate. Learn: the custom date option needs a real, distinct visual signifier. Redesign: add a small calendar icon to that one chip specifically. Retest: a second round of 5 confirms the fix — all 5 now find it, with completion rate rising from 60% to 100%.