# Design Language for double-standard.org ## Aesthetics and Tone A split-reality interface that visually demonstrates double standards by showing two versions of the same content with different visual treatment -- double-standard.org renders as a social commentary tool where the left half of the screen is "privileged" (clean, polished, well-resourced design) and the right half is "disadvantaged" (degraded, under-resourced, broken design). The contrast-advocacy aesthetic uses visual inequality to make double standards viscerally felt rather than merely explained. The tone is exposé-analytical: measured but pointed, presenting facts that let the visual contrast do the persuasive work. The site does not editorialize -- it shows. ## Layout Motifs and Structure **Split-Contrast System:** Two parallel columns showing the same content with dramatically different visual treatment. **Section Flow:** 1. **The Mirror:** Split hero -- left: clean serif title, well-kerned, generous spacing. Right: the same title in broken rendering, tight spacing, lower quality. 2. **The Cases:** Split content sections where the same information is presented with "privileged" and "disadvantaged" visual treatments. 3. **The Standard:** A single centered section where both halves merge, showing how one standard could look. 4. **The Question:** Closing with a centered question: "Which standard do you apply?" ## Typography and Palette - **Privileged Side:** "Playfair Display" at 2.5rem, weight 700; "Lora" body at 1rem. Rich, well-set. - **Disadvantaged Side:** "Inter" at 2rem, weight 400; system sans-serif body at 0.9rem. Functional but under-resourced. **Palette:** Left: warm cream (#f8f4ec) bg, rich ink (#1a1a18) text, gold accent (#c8a040). Right: harsh white (#ffffff) bg, grey text (#4a4a4a), no accent color. Central/merged section: neutral grey (#f0f0f0) bg. ## Imagery and Motifs **Visual Inequality:** Left side has generous margins, refined typography, decorative rules. Right side has tight margins, system fonts, minimal spacing. The contrast IS the content. **Central Divider:** A jagged/torn SVG line separating the two halves, not a clean split. **Quality Gradient:** Hovering the right side gradually improves its quality (transitions toward the left side's treatment), demonstrating that standards are choices. **Merged Section:** When both sides meet in the center, a balanced, neutral design emerges -- the potential of a single standard. ## Prompts for Implementation Build as a demonstration of inequality. Both columns load simultaneously. The viewer immediately notices the difference in quality/treatment. Scrolling shows case after case of the same content with different standards applied. The torn/jagged divider prevents seeing this as a clean design choice -- it is a rupture. The hover-to-improve interaction on the right side shows that "disadvantaged" design is a choice, not an inevitability. The merged closing section provides resolution. No CTAs, no donations page, no calls to action -- the visual demonstration is the message. ## Uniqueness Notes 1. **Visual inequality as design strategy:** Deliberately using different quality levels on each side of a split is a unique advocacy technique. 2. **Jagged/torn divider between halves:** The irregular SVG divider creates a sense of rupture rather than organized difference. 3. **Hover-to-equalize interaction:** Gradually improving the disadvantaged side's design on interaction demonstrates that standards are choices. 4. **Convergence as resolution:** The merged single-standard closing section provides visual hope. Document chosen seed/style: aesthetic: contrast-advocacy, layout: split-inequality, typography: quality-contrast, palette: warm-vs-cold, patterns: torn-divider, imagery: visual-inequality, motifs: hover-equalize, tone: exposé-analytical