Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →A lo-fi multi-screen MOBILE flow wireframe — three or four phone frames laid out in a row on a board, showing a connected user flow (Onboarding → Home feed → Item detail → Confirm). Grey-box content inside each device, dashed connector arrows + numbered step labels between screens, and a couple of annotation callouts. Reads like an app flow pinned to a whiteboard before any pixels are committed. Use when the brief asks for "mobile wireframe", "app flow", "user flow wireframe", "lo-fi mobile", "l
.claude/skills/nexu-io-wireframe-mobile-flow/SKILL.md| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-03 | ✗→✓ | ▲ Improved | 9% | 0% |
| case-20 | ✓→✗ | ▼ Worse | 9% | 0% |
| case-21 | ✓→✗ | ▼ Worse | 137% | 0% |
| case-22 | ✓→✗ | ▼ Worse | 162% | 0% |
| case-01 | ✗→✗ | ＝ Same ✗ | 9% | 0% |
Produce a single board showing a mobile app's user flow as a row of lo-fi phone frames. The point is the flow — how a user moves screen to screen — not the polish of any one screen. Keep the screens clean grey-boxes (not scribbly) but keep the connectors and annotations loose and informal.
deliberately low-fidelity: greyboxes, placeholder rects, and bars stand in for real content. Honor type tokens only loosely (system sans for the board, mono for labels and datelines).
like Onboarding → Home feed → Item detail → Confirm. Name each step so the connector arrows can carry a numbered, verb-first label ("① tap Start", "② open item", "③ add to cart").
MOBILE" tag (dashed border, slight rotation) and a mono dateline on the right (date / device / fidelity).
horizontal row, each with a notch / status bar. Inside each frame put the greybox content for its step: hero image-placeholder (rect + X), title/price bars, list cards (thumbnail X + 2 text bars), category chips, a bottom tab bar, sticky CTA bars, a confirm checkmark — match the screen's role.
a small mono step label describing the tap that advances the flow.
to flag intent ("hero must sell value in 3s", "checkout = 1 screen").
<!doctype html> through </html>, CSS inline, no external JS, noexternal images (CSS/SVG placeholders only).
Google Fonts; a light marker font is allowed for annotations only.
screens, and a single accent color for arrows and annotations so the board reads clearly even as a small thumbnail.
data-od-id on the header, each phone screen, the connectors, and theannotations.
left-to-right.
the loose, informal parts.
border. If a screen renders blank as a thumbnail, raise the contrast.
Emit between <artifact> tags:
<artifact identifier="wireframe-slug" type="text/html" title="Wireframe — Title">
<!doctype html>
<html>...</html>
</artifact>One sentence before the artifact, nothing after.
| Case | Status | Duration (ms) | Turns | Tokens | Tool calls | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Without | With | Δ | Without | With | Δ | Without | With | Δ | Without | With | Δ | ||
case-01 | fail→fail | 72,619 | 52,453 | -28% | 1 | 1 | 0% | 8,291 | 9,069 | +9% | 0 | 0 | — |
case-02 | fail→fail | 50,682 | 38,132 | -25% | 1 | 1 | 0% | 8,286 | 9,064 | +9% | 0 | 0 | — |
case-03 | fail→pass | 39,460 | 38,288 | -3% | 1 | 1 | 0% | 8,297 | 9,075 | +9% | 0 | 0 | — |
case-04 | fail→fail | 64,823 | 62,907 | -3% | 1 | 1 | 0% | 8,283 | 9,061 | +9% | 0 | 0 | — |
case-05 | fail→fail | 41,468 | 38,965 | -6% | 1 | 1 | 0% | 8,273 | 9,051 | +9% | 0 | 0 | — |
case-06 | fail→fail | 77,522 | 50,386 | -35% | 1 | 1 | 0% | 8,272 | 9,050 | +9% | 0 | 0 | — |
case-07 | fail→fail | 39,582 | 38,511 | -3% | 1 | 1 | 0% | 8,265 | 9,043 | +9% | 0 | 0 | — |
case-08 | fail→fail | 72,390 | 49,488 | -32% | 1 | 1 | 0% | 8,276 | 9,054 | +9% | 0 | 0 | — |
case-09 | fail→fail | 47,827 | 50,370 | +5% | 1 | 1 | 0% | 8,280 | 9,058 | +9% | 0 | 0 | — |
case-10 | fail→fail | 49,853 | 53,060 | +6% | 1 | 1 | 0% | 8,272 | 9,050 | +9% | 0 | 0 | — |
case-11 | fail→fail | 36,774 | 44,992 | +22% | 1 | 1 | 0% | 8,269 | 9,047 | +9% | 0 | 0 | — |
case-12 | fail→fail | 36,162 | 48,031 | +33% | 1 | 1 | 0% | 8,265 | 9,043 | +9% | 0 | 0 | — |
case-13 | fail→fail | 51,031 | 63,472 | +24% | 1 | 1 | 0% | 8,269 | 9,047 | +9% | 0 | 0 | — |
case-14 | fail→fail | 76,859 | 51,847 | -33% | 1 | 1 | 0% | 8,265 | 9,043 | +9% | 0 | 0 | — |
case-15 | fail→fail | 68,227 | 41,587 | -39% | 1 | 1 | 0% | 8,261 | 9,038 | +9% | 0 | 0 | — |
case-16 | fail→fail | 53,546 | 43,034 | -20% | 1 | 1 | 0% | 8,260 | 9,038 | +9% | 0 | 0 | — |
case-17 | fail→fail | 37,552 | 37,575 | +0% | 1 | 1 | 0% | 8,267 | 9,045 | +9% | 0 | 0 | — |
case-18 | fail→fail | 40,579 | 39,318 | -3% | 1 | 1 | 0% | 8,265 | 9,043 | +9% | 0 | 0 | — |
case-19 | fail→fail | 48,484 | 50,279 | +4% | 1 | 1 | 0% | 8,276 | 9,054 | +9% | 0 | 0 | — |
case-20 | pass→fail | 48,629 | 40,730 | -16% | 1 | 1 | 0% | 8,247 | 9,025 | +9% | 0 | 0 | — |
case-21 | pass→fail | 26,851 | 40,776 | +52% | 1 | 1 | 0% | 3,810 | 9,021 | +137% | 0 | 0 | — |
case-22 | pass→fail | 18,130 | 41,965 | +131% | 1 | 1 | 0% | 3,439 | 9,003 | +162% | 0 | 0 | — |
DecimalAI ran this skill against gemini-3.6-flash twice over the same eval suite — once with the skill loaded and once without — and compared the two runs case by case. 22 cases were attempted. The headline lift of -9 percentage points is the difference between those two pass rates over the 22 comparable cases. 6 cases got worse with the skill loaded, and they are included in that figure.
Without the skill loaded, the model failed this case. With it loaded, the same prompt on the same model passed. This is one improved case from the latest verified run; every case, including any that regressed, is in the table above.
Other measured skills in the registry, with their headline benchmark lift.