Turn log redesign

E chosen: Show bar, card hangs from its pin

Round 4: five designs from your picks. Every one has the same six fixes, so compare them on layout:

1. One labelled "Show" control. Its stops add up, left to right: Answer only → Key messages → Most messages → All messages → Full log. Full log is every step with the messages in place, so it now reads as "everything", not as something "All" leaves out. 2. Usage is back as its own tab, beside Show. 3. A chevron in every state, Live included, left of the spinner. 4. The Jev card sits above the strip, as the spec says. I tries it underneath. 5. Hovering a message shows the full Jev card, and hovering a step keeps the one-line popover. 6. Jev off is shown under each design.

On the original hover, you're half right. Expanded, dragging along the strip swapped in the full Jev card for that message, so you did see the card. Minimised, hovering only showed a one-line peek of the nearest message, and a plain hover only captioned the step. Round 4 uses the full card in both states.

E · Footer Show bar (chosen)

2

Updated after your pick: the card now hangs from its pin, as in I, and a collapsed turn is just the head and strip again. The Show bar appears once the turn is open: the label, the five stops, then Usage and cost. Phone: the stops fold into a "Show" menu that says what each one adds. Jev off: the bar becomes Log · Usage.

E

Footer Show bar, desktop

↗

C's footer look, with D's single control, labelled.

E

Footer Show bar, phone

↗

Five stops don't fit, so it's a menu.

F · Card + drawer

2

B's shape: Jev card, strip, then Show, labelled, under the strip. Full log pulls a drawer out under the card, the raised drawer from A and B. The drawer's lip is C's footer: Usage and cost, there whenever the turn is open. Scrubbing swaps the card in place, as Jev does today.

F

Card + drawer, desktop

↗

Messages in the card, raw steps in the drawer.

F

Card + drawer, phone

↗

All five stops fit as a full-width control.

G · One list, with a Show slider

2

The drawer always holds one list, and the slider sets how much is in it. At Key it lists the 3 key messages, an index for the card above. At Full log the same list fills in with every step. A caption names the stop and what it adds. Footer: C's bar at the bottom of the drawer.

G

One list, desktop

↗

You can see what each stop adds, because the list grows.

G

One list, phone

↗

The slider fits a phone; its labels stay readable.

H · Less / More stepper

2

No scale to read. The footer shows where you are ("Key messages · 3"), and each button names the stop it goes to: − Answer, Most +. The footer only appears once the turn is open, so collapsed turns stay short. Hover: a step gets the line, a message gets the card.

H

Stepper, desktop

↗

The smallest control that's still clear.

H

Stepper, phone

↗

Buttons drop their labels; the caption stays.

I · Card under the strip, pointing at its moment

2

The beneath option, and why it might be worth it. The card hangs under the strip with a caret on its pin, so you can see when it was said. The hover card shows in exactly the same place, so a hover previews the open turn exactly. Show is a menu in C's footer, on both desktop and phone.

I

Card hangs from pin, desktop

↗

Hover and open look the same.

I

Card hangs from pin, phone

↗

The caret clamps to the card's edge near the ends.

Round 3, for reference: sections P and A to D below.

Round 3: four ways to combine One panel (2) and Raised sheet (6), with Jev and the strip popover built in. Skills stay events everywhere. Every direction shows Collapsed, Live and Expanded on desktop and phone. Round 2 is at the bottom, collapsed.

What I took as "the timeline popover": the hover card on the strip. Today there are two of them: the head tooltip (hovered step plus turn totals) and Jev's minimised peek (nearest message). Section P merges them, and every direction uses it. Tell me if you meant something else.

Sample turn: 4m 12s, 15 steps, 2 skill loads, 1 failed check, 1 compaction, and 5 surfaced messages, one of them an open Ask.

P · One strip popover (used by every direction)

2

One popover, showing whatever is under the pointer. A step shows verb, subject, duration and time into the turn. A message shows its badge and text, and clicking opens it. Turn totals leave the popover: they don't change with where you hover, so they move to Usage or the footer. Phone: press and drag on the strip to scrub, lift to open.

P

Strip popover, desktop

↗

Replaces both today's head tooltip and Jev's peek.

P

Strip popover, phone

↗

Full width under the strip, caret on the touch point.

A · Tabbed panel (Jev as a tab)

2

Container: 2's bordered panel. Tabs from 6: Messages · Steps · Usage, in the head (under the strip on phone). Jev is the Messages tab, and numbered pins replace the strip dots while it's open. Default tab: Steps while live, Messages once done. Jev off: the Messages tab goes and this is 6 inside 2's border.

A

Tabbed panel, desktop

↗

The most familiar shape: one box, three views.

A

Tabbed panel, phone

↗

Tabs go full width under the strip.

