Grid / product
UI Layouts hero pattern
hero-ai-value-proposition
Great for SaaS and AI tools that need fast comprehension, low-friction scanning, and practical CTA entry points.
Symmetry / metallic / Gatsby elegance
This version presents the product like a technical explainer: clear grids, clean modules, scannable text, and code-like surfaces that emphasize structure over decoration.
block_1
Source brief
block_1
Mode rules
block_1
Token map
block_2
Section logic
block_2
Type system
block_2
Motion preset
block_3
Route preview
block_3
CTA states
block_3
Mobile collapse
Structured technical explainer
Data, systems, and flow are presented like an explainer for a technical product, so the sense of trust comes from modular composition rather than cinematic styling.
architecture.map
capability
The same message set is restructured through layout, type scale, surface treatment, and narrative rhythm that change from one family and style to another.
capability
Under the catalog sits a renderer-family system, so multiple styles can reuse a skeleton while still feeling clearly different in visual language.
capability
Each route makes the trade-offs between clarity, materiality, density, novelty, and conversion feel explicit instead of merely swapping palettes.
route.config
avoid.list
Style intelligence
An Art Deco direction of symmetrical geometry, metallic gold accents, and Gatsby-era architectural elegance.
Compare against
Catholic Mondrianism
Art Deco prioritizes "architectural symmetry, geometric linework, and decorative metallic shine"; Catholic Mondrianism gives a different read within the same family.
Best fit
Luxury hospitality, jewelry, heritage fashion, and premium editorial brands
Structural signature
Avoid
Practical takeaway
This route demonstrates how the same product can be art directed in radically different directions by changing layout, hierarchy, materiality, and density with intention.