chore(prompts): niche-aesthetic vocabularies + image direction — taste-skill part 2 (#584)

The deferred half of the Leonxlnx/taste-skill (MIT) adoption: an
industrial-brutalist / minimalist-editorial / premium-agency aesthetic
vocabulary keyed onto the existing design-bar dials for both FE and UX/UI
team prompts, and a ux_ui-only image-direction section (composition,
palette discipline, anti-slop imagery, mockup conventions) with a pointer
from frontend.md. Layer tests pin presence and team scoping.

Co-authored-by: Renn F <rennf93@users.noreply.github.com>

CLAUDE.md

@@ -444,6 +444,8 @@ Agent backends are pluggable. `roboco/llm/providers/` defines an `AgentProvider`
 
 **FE/UX-UI design bar (prompt-only, always on).** Frontend and UX/UI team agents carry a design-taste bar distilled from `Leonxlnx/taste-skill` (MIT) in their team prompts, so agent-authored UI stops defaulting to generic-AI layout/fonts/motion. It's a `## Design bar` section appended to `agents/prompts/teams/frontend.md` and `agents/prompts/teams/ux_ui.md`, reached by every cell role on those teams (dev/QA/PM/Documenter) via the team prompt layer, plus a pointer in the shared `agents/prompts/roles/developer.md` so `fe-dev`/`ux-dev` know to look for it without leaking the content into `be-dev`'s prompt. It covers three tuning dials — `DESIGN_VARIANCE` / `MOTION_INTENSITY` / `VISUAL_DENSITY` (1-10 each; dense product UI like the panel defaults to `2-3 / 2-3 / 7-8`) — plus typography/hierarchy, spacing/layout, motion, and "AI tells to avoid" rules, scoped to respect a project's existing design system (fonts, colors, radius) rather than silently override it. Prompt-only: `compose_prompt` itself is unchanged, no new verb/gate/state; guarded by `tests/unit/agents/test_design_bar_layer.py`.
 
+**Niche aesthetics + Image direction (the deferred taste-skill half, prompt-only, always on).** Two more `Leonxlnx/taste-skill` (MIT) distillations on top of the core Design bar. A `## Niche aesthetic vocabularies` section (identical body in both `frontend.md` and `ux_ui.md`) names three opt-in visual systems — industrial brutalist, minimalist editorial, premium agency — each keyed to the same three dials (a vocabulary changes what the dials produce, not whether they apply); picked only when a task brief explicitly calls for one, never a default. A `## Image direction` section lives in `ux_ui.md` only (that team owns visual-asset/motion-composition work): composition variety, palette discipline, anti-slop imagery, iconography, mockup/device-frame conventions, and cross-asset set consistency, distilled from taste-skill's imagegen skills; `frontend.md` carries a one-line pointer to it instead of duplicating the content. Guarded by the same `tests/unit/agents/test_design_bar_layer.py`.
+
 ## MegaTask (sequenced batch intake)
 
 **MegaTask** lets the CEO describe several tasks in one Intake chat and ship them as one collision-aware, sequenced batch — even across projects that don't share a codebase (the motivating case: a SaaS app + its OSS core engine + a framework adapter). It is a **core capability, not a feature flag** (additive + opt-in by nature: proposed only when the CEO asks for several tasks; single-task intake is byte-for-byte unchanged), branded "MegaTask" on every user-facing surface while internal names stay technical (`batch_id`, `SequencingService`).

agents/prompts/teams/frontend.md

@@ -73,3 +73,20 @@ In anything you write for an end user — copy, demo data, layout — not your o
 
 ### Where this applies
 Building or touching the RoboCo control panel or any dense admin/dashboard surface: work within the project's existing design system for structural chrome (nav, tables, forms, theme tokens); apply the rules above on top of it. taste-skill's landing-page-specific hard caps (hero word/line limits, eyebrow-per-3-sections, bento cell-count, marquee-max-one) are for marketing/landing/portfolio surfaces, not dashboards. Check the task brief if you're unsure which mode you're in.
+
+## Niche aesthetic vocabularies
+
+Also distilled from `Leonxlnx/taste-skill` (MIT) — three named visual systems, opt-in when a task brief explicitly calls for one, not a default to reach for on ordinary work. Each still reads onto the three dials above; a vocabulary changes *what* the dials produce, not whether they apply.
+
+### Industrial brutalist
+Rigid `display: grid; gap: 1px` with contrasting parent/child backgrounds standing in for dividers — zero `border-radius`, 90-degree corners only. Heavy uppercase sans at extreme scale (tight/negative tracking) for macro type; monospace at generous tracking for micro/metadata (IDs, timestamps, coordinates). One hazard-red accent, nothing else — no gradients, no soft shadows. ASCII bracket framing for labels (`[ DELIVERY SYSTEMS ]`, `>>>`). Pick ONE substrate — light Swiss-print (off-white paper, carbon ink) or dark CRT-terminal (near-black, phosphor white) — and never mix them in one interface. Reads as roughly `DESIGN_VARIANCE 5-7 / MOTION_INTENSITY 1-3 / VISUAL_DENSITY 7-9`.
+
+### Minimalist editorial
+Warm monochrome, never pure `#000`/`#fff`: off-black body text, warm off-white/bone background. One editorial serif for headings (tight tracking/line-height), one geometric sans for body/UI, monospace for code/keystrokes. Accent color limited to washed-out pastels (pale red/blue/green/yellow) for tags and badges — no primary-colored blocks or hero sections. 1px hairline borders (`#EAEAEA`-class), shadows near-invisible (<0.05 opacity) or absent. Bento-grid cards with generous internal padding (24-40px), crisp small radii (8-12px max). Motion stays quiet: gentle scroll-fade-up, no ambient spectacle. Reads as roughly `DESIGN_VARIANCE 3-5 / MOTION_INTENSITY 1-3 / VISUAL_DENSITY 3-5`.
+
+### Premium agency
+Nested "double-bezel" card architecture: an outer shell (subtle tint, hairline ring, large radius) wrapping an inner core (its own background, inner highlight, a smaller concentric radius) — never a flat card straight on the background. Pill CTAs with a trailing icon nested in its own circular sub-wrapper, never bare next to the label. One vibe picked and held per project: ethereal glass (OLED black, mesh-gradient orbs, heavy blur), editorial luxury (warm cream/espresso, variable serif display type, film-grain overlay), or soft structuralism (silver-white, bold grotesk, diffused ambient shadows). Motion runs on custom cubic-beziers, never `linear`/`ease-in-out`; section padding runs heavy (`py-24` to `py-40`). Reads as roughly `DESIGN_VARIANCE 6-8 / MOTION_INTENSITY 5-7 / VISUAL_DENSITY 3-5`.
+
+Mixing vocabularies inside one surface — ASCII brackets next to pastel pill tags — reads as indecisive, not eclectic. Hold the pick for the whole task; a real style change gets its own task, same rule as the font/color/radius decision above.
+
+Producing or directing a visual asset (icon, hero image, mockup)? UX/UI owns that surface — see `ux_ui.md`'s Image direction section for the vocabulary; this team's tasks rarely touch it.

agents/prompts/teams/ux_ui.md

@@ -72,3 +72,31 @@ In anything you write for an end user — copy, demo data, layout — not your o
 
 ### Where this applies
 Building or touching the RoboCo control panel or any dense admin/dashboard surface: work within the project's existing design system for structural chrome (nav, tables, forms, theme tokens); apply the rules above on top of it. taste-skill's landing-page-specific hard caps (hero word/line limits, eyebrow-per-3-sections, bento cell-count, marquee-max-one) are for marketing/landing/portfolio surfaces, not dashboards. Check the task brief if you're unsure which mode you're in.
+
+## Niche aesthetic vocabularies
+
+Also distilled from `Leonxlnx/taste-skill` (MIT) — three named visual systems, opt-in when a task brief explicitly calls for one, not a default to reach for on ordinary work. Each still reads onto the three dials above; a vocabulary changes *what* the dials produce, not whether they apply.
+
+### Industrial brutalist
+Rigid `display: grid; gap: 1px` with contrasting parent/child backgrounds standing in for dividers — zero `border-radius`, 90-degree corners only. Heavy uppercase sans at extreme scale (tight/negative tracking) for macro type; monospace at generous tracking for micro/metadata (IDs, timestamps, coordinates). One hazard-red accent, nothing else — no gradients, no soft shadows. ASCII bracket framing for labels (`[ DELIVERY SYSTEMS ]`, `>>>`). Pick ONE substrate — light Swiss-print (off-white paper, carbon ink) or dark CRT-terminal (near-black, phosphor white) — and never mix them in one interface. Reads as roughly `DESIGN_VARIANCE 5-7 / MOTION_INTENSITY 1-3 / VISUAL_DENSITY 7-9`.
+
+### Minimalist editorial
+Warm monochrome, never pure `#000`/`#fff`: off-black body text, warm off-white/bone background. One editorial serif for headings (tight tracking/line-height), one geometric sans for body/UI, monospace for code/keystrokes. Accent color limited to washed-out pastels (pale red/blue/green/yellow) for tags and badges — no primary-colored blocks or hero sections. 1px hairline borders (`#EAEAEA`-class), shadows near-invisible (<0.05 opacity) or absent. Bento-grid cards with generous internal padding (24-40px), crisp small radii (8-12px max). Motion stays quiet: gentle scroll-fade-up, no ambient spectacle. Reads as roughly `DESIGN_VARIANCE 3-5 / MOTION_INTENSITY 1-3 / VISUAL_DENSITY 3-5`.
+
+### Premium agency
+Nested "double-bezel" card architecture: an outer shell (subtle tint, hairline ring, large radius) wrapping an inner core (its own background, inner highlight, a smaller concentric radius) — never a flat card straight on the background. Pill CTAs with a trailing icon nested in its own circular sub-wrapper, never bare next to the label. One vibe picked and held per project: ethereal glass (OLED black, mesh-gradient orbs, heavy blur), editorial luxury (warm cream/espresso, variable serif display type, film-grain overlay), or soft structuralism (silver-white, bold grotesk, diffused ambient shadows). Motion runs on custom cubic-beziers, never `linear`/`ease-in-out`; section padding runs heavy (`py-24` to `py-40`). Reads as roughly `DESIGN_VARIANCE 6-8 / MOTION_INTENSITY 5-7 / VISUAL_DENSITY 3-5`.
+
+Mixing vocabularies inside one surface — ASCII brackets next to pastel pill tags — reads as indecisive, not eclectic. Hold the pick for the whole task; a real style change gets its own task, same rule as the font/color/radius decision above.
+
+## Image direction
+
+Also distilled from `Leonxlnx/taste-skill`'s imagegen skills (MIT) — direction for any visual asset your team produces or specifies: icons, illustrations, hero/marketing art, mockup frames, motion-composition key art (the video engine's `motion/compositions/`). Frontend doesn't own this surface; the pointer in `frontend.md` sends any marketing-asset work here rather than duplicating the vocabulary.
+
+- **Composition variety.** Don't default to a centered hero or left-text/right-image every time — vary the anchor per asset (bottom-left over image, top-left lead, stacked center, image-as-canvas). Reflexive repetition of the same anchor across a set reads as templated, not consistent.
+- **Palette discipline.** One primary, one secondary, one sparing accent, one neutral scale — reused across every asset in a set, never a per-asset theme swap. No rainbow/mesh gradients, no default purple-blue "AI" glow.
+- **Anti-slop imagery.** No stock-photo cliches, no generic office/robot photography, no meaningless floating blobs or stacked glassmorphism, no fake dashboard crammed with invented charts/metrics.
+- **Iconography.** No default Lucide/Feather/Heroicons look-alike set — pick one consistent stroke-weight family per project (same "one icon family" rule as the Design bar above).
+- **Mockup framing.** Minimal and believable: browser chrome, terminal window, phone corner-crop, card stack. Never a full fake dashboard packed with invented data — a mockup demonstrates identity/context, not a feature tour.
+- **Device frames.** A phone or Mini App screen (e.g. the Telegram cockpit) gets a subtle premium device frame when shown as a standalone asset — the screen content stays the focus, the frame stays quiet.
+- **Set consistency.** Every image in one deliverable (a multi-screen flow, a per-section landing page) shares the same brand world, type scale, CTA family, and icon mood — a viewer flipping through the set should recognize one system, even as composition and background vary piece to piece.
+- **Motion-implied stills.** A static comp implies state or interaction through proportion and emphasis (an already-pressed button, a highlighted row) — not a literal loading spinner frozen mid-spin.

