Design Knowledge Base
Community-maintained principles reviewed before publication and retrieved as Agent design constraints.
Award Site Case Evidence Matrix
When analyzing Awwwards-style award sites, record layout, color, typography, interaction, motion, and usability evidence separately instead of saying only premium, immersive, or beautiful.
The value of case analysis is not copying surface style; it is translating verifiable design choices into reusable judgment and implementation constraints.94%Visual Foundationscomparison / layoutComparison Layout Clarity
Comparison Layout Clarity turns a frequent interface judgment into an executable constraint before generation.
Comparison value comes from visible differences along shared dimensions, not prettier object cards.85%Visual Foundationsdetail / objectObject Detail Layout
Object Detail Layout turns a frequent interface judgment into an executable constraint before generation.
Detail pages should organize around object identity, state, key attributes, and actions instead of displaying every field equally.85%Visual Foundationsmap / geospatialMap and Geospatial Layout
Map and Geospatial Layout turns a frequent interface judgment into an executable constraint before generation.
Geospatial interfaces depend on synchronization between location, scope, objects, and selection state.84%Visual Foundationsactions / contextContextual Action Placement
Contextual Action Placement turns a frequent interface judgment into an executable constraint before generation.
Button placement signals scope: row-level, card-level, section-level, and global actions must not blur together.84%Visual Foundationslayout / containerEdge-to-Edge vs Contained Layout
Edge-to-Edge vs Contained Layout turns a frequent interface judgment into an executable constraint before generation.
Page width is an information architecture decision; not every region belongs in the same max-width container.84%Visual Foundationsempty-state / onboardingEmpty State Composition
Empty State Composition turns a frequent interface judgment into an executable constraint before generation.
An empty state is not illustration filler; it is the first step into the workflow.84%Visual Foundationsdisclosure / layoutSpatial Progressive Disclosure
Spatial Progressive Disclosure turns a frequent interface judgment into an executable constraint before generation.
Progressive disclosure is not just hiding content; it spatially orders task entry, key results, and advanced options.84%Visual Foundationsrhythm / sectionsSection Rhythm Variation
Section Rhythm Variation turns a frequent interface judgment into an executable constraint before generation.
Long pages need variation in density, alignment, media ratio, and whitespace without changing the design system.84%Visual Foundationsscan / layoutScanning Path Design
Pages should support predictable scanning instead of forcing attention to jump between focal points.
Attention moves through headings, key data, groups, and actions; layout should align with that path.82%Visual Foundationsalignment / layoutAlignment Discipline
Alignment reduces effort by clarifying boundaries, belonging, and action targets.
Small alignment errors quickly make an interface feel unprofessional even when typography and color are correct.82%Visual Foundationsspacing / rhythmSpacing Scale and Rhythm
A small repeatable spacing scale makes pages calm, predictable, and less improvised.
Spacing should express structural relationships, not item-by-item guesswork.82%Visual Foundationsgrid / layoutGrid as a Decision System
A grid is not decoration; it decides span, alignment, responsive recomposition, and density.
A stable grid reduces ad hoc placement and keeps complex pages structured across viewports.82%Visual Foundationshierarchy / layoutInformation Hierarchy First
Define what users should see first, second, and act on before styling the page.
Good interfaces avoid equal emphasis and create a readable order through size, position, density, and contrast.82%