Phase 4 — Design
Design Constitution
The visual rules that make every space feel like one product
2 min read · Document 15 of 30
What is this document?
The Design Constitution sets the visual principles: brand colours, typography, density, motion, imagery and tone of microcopy. It comes from the design configuration you complete after payment.
It is the reason every screen, in every space, looks like it belongs to the same product.
Why does it matter?
- When AI tools pick their own colours, fonts and spacing, every component looks like a different product.
- Brand decisions are made by you, not by the model’s defaults.
- Accessibility contrast is checked once, at the token level.
What's inside?
- Principles — The ordered visual rules.
- Brand — Colours, logo usage and voice.
- Motion and density — Animation and spacing preferences.
Brand choicesDesign tokensComponentsScreens
How CREAH generates it
CREAH builds this document from your Stage 0 answers and interview. Questions that shape it include:
- What are the primary and secondary brand colours?
- Should the product feel calm or energetic?
- How much animation is appropriate?
Example excerpt
## Principle 1 — One primary action per screen
Every screen has exactly one primary button.
Secondary actions use the secondary style; tertiary actions are links.
## Principle 2 — Flat surfaces
No glassmorphism, no heavy shadows — hierarchy comes from spacing and type.