ncode
091bdc2a96
Design inspiration is the Teenage Engineering EP-133 manual: flat fills, heavy outlines, hard zero-blur offset shadows, one orange accent, uppercase technical type, monospaced numerals. Six artboards drawn at the real measured 360x735 with the actual vertical budget (44px pickers, 485px panel, 116px info, 58px tabs), so a mockup cannot fit in a way the device won't: - Current the app as it stands, for comparison - A Manual light ground, 2px black outlines, black pads - B Blueprint pure black, 1px white hairlines, no fills - Specimen type candidates and palette, incl. which orange Type is identical across both directions so the light/dark choice is not confounded with the font choice. Green/red drill feedback is replaced by orange fill vs dashed outline - neither exists in this palette. The seeded canvas payload is gitignored; these files are its source. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
42 lines
2.2 KiB
JSON
42 lines
2.2 KiB
JSON
{
|
|
"artboards": [
|
|
{ "file": "Current.dc.html", "x": 0, "y": 0, "w": 360, "h": 735, "title": "Current — Explore" },
|
|
{ "file": "Main.dc.html", "x": 440, "y": 0, "w": 360, "h": 735, "title": "A · Manual — Explore" },
|
|
{ "file": "ManualDrill.dc.html", "x": 880, "y": 0, "w": 360, "h": 735, "title": "A · Manual — Drill" },
|
|
{ "file": "BlueprintExplore.dc.html", "x": 1320, "y": 0, "w": 360, "h": 735, "title": "B · Blueprint — Explore" },
|
|
{ "file": "BlueprintDrill.dc.html", "x": 1760, "y": 0, "w": 360, "h": 735, "title": "B · Blueprint — Drill" },
|
|
{ "file": "Specimen.dc.html", "x": 0, "y": 855, "w": 880, "h": 640, "title": "Type & colour" }
|
|
],
|
|
"annotations": [
|
|
{
|
|
"id": "note-current",
|
|
"x": 0,
|
|
"y": -190,
|
|
"w": 360,
|
|
"text": "CURRENT — for comparison.\nBarlow, soft filled greys, rounded corners, green/red drill feedback. Everything is a slightly different grey, so nothing leads."
|
|
},
|
|
{
|
|
"id": "note-a",
|
|
"x": 440,
|
|
"y": -190,
|
|
"w": 800,
|
|
"text": "A · MANUAL (light) — the EP-133 manual and product page.\nLight body, black 2px outlines, hard offset shadows, black pads, solid orange for lit keys.\nMost faithful to what you pointed at, and the most distinctive. Tradeoff: a bright screen in a dim studio, and it's the bigger departure from what's there now."
|
|
},
|
|
{
|
|
"id": "note-b",
|
|
"x": 1320,
|
|
"y": -190,
|
|
"w": 800,
|
|
"text": "B · BLUEPRINT (dark) — the dimensions page.\nPure black, 1px white hairlines, no fills at all, orange only where something is lit.\nStays dark for studio use and keeps the panel legible at a glance. Tradeoff: hairlines are less forgiving on a phone than in print, and it has less of the manual's warmth."
|
|
},
|
|
{
|
|
"id": "note-spec",
|
|
"x": 960,
|
|
"y": 855,
|
|
"w": 420,
|
|
"text": "Type is deliberately the SAME in both directions, so the light/dark choice isn't tangled up with the font choice. Pick them separately.\n\nGreen and red have no place in this palette — the bottom-left block shows the alternative: fill for correct, dashed outline for not-quite."
|
|
}
|
|
],
|
|
"launch": { "view": "canvas" }
|
|
}
|