# Design Language for simai.feedback ## Aesthetics and Tone A retro instrumentation panel reimagined as a scholarly criticism journal — the cockpit of a 1978 mainframe terminal welded to the editorial gravity of an academic review quarterly. The page presents itself as a heads-up overlay floating over a softly burnt, parchment-warm fuselage, as if the reader were peering through a polished CRT into a forum of senior reviewers. Inspiration: NASA mission-control consoles of the Apollo era, Otl Aicher's Lufthansa wayfinding, the editorial gravitas of the Times Literary Supplement, and the orange phosphor glow of a Plasma Panel III. The tone is scholarly-intellectual — every panel speaks with the measured authority of a peer reviewer. Feedback is grave, considered, and luminous. ## Layout Motifs and Structure Hud-overlay composition layered in three planes. The base plane is a deep burnt-orange fuselage textured with brushed micro-grain. Above that, a translucent reticule grid (8px lattice, 5% opacity) provides aviation-style orientation. The top plane is the HUD itself — floating panels framed in thin amber rules, each annotated with a four-digit telemetry code (e.g., "0427 — REVIEWER NOTE"). Sections are arranged not as a vertical document but as instrument clusters: a central reading panel surrounded by orbiting satellite-panels (annotations, citations, marginal critiques). Scroll-triggered patterns reveal new clusters by parsing them into view: each panel boots with a brief amber flicker, a typed line of telemetry, then a soft phosphor settle. Icons are sprinkled throughout as instrument glyphs (chevrons, crosshairs, dial markers). Floating elements (small badges, footnote chips, citation tags) drift in micro-orbits around the active panel, anchored by faint dashed leader-lines. ## Typography and Palette - **Display:** "Antonio" (Google Fonts) — oversized-display condensed, used for the four-digit telemetry codes and section bezel labels at 96–144px - **Body:** "IBM Plex Sans" (Google Fonts) — for scholarly body copy, weight 400, 17px - **Mono / instrument labels:** "JetBrains Mono" (Google Fonts) — for telemetry annotations, citation IDs Palette — Burnt Orange instrumentation: - `#2A1108` Fuselage Char — primary deep background - `#6E2A0F` Hangar Rust — secondary surface, panel backs - `#E2742B` Phosphor Amber — primary accent, instrument glyphs - `#F4B26A` Sodium Glow — hover, highlighted reading panel - `#F1E5D0` Vellum Paper — body text on dark panels - `#1A0903` Cathode Black — drop-shadow and outermost vignette ## Imagery and Motifs - **Icon-heavy** instrument glyphs: custom inline SVG dial markers, gauge needles, sextant crosshairs, reticule pips, signal-strength chevrons, dashed leader-lines — every panel bristles with at least three glyphs - **Floating-elements**: small annotation chips, footnote marbles, citation tags that hover at slight z-offsets and parallax-drift relative to cursor (max ±4px) - Scholarly motifs: roman-numeral footnote markers, hanging quotation marks, scholastic obeli (†, ‡), section ligatures rendered as instrument decals - Recurring HUD ornaments: thin amber bezel frames with chamfered corners, corner-tick marks ("⌜ ⌝ ⌞ ⌟"), and a faint vector-scan line drifting top-to-bottom at 22s cycle - No stock photography. No avatars. No screenshots. Only instrument glyphs and typographic ornaments. ## Prompts for Implementation - The page is structured as a sequence of "instrument clusters" — each cluster is a full viewport with one anchor panel and 3–5 satellite annotation chips - Scroll-triggered entry: amber flicker (3 quick opacity pulses over 220ms), then telemetry-prefix types in via JS typewriter (e.g., "0427.04 — REVIEWER NOTE :: ENTRY OPEN"), then the body fades up over 600ms - Floating elements: each annotation chip orbits its anchor panel on a slow elliptical CSS keyframe (28s loop), with leader-lines drawn as SVG dashes that gently animate stroke-dashoffset - Render the reticule grid as a tiled background using `linear-gradient` repeating at 8px in both axes, 5% amber opacity - AVOID: pricing blocks, CTA buttons, stat-counter grids, testimonial cards. Replace any "stats" with annotated telemetry panels that read as scholarly notes, not metrics - Background fuselage: layer a brushed-metal SVG turbulence (baseFrequency 0.9, numOctaves 1) at 10% opacity over the burnt-orange field - Every heading should be paired with its four-digit telemetry code in mono — codes are arbitrary but consistent: panels are numbered like book chapters but presented as instrument IDs - Typography contrast: condensed oversized-display for codes, humanist sans for body — never mix scales within a single panel ## Uniqueness Notes - Differentiator 1: HUD-overlay + scholarly-intellectual tone is a category collision — instrumentation as criticism, never as cyberpunk or gaming UI - Differentiator 2: burnt-orange palette pairs with retro instrumentation rather than the corpus's typical autumn-foliage warm-palette territory - Differentiator 3: scroll-triggered reveals styled as boot sequences with telemetry typewriter, not card-staggers - Differentiator 4: icon-heavy imagery treated as instrument glyphs, not flat UI iconography or icon-grid showcase - Differentiator 5: oversized-display Antonio used for codes, not for hero hooks — typography serves the instrumentation conceit - Chosen seed: aesthetic: retro, layout: hud-overlay, typography: oversized-display, palette: burnt-orange, patterns: scroll-triggered, imagery: icon-heavy, motifs: floating-elements, tone: scholarly-intellectual - Avoids overused patterns from frequency analysis: parallax (94%), card-grid (90%), centered (94%), photography (90%), warm palette in its bland register, mysterious-moody tone (70%), mono typography as default body (81%)