Boiling Pot Clock — Sketch narrative

Context: This clock supports cooking on a desktop while multitasking. I often start multiple timers (boil, simmer, rest), and I need a quick “at-a-glance” view of how long has passed/what’s happening without reading small digits.

Design decisions:

  • I used a “boiling pot” metaphor to map time to cooking cues: flames indicate hours (heat level), ingredients/steam show minutes (progress), and bubbles/wiggles show seconds (activity).
  • I kept a large central pot and high-contrast shapes so it stays readable from a distance on a laptop screen.
  • Motion is subtle and limited to time-dependent elements to avoid distraction while still conveying “live” status.

Future work:

  • Add a mode to pin multiple named timers (e.g., “eggs”, “pasta”) and show remaining time.
  • Add accessibility options (reduced motion / higher contrast).

Sketch evolution

Sketch A evolution step 1
Step 1 — initial layout and annotated design decisions
Sketch A evolution step 2
Step 2 — second layout after peer feedback
Sketch A evolution step 3
Step 3 — refined visuals and final implementation

Sketch B — Sketch narrative

Context: This sketch explores an alternative cooking-themed clock that remains glanceable while I’m multitasking (stirring, prepping, or watching a recipe video). The goal is to communicate time using cooking cues rather than small numerals.

Design decisions:

  • I kept a clear hierarchy by separating hour, minute, and second into distinct visual channels (heat / progress / motion), so each unit reads quickly and consistently.
  • I prioritized minute readability by mapping minutes to countable repeated elements, which is easier to scan from a distance than dense ticks or tiny text.
  • Animation is limited to second-level cues so the overall composition stays calm and non-distracting while still showing that time is “live.”

Future work: Add optional 5-minute highlights and a reduced-motion toggle for accessibility and comfort.

Steam Bar Kitchen Clock — Sketch narrative

Context: This sketch focuses on a highly glanceable encoding for cooking, where I may only look at the screen briefly while handling hot cookware or ingredients. It should communicate time clearly without relying on small numbers.

Design decisions:

  • I mapped minutes to a 60-bar steam chart: the first mn bars are active, so I can instantly see how far into the hour we are.
  • I mapped hours to burner flames (more flames = higher hour), matching the cooking metaphor of “heat level.”
  • Seconds are shown through subtle wobble and motion in the steam/bubbles, keeping the clock feeling alive without adding clutter.

Future work: Add a reduced-motion option and higher-contrast mode, plus optional 5-minute tick highlights to make minute estimation even faster.