Workflows / 03

Specify a DirectionWorks today, by hand

Get a chosen direction into an agent or tool intact: what must survive, what may vary, what breaks it.

For the Aesthetics with Build pages, by copying a Markdown guide into your tool. DESIGN.md and token export are planned, not built.

What you bring

  • A chosen AestheticRequiredWorks today, by hand
  • Project constraints: brand colours to keep, accessibility level, stackOptionalPlanned
  • A saved Recipe instead of one AestheticOptionalPrototype

Before → Aesthetary → After

Before

  • Find a Direction
  • Decode References

Aesthetary

  • Rules grouped by basis: required, period practice, modern practice, ours
  • Withheld guidance, and prohibited areas
  • What has and has not been researched, so the agent does not invent the rest
  • Required vs flexible stated as values and rangesRequires more research
  • Imagery, composition and motion guidance for most AestheticsRequires more research

Leaves with: Direction Spec

After

  • Claude Code, Cursor, Codex
  • v0, Lovable, Stitch
  • Figma, Framer, Webflow
  • Check Fidelity

Mix enters here: A Recipe would be specified the same way as a single Aesthetic. Recipes are a prototype; none exist.

What leaves Aesthetary

Direction Spec: Planned

Direction Spec

  • DESIGN.md
  • Design tokens (DTCG)
  • A prompt block for tools without file support
  • A Check list generated from the same record

What exists today

prompt/<slug>.md, a Markdown guide for coding agents, and data/v1/<slug>.json, the structured record. Both exist for every public record. Build pages, which lay the rules out for implementation, exist for the calibration set and for Swiss Style, Manga and Modern SaaS.

Worked example

Kawaii · real data

In

Kawaii, chosen.

Out, today: prompt/kawaii.md Real file

# Kawaii — style guide for coding agents

> Generated from the Aesthetary record for **Kawaii**.
> Research: **Graded, not yet sourced** · Build guidance: recorded in 5 of 8 research dimensions.
> No source attached. 1 claim graded by our research brief.

## How to use this

Paste this file into your agent as context before asking it to design or build something in this visual language. It states what is established, what is our interpretation, and what nobody has established. Treat all three differently.

**The most important section is "Not researched yet".** Its purpose is to stop you and your agent inventing rules that sound right and are not recorded anywhere.

## What this language is

**Defining:** Mascot characters, sparkle and heart motifs, pastel with one bright, everything rounded

**Recognise it by:** Mascot characters built to consistent proportion, sparkle and heart motifs placed at controlled intervals, a pastel field carrying exactly one bright accent, and every corner and terminal rounded without exception. The diagnostic condition is precision inside softness: the construction is exact even though the vocabulary is soft, and loose execution reads as a different and lesser thing. Mascot-Led, a Module, is the layout device of building a page around a character; this is a full register with its own palette rule and craft standard.

**Family:** Subculture & Street
**Era:** contemporary

## What it is arguing

Cuteness executed to a professional standard. Rounded form, mascot character and controlled pastel are a demanding craft with exact rules of proportion and spacing, and doing it properly is the point rather than an affectation.

The first lines of the real file. The full guide carries the rules by basis, what is withheld, and what is not established. The DESIGN.md form is planned.

Routes

5 · products as routes, not destinations

Coding agentsWorks today, by hand

Out of Aesthetary · Claude Code, Cursor, Codex

Download prompt/<slug>.md from a Build page and add it to the project or the conversation. Add data/v1/<slug>.json when the agent can read structured files.

  1. Open the Aesthetic’s Build page
  2. Download the style guide
  3. Put it where your agent reads context
  4. Ask for claim keys back, so each styling decision can be traced

DESIGN.md and an MCP server would replace the copy and paste. Neither is built.

Prompt-driven buildersWorks today, by hand

Out of Aesthetary · v0, Lovable, Stitch

Paste the relevant sections of the style guide into the prompt. A shorter prompt block made for these tools is planned.

Whether each accepts a DESIGN.md file directly has not been checked.

Claude DesignNeeds verification

Out of Aesthetary · Claude Design

Planned: hand over a DESIGN.md during design-system setup. How it accepts outside files has not been checked, and the file is not built.

Hand off to a design toolPlanned

Out of Aesthetary · Figma, Framer, Webflow

Planned: import design tokens. Today, copy values from the Build page by hand; those values are what the page was built with, not requirements of the language.

Pairing: layout patternsWorks today, by hand

Pairs with Aesthetary · Mobbin, Refero

They answer which layout pattern real products use. Aesthetary answers which visual language, and what breaks it. Use both side by side; neither replaces the other.

Failure modes

Visual examples planned

  • The agent regresses to its defaults because the spec only named the style.
  • A flexible trait is treated as required, and every build looks identical.
  • A Mix is averaged, not resolved, and the result belongs to neither language.
  • Values we chose for a page are shipped as if the language required them.

What Aesthetary does not do here

  • Generate code or sitesClaude Code, Cursor, v0, Lovable, Stitch
  • Design on a canvasFigma, Framer, Webflow
  • Show which layout pattern real apps useMobbin, Refero
  • Apply an existing brand systemYour design system tooling

Try it

Kawaii brief (.md) →Recipes →Prototype

Feedback