tests/unit/agents/test_design_bar_layer.py

@@ -37,3 +37,31 @@ def test_design_bar_reaches_fe_qa_via_team_layer() -> None:
     reviewing/scoping design work, not just for the devs implementing it."""
     prompt = compose_prompt(AgentRole.QA, Team.FRONTEND, "fe-qa")
     assert "## Design bar" in prompt
+
+
+def test_niche_aesthetics_present_for_frontend_team() -> None:
+    prompt = compose_prompt(AgentRole.DEVELOPER, Team.FRONTEND, "fe-dev-1")
+    assert "## Niche aesthetic vocabularies" in prompt
+
+
+def test_niche_aesthetics_present_for_ux_ui_team() -> None:
+    prompt = compose_prompt(AgentRole.DEVELOPER, Team.UX_UI, "ux-dev-1")
+    assert "## Niche aesthetic vocabularies" in prompt
+
+
+def test_niche_aesthetics_absent_for_backend_team() -> None:
+    prompt = compose_prompt(AgentRole.DEVELOPER, Team.BACKEND, "be-dev-1")
+    assert "## Niche aesthetic vocabularies" not in prompt
+
+
+def test_image_direction_present_for_ux_ui_team_only() -> None:
+    """Image-gen guidance is ux_ui-only content: frontend gets a one-line
+    pointer to it (no dial/rule content), backend gets neither."""
+    ux_prompt = compose_prompt(AgentRole.DEVELOPER, Team.UX_UI, "ux-dev-1")
+    fe_prompt = compose_prompt(AgentRole.DEVELOPER, Team.FRONTEND, "fe-dev-1")
+    be_prompt = compose_prompt(AgentRole.DEVELOPER, Team.BACKEND, "be-dev-1")
+    assert "## Image direction" in ux_prompt
+    assert "## Image direction" not in fe_prompt
+    assert "## Image direction" not in be_prompt
+    assert "Image direction" in fe_prompt  # the pointer phrase itself
+    assert "Composition variety" not in fe_prompt  # not the technical content