← Back to the mockups

Crew B66 mockups, round 2

All mockups use a 393 × 852pt iPhone frame, the production village image, Schibsted Grotesk, the warm paper palette, the approved radius and shadow tokens, and a forced light theme. Every form control explicitly inherits the Schibsted Grotesk stack, with no invalid font shorthand. Messages remains at the top-right of the village. No surface adds scenery to the village.

Surface 1: shared entry

The permanent village wordmark is replaced by one labelled 44pt-high `Made things` plate at the top-left. Its quiet count communicates that two things changed. The existing Messages control keeps the top-right. The standalone `Walk to The Square` pill is shown only as a struck-out before state, because Square and Shelf are now one place reached from one entry.

Surface 1, form D: open in place

Form D is a visual, full-screen collection. Each made thing has its own pixel object, current real state, and written status. Opening a thing expands its working surface inside the collection's existing vertical flow and pushes later things down.

1. One scroll axis: the made-things destination has one vertical collection scroll. Inline expansion remains inside that scroll. There is no horizontal strip, inner scroller, or independently scrolling panel.

2. Not a drawer: this is a full-screen place entered from the village. It has no grabber, detent, overlay edge, or pulled-up geometry.

3. Nothing added to the village: only the shared top-left entry plate changes. The production village art remains untouched.

4. Not top-right: the entry is top-left. Messages alone keeps the top-right.

5. Guaranteed return: the labelled `Village` control is pinned above the one scroll, measures 100 × 44pt, and remains present in collection, expanded, and scrolled states.

6. Made things are the subject: every row is led by a distinct, large pixel object rather than a section label or generic icon.

7. State lives on things: unread, new, building, live, complete, and updated states are written directly on their made thing. The single All / Needs you / New segment swaps the same collection in place.

8. One primary action: the collection has `Make something` in green. When a thing is expanded, its one contextual action replaces that collection action.

9. Content-derived: the expanded region grows to the actual working content. It has no fixed sheet height or detent.

Founder tradeoff: D scans and scales well, but a deeply expanded thing can push later things far down the scroll. The pinned Village exit prevents trapping, while collapse restores the short collection.

The collection now reserves a 140pt bottom scroll inset and a soft paper fade before the pinned `Make something` action, so the final row visibly continues beneath the action without adding an opaque footer. New and unread chips use green-tint paper with green-deep ink. The blue tokens have been retired.

Surface 1, form E: one thing per screen

Form E is a single vertical snap-scroll. Each made thing owns one screen with a large pixel object, current state, status, and one action. A deliberate next-item peek makes the continuation visible.

1. One scroll axis: the library is one vertical snap-scroll. There is no horizontal paging, nested details scroller, or second list.

2. Not a drawer: this is a full-screen destination with no grabber, overlay, detent, or sheet edge.

3. Nothing added to the village: the production village remains untouched behind the shared entry. The destination is separate.

4. Not top-right: the village entry is top-left. Messages alone keeps the top-right.

5. Guaranteed return: the labelled `Village` control is pinned above the snap-scroll, measures 100 × 44pt, and remains present mid-snap and in needs-you states.

6. Made things are the subject: the pixel object occupies most of each screen and the thing's live state follows it directly.

7. State lives on things: new, building, complete, conversation, and needs-you state belongs to the current thing. No secondary activity list exists.

8. One primary action: each screen has exactly one contextual green action for the current thing.

9. Content-derived: each snap page lays out the real thing and its current state. There is no content tray or fixed detent.

Scaling past about 12 things: the same vertical snap stream continues with indexed position and server-backed loading. The All / Needs you / New segment may swap that one stream in place. It never adds another axis. Returning users resume at the last viewed thing, while changed things can be sorted forward.

Founder tradeoff: E gives each thing more identity and makes state easy to understand, but it is slower for scanning a large library and creates more swipes as the collection grows.

Workout Tracker, Mood Tracker, and Interview Prep Board now use larger, detailed pixel objects that command the existing stage. New and unread chips use green-tint paper with green-deep ink. The blue tokens have been retired.

Recommendation: choose D. It preserves the visual character of every made thing while making six, twelve, or many more things faster to scan. Inline opening also fixes the Square trap structurally without turning the library into a long sequence of full-screen swipes.

Surface 2: the complete result

The AFTER result is one client surface containing the full recommendation and all four comparison rows. Nothing is truncated and there is no short/tall mode. With the hardcoded height and minimum height removed, the rendered content determines a measured height of 490pt. This leaves 342pt of the live village visible inside the device. The only space after the decision is the intended 29pt bottom padding for home-indicator clearance. The 44 × 44pt close control is owned by the client surface and stays pinned if the result ever reaches its one max-height scroll. `Approve Leo's reply` is the only green decision.

Surface 3: the continuous dock

The ordinary shipping resting dock is shown once only as reference. It is not a third voice-session state. The two voice states are:

Exact dock geometry and waveform measurements:

| Measurement | Round 1 | Round 2 |

|---|---:|---:|

| Capsule footprint | 229 × 56pt | 229 × 56pt |

| Bar count | 11 | 11 |

| Bar width | 5pt | 4pt |

| Gap | 5pt | 4pt |

| Peak height | 44pt | 32pt |

| Total waveform width | 105pt | 84pt |

The same capsule ends the call. The state words have been removed from inside the capsule, so the 84pt waveform stays optically centred on the full 229pt width. White with a low waveform means listening; green with a moving waveform means being heard. A 12 × 12pt filled stop square with a 3pt radius sits at the trailing edge, clear of the waveform. It uses warm ink at 15.48:1 against white and 5.55:1 against green. The whole 229 × 56pt capsule remains the hit target, and its accessibility label says `Tap to end call`. There is no separate End Call control, status card, or stolen dock slot.

Surface 4: launch

Warm launch: show the plain lowercase `crew` wordmark on paper for about 220ms, then replace it with the live village and settled dock. There is no painted reveal between them.

Cold launch: keep the same plain wordmark visible only while the first usable village frame loads. The instant the village is usable, replace the wordmark with it. Do not estimate a percentage or claim readiness.

The village chrome pair stays for review. Before has the permanent wordmark at top-left. After uses the same top-left `Made things` entry introduced by Surface 1, opposite Messages at top-right. The live launch frame and shared-entry surface therefore agree exactly.

App changes by surface