B · Jev on top, steps drawer underneath

2

Jev is not a tab here. Messages are what you read, so they stay in the card as they do today. Raw steps pull out from under the card as a raised drawer, with 6's lift and 2's attachment, and Steps · Usage tabs. Opener: the Steps button in the level row, or a click on the strip. Jev off: the card is the plain head and the drawer is 6's sheet.

B

Jev + drawer, desktop

↗

An open Ask is never hidden behind a tab.

B

Jev + drawer, phone

↗

The Steps button drops on phone; tap the strip instead.

C · Footer tab bar

2

2's footer bar becomes the tab bar. It's a control, so it can't pass for a step, and it carries the cost on the right. Always visible, even collapsed: one click to any view. Cost: every collapsed turn grows by about 38px. Jev off: Steps · Usage only.

C

Footer tabs, desktop

↗

The tab underline sits on top, pointing at what it opened.

C

Footer tabs, phone

↗

Cost shortens to dollars; tabs stay.

D · One dial (novel)

2

Jev's level row gains a fifth stop: Steps. It stays under the strip, where Jev's levels live today. Final, Key, Balanced and All filter messages. Steps shows everything, with messages badged in place. This works because messages already are steps (the text parts), so it's one control instead of tabs plus levels. Usage: 2's footer bar. Jev off: the dial goes and this is exactly 2.

D

One dial, desktop

↗

Removes a concept instead of adding one.

D

One dial, phone

↗

Counts drop from the dial on phone; the pins carry them.

Round 3 lean was D. It removes a concept, and with Jev off it falls back to 2, the one you liked. Safe pick: A, the most familiar. B if an open Ask should never sit behind a tab.

Round 2, for reference: sections 0 to 7 below.

0 · Today (reference)

2
0

Today, desktop

↗

Dashed: the footer that reads as a step.

0

Today, phone

↗

Same, at 390px.

1 · Head ledger (your pick, refined)

2

Skills: named pills in the head card, with diamonds on the strip where each loaded. Bill: head card, right of the pills. Log: steps only; a skill row says "Skill", not "Loaded", and has no duration, since loading takes milliseconds and the number means nothing.

1

Head ledger, desktop

↗

Everything about the turn sits in the card; everything below it is a step.

1

Head ledger, phone

↗

The bill drops to its own line under the pills.

2 · One panel

2

Container: the head card and the log become one bordered panel. The log is its body, the bill is its footer bar. Skills: inline event pills where they loaded, plus "2 skills" in the sentence.

2

One panel, desktop

↗

The border answers “does this belong to the turn?” and the footer bar can't be mistaken for a row.

2

One panel, phone

↗

Panel edges line up with the message column, so it reads as one block.

3 · Recessed tray

2

Container: the log opens as a sunken tray inside the head card, like a drawer pulled out. The raw output looks lower and quieter than the summary above it. Skills: labelled diamonds on the strip. Bill: cost in the head, full bill at the bottom of the tray.

3

Recessed tray, desktop

↗

Raw steps read as machine output, set apart from the prose around them.

3

Recessed tray, phone

↗

The tray bleeds almost to the card edge to keep row width.

4 · Timeline rail

2

Structure: steps hang off a vertical rail. A coloured dot replaces each icon, a diamond marks a skill load, and the rail ends in a "Done" node that carries the bill. No container: the rail does the grouping.

4

Timeline rail, desktop

↗

A skill is a point on the line, which is exactly what we know about it.

4

Timeline rail, phone

↗

Dropping icons gives back the width the rail costs.

5 · Ledger table

2

Structure: a bordered table, with columns for time into the turn, kind, step, and how long it took. Totals are the footer row. Most "raw" of the set, and best for scanning when things happened.

5

Ledger table, desktop

↗

The “At” column puts skills, failures and the compaction on one clock.

5

Ledger table, phone

↗

Columns tighten; the bill wraps in the footer.

6 · Raised sheet with tabs

2

Container: opening lifts the card into a raised sheet with two tabs. Steps holds only steps. Usage collects everything that isn't a step: cost, tokens, context, skills (with load times), failures and compactions. Has a fourth state for the Usage tab.

6

Raised sheet, desktop

↗

The cleanest split: the metadata gets a real home instead of a footer.

6

Raised sheet, phone

↗

Tabs move under the strip.

7 · Hairline gutter (minimal)

2

Container: none. A hairline drops from the card and the log hangs off it. Skills: in the sentence and as "Skill" rows. Bill: just the cost, top right; the rest on hover. The smallest change that still fixes the bug.

7

Hairline gutter, desktop

↗

Nothing follows the last step, so nothing can pass for one.

7

Hairline gutter, phone

↗

Phones lose hover, so the full bill needs a tap target. That's the open question.