Design canvas: Hair photo journal ("Your hair, in photos")
Four directions for the same data: every check-in photo she has taken, each anchored to a wash, a day number, and (when set) a feel word. The unusual thing about this journal is that the photos already have structure: a wash cycle is a short time series, so "day 2 after this wash" and "day 2 after that wash" are comparable in a way random camera-roll photos never are. Each direction leans on that structure differently. Feel is shown as one pink dialed by intensity, never red/green, because a feel is a self-report and not a grade.
Direction A: Wash strips
A row per wash, columns by day. Reads like a contact sheet of her cycles: scan a row to watch one wash play out, scan a column to compare every "day 2". Months are thin rules between rows. Because it is a grid, nothing needs a filter to be findable.
A1: Journal
Each row is one wash. Look down a column to compare the same day across washes.
Wash dayDay 1Day 2Day 3+
August
July
Empty cells are honest: no photo that day. A cell with no feel pill = a check-in from before the feel scale.
Tapping any photo opens the full-screen view (shared state below). Tapping the date rail opens the wash. Older months page in as she scrolls.
Direction B: Day ladder
Compare like with like. A chip row picks a day in the cycle; the grid then shows every photo from that day, newest first, big. "All" is the plain timeline. This is the progress question answered directly: is my day 2 getting better?
B1: Day 2 selected
AllWash dayDay 1Day 2Day 3+
Every day 2, newest first. Same day in the cycle, so the change you see is real.
The newest photo for the chosen day is the hero; the rest fall into a two-up grid. The feel dot uses the same intensity scale everywhere.
B2: All (plain timeline)
AllWash dayDay 1Day 2Day 3+
August 2026
July 2026
Under "All" the label is the day in the cycle, since the month header already carries the date. This is what the brief's smallest version looks like on its own.
Direction C: Flipbook
One big photo and a scrubber. Drag through time and her hair flips like a flipbook; the dots on the track are her photos, pink dialed to how each day felt, with month ticks. Hold the "Then" chip to ghost her first photo over the current one. The most tactile of the four, and the one that feels most like watching change rather than reading it.
C1: Scrubbing
Then
Day 2 · Good
Washed Aug 28 · 4 products
MayJunJulAug
Drag to move through time
Tap the hero for the full-screen view. Swiping the hero left/right steps one photo; the scrubber jumps. The thumb rail under it follows the knob.
C2: Holding "Then"
Then · May 9
Now · Day 2 · Good
Your first photo, ghosted over today. Let go to come back.
MayJunJulAug
Drag to move through time
"Then" is the cheapest possible before/after: no picker, no second screen, just a press-and-hold. It is also where a real compare tool would grow from later.
The ghost is a multiply blend at ~45%, so both heads read at once without either taking over.
Direction D: Month mosaic
A calendar of her hair. Days with a photo show the photo with a feel-tinted ring; wash days carry a small drop; everything else is quiet. It makes rhythm visible (how her photos cluster after each wash) and gives the month a shape she can recognise at a glance.
D1: August
SMTWTFS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
felt great okay rough wash day
This month: 4 washes, 9 photos. Your photos tend to land on day 1 and day 2, right when your curls are settling in.
The summary line is the one place this direction says anything. It stays descriptive (where photos land), never a verdict on the hair.
Tapping a photo day opens full screen; tapping a wash-only day opens the wash. Months swipe. The legend words are plain, not the five feel labels, so the row stays short.
Shared states (any direction)
The full-screen view, the empty state, the error state, and the MeTab entry row are the same regardless of which direction wins.
S1: Full screen
Swipe left/right moves through the journal in whatever order the screen was showing. "Compare with then" only appears if Direction C's hold-to-ghost is adopted; otherwise the single action is "See this wash".
S2: Empty
Your hair's story starts here
Add a photo to a check-in and it shows up in your journal, so you can watch your hair change over time.
Log a wash
When she has washes but no photos yet, the CTA becomes "Open my latest wash" so the path to a first photo is one tap. Under Direction B the chip row is hidden here; under D the calendar shows with no photo days.
S3: Error + loading
That didn't load
Your photos are safe. Want to try again?
Try again
While loading
Skeleton tiles in the shape of the chosen direction (strips, cells, or calendar days) rather than a page spinner, so the layout does not jump when photos arrive.
Paging older photos shows a small inline spinner at the list tail; a single photo that fails to render falls back to a soft tile with the day label, never a broken image.
S4: MeTab entry row
Your hair journey
Your patternsWhat's working for your hair
Your photosWatch your hair change over time
Talk it overAsk about your own hair
Before any photo exists the subtext reads "Photos from your check-ins collect here". The row sits between patterns and Hair Talk, since it is the same "look back at your own data" family.
Row icon is a tiny 2x2 photo mosaic in pink, the only new glyph this feature adds.