Date: 2026-05-19
Viewport: 375x812 (mobile), DPR 2
Pages: Ticket detail (/ticket/3514 → MC-3505), Tasks (/tasks), Apps (/apps)
Method: Playwright headless screenshots + own inspection + GLM (Z.AI glm-5.1) vision second opinion.
Screenshots: /tmp/mux-glm-{ticket,tasks,apps}-{fold,full}.png
GLM was fed the three full-page screenshots. Its generic-but-true points were merged in;
points contradicted by the actual rendering (no horizontal table overflow — measured
scrollWidth==clientWidth==375 on all 3 pages; Apps is a 1-col list not a 4-col grid; no
checkboxes / numbered pagination / "Add App" button exist) were discarded.
System-wide
Blocker — Bottom nav overflows viewport with no scroll cue
- Where: Bottom tab bar, all pages.
- What: 10 items (Overview, Board, Workbench, Tasks, Apps, Open, Reports, Briefings,
Alerts, Console) total 592px inside a 375px viewport. The bar scrolls horizontally
but only ~6 items are visible and there is no fade/arrow/scroll affordance.
Screenshots show the trailing items literally clipped mid-glyph at the right edge
(
mux-glm-apps-full.png, mux-glm-ticket-fold.png).
- Why it hurts: 4 of 10 primary sections (Open, Reports, Briefings, Alerts, Console)
are effectively invisible to a phone user — they look like the nav simply ends at "Apps".
Core navigation is undiscoverable.
- Fix: Show 4–5 top items + a "More" tab that opens a bottom sheet with the rest; or add
a visible right-edge gradient fade + partial-item peek so the scroll affordance is obvious.
Page 1 — Ticket detail (/ticket/3514)
Screenshots: /tmp/mux-glm-ticket-fold.png, /tmp/mux-glm-ticket-full.png
Major — Metadata block pushes conversation far below the fold
- Where: Details / Status / Priority / Assigned To / Runtime stack between header and the
conversation thread.
- What: Stacked full-width key-value controls (Status select, Priority select, Assigned-To
select, Reopen button, Runtime panel, "Start session / Restart / Stop" buttons) consume the
entire first ~2.5 screens. The actual conversation does not appear until deep scroll
(
mux-glm-ticket-full.png).
- Why it hurts: The ticket's purpose — the conversation — requires sustained scrolling to
reach. On a phone the user opens a ticket to read it, not to manage its dropdowns.
- Fix: Collapse Details/Status/Priority/Assigned/Runtime into one expandable accordion
(collapsed by default), keeping only title + description + conversation visible on load.
Major — Header duplicates the ticket ID and burns vertical space
- Where: Top of ticket page.
- What:
MC-3505 appears twice (large H1, then again next to the back arrow + two
dropdowns), plus a separate timestamp block, plus a "Ticket is done; runtime is closed"
line, plus a profile/cwd/uptime metadata line — all before any content.
- Why it hurts: Redundant chrome eats the limited 812px and delays the user reaching
substance.
- Fix: Single ticket-ID treatment; fold the profile/cwd/uptime line into the Runtime
accordion; move the back arrow + status dropdowns into a compact sticky top bar.
Minor — Action button row is tight
- Where: "Start session / Restart / Stop" row + "Open raw console" link.
- What: Three buttons sit close together with a text link adjacent; on the runtime panel
the link wraps awkwardly next to the Stop button.
- Why it hurts: Stop is a destructive action sitting next to a navigation link — fat-finger
risk of mistapping.
- Fix: Min 44x44px targets, ≥8px gaps, move "Open raw console" to its own line; consider
separating Stop from Start/Restart.
Minor — Profile/cwd metadata line is small low-contrast grey
- Where:
profile claude_opus_1m_high · cwd /home/lucienne/... · uptime ... · last activity.
- What: Long path string in small dim grey, wraps to 2–3 lines.
- Why it hurts: Hard to read on a phone in daylight; low contrast.
- Fix: Larger min font (≥13px), higher-contrast grey, or hide path behind the accordion.
Page 2 — Tasks (/tasks)
Screenshots: /tmp/mux-glm-tasks-fold.png, /tmp/mux-glm-tasks-full.png
Major — Sort dropdown and search box are cramped on one row
- Where: Tasks toolbar — search input + "Sort: Last Run" select share a row.
- What: The search input is squeezed so its placeholder is truncated mid-word
("Search tasks (use #tag for tag-or…"). The sort select takes ~45% of the row.
- Why it hurts: User can't see the full search hint; the input is too narrow to
comfortably type/read a query on mobile.
- Fix: Stack search full-width on its own row; put Sort (and the lone sort-direction
button) on a second row, or move Sort into a filter bottom sheet.
Minor — Filter chips run off the right edge
- Where: "All / Overdue / Failed / Completed …" chip row below the toolbar.
- What: The "Completed" chip and any further chips are clipped at the right edge
(
mux-glm-tasks-fold.png); same hidden-horizontal-scroll pattern as the nav.
- Why it hurts: Filter options are partially hidden with no scroll cue.
- Fix: Wrap chips to a second line, or add a visible scroll affordance / make them
flex-wrap.
Minor — Orphan sort-direction button
- Where: Standalone "↓" button under the toolbar.
- What: A bare arrow button sits alone on its own line with no label.
- Why it hurts: Unlabelled icon-only control — unclear it's the sort-direction toggle.
- Fix: Pair it visually with the Sort select and add an aria-label / tooltip text.
Polish — Task cards are vertically loose
- Where: Task list cards (
json badge, hashtags, disabled / no runs yet pills).
- What: Each card has generous padding; only ~2.5 cards fit per screen.
- Why it hurts: With 128 tasks, scanning the list takes a lot of scrolling.
- Fix: Tighten card padding / line-height so 3.5–4 cards fit per viewport.
Page 3 — Apps (/apps)
Screenshots: /tmp/mux-glm-apps-fold.png, /tmp/mux-glm-apps-full.png
Major — App cards are oversized; very low information density
- Where: App list (CEO Dashboard, Portfolio, FinDash, Smart Money, …).
- What: Each card is a tall full-width block (~150px) holding only a title + one short
caption, with large empty padding below the caption. Only ~3 cards fit above the fold;
the full list (
mux-glm-apps-full.png) is a very long scroll for ~25 apps.
- Why it hurts: Excessive scrolling to find an app; the empty card space wastes the
small screen.
- Fix: Shrink card height (title + caption only needs ~64px) or use a 2-column grid so
6+ apps fit per screen.
Minor — "Service Controls" section buttons are small
- Where: Bottom "Service Controls" block — Start / Restart / Stop buttons per service.
- What: Three buttons share one row under each service; on 375px they're narrow.
- Why it hurts: Borderline tap-target width; Stop (destructive) sits beside Start/Restart.
- Fix: Ensure ≥44px height, adequate spacing, and visually separate Stop.
Polish — Section header "SERVICE CONTROLS" lacks separation
- Where: Divider between the app list and service controls.
- What: The transition from app cards to service controls is subtle — small caps label
only.
- Why it hurts: Easy to miss the context switch when scrolling fast.
- Fix: Stronger visual divider / spacing before the Service Controls block.
Summary
| Severity |
Count |
| Blocker |
1 |
| Major |
5 |
| Minor |
6 |
| Polish |
3 |
| Total |
15 |
Top 3 issues
- Bottom nav overflow (Blocker, all pages) — 592px of tabs in a 375px viewport, no
scroll cue; 4 of 10 sections are invisible to phone users.
- Ticket metadata buries the conversation (Major, ticket detail) — 2.5 screens of
dropdowns/runtime controls before the actual thread; collapse into an accordion.
- Apps cards waste space (Major, apps) — oversized full-width cards mean a ~25-app
list is a very long scroll; shrink cards or go 2-column.