# Design Language for shinonome.date ## Aesthetics and Tone MUJI aesthetic crossed with the cosmic-poetic photography of Yumna Al-Arashi and the deep-quiet typography of Naoto Fukasawa - imagine a MUJI store at 4:47am, the universe's quietest dawn, where every product has been replaced by a single photograph of the aurora borealis taken from a Hokkaido fishing village. The tone is bold-confident: this is a date-finding service that does not apologize for its quietness, does not hide its refusal to gamify human connection, does not perform "fun" to make itself approachable. It states its intent plainly and with quiet authority. The mood is "shinonome - the Japanese word for dawn's first light - rendered as a single curved horizon line drawn across vast honeyed cream space, with aurora-lights gently shifting in the upper third." This is dating-as-meditation, where finding someone means finding someone who can be still. ## Layout Motifs and Structure Single-column layout: a generous central 540px column houses all content, stacked vertically in a strict baseline rhythm. The single column is deliberate - rejecting the social/dating site convention of card grids and feeds. Each "profile" or content unit is a vertical sequence: a single bokeh-toned photograph at 540x720px (3:4 ratio), 80px of breathing space, a bold-confident text block in serif italic at 60ch width with strict leading. Between profiles: 60vh of pure honeyed-cream space. The page reads like a curated photobook, not a search result. Aurora-lights motif appears at the top of the page as a subtle, slowly-shifting horizontal gradient band (8% height of viewport) that drifts across hue at 60-second cycles. Profile metadata in a single horizontal row of mono-tracked details beneath the photograph: name | age | place | one-word. ## Typography and Palette Display and body face: Cormorant Garamond (Google Fonts) - the serif-revival spec - at weights 300-600 with italic styles. Display profile titles in Cormorant SC at clamp(48px, 7vw, 96px) with -1% tracking. Body text in Cormorant at 19px/1.7 italic for poetic flow. Metadata and one-word labels in IBM Plex Mono (Google Fonts) at 13px tracked +6% all-caps. The serif-revival is intentional: the typeface dates from the 17th century but reads as contemporary classical - exactly the "ancient-now" feeling needed. Palette (honeyed-neutral): - #FFF9F0 dawn-cream (primary background, the page's first-light tone) - #F4E8D0 honey-mist (secondary surface, gentle warmer mid-tone) - #2A1F14 charcoal-brown (primary text, near-black with deep amber) - #6B5641 coffee-soft (secondary text, captions, metadata) - #C4956B caramel-glow (accent, drop caps, aurora-warm gradient stop) - #8FA0B5 pre-dawn-blue (aurora-cool gradient stop, distant horizon hint) - #EBDBC0 buttermilk-page (highlight surface, hover states) ## Imagery and Motifs Bokeh-background imagery: every photograph is shot with extreme shallow depth of field - subjects are gently in focus, backgrounds dissolve into honeyed bokeh circles (8-12 in frame, 40-80px each, soft golden tones). Subjects are deliberately tender: a hand holding a teacup, a single chair facing a window, dawn light through linen curtains, a person's silhouette at the edge of a field, an empty book and reading glasses. NO model-shot portraits, NO product photography, NO conventional dating-site selfies. Aurora-lights motif: a 60-second-cycle gradient band drifts across the page header, transitioning through caramel-glow, pre-dawn-blue, and dawn-cream tones - the digital aurora is the visual hook. Section dividers are single 1px hairlines in caramel-glow with a small fleuron at center. ## Prompts for Implementation Build the site as a quiet morning photobook of possible connections. Hero: full viewport. The aurora-lights band drifts across the upper 8% of the viewport. The title "shinonome.date" is centered in Cormorant SC italic at 96px in charcoal-brown. Below: "first-light connections" as the subtitle in honey-mist mono at 14px. The first profile fades up over 2000ms with a soft blur transition. Use tilt-3d pattern (3% corpus): hovering any profile photograph causes a gentle 3D-tilt response (max 4 degrees on each axis, 300ms ease) - subtle, contemplative, never aggressive. The photograph's bokeh background also subtly shifts perpendicular to the tilt, creating a sense of physical presence. NO swipe interfaces, NO match counts, NO messaging buttons in the conventional sense - the only interaction is "send a letter" which opens a quiet form modal with serif typography and no character counter. Profiles scroll slowly past one another with 60vh of negative space between them. Background aurora gradient shifts hue every 60 seconds via CSS @keyframes - keep amplitude subtle so it reads as "atmosphere," not animation. Cursor is a single faint dot (4px) in caramel-glow with a 200ms trailing afterimage at 30% opacity. ## Uniqueness Notes - MUJI aesthetic (1% corpus) committed to fully - the radical minimal restraint contrasts dating-site convention; this is the only dating-site-genre design at this level of MUJI commitment. - Aurora-lights motif (2% corpus) deployed as a continuous background atmosphere via CSS gradient animation rather than isolated illustration - the slow-drift band reads as ambient weather. - Single-column layout (11% corpus) used in a dating-site context where card-grid (90%) dominates the genre - the photobook-stack format is deliberately countercultural. - Chosen seed: aesthetic: muji, layout: single-column, typography: serif-revival, palette: honeyed-neutral, patterns: tilt-3d, imagery: bokeh-background, motifs: aurora-lights, tone: bold-confident - Avoided patterns from frequency analysis: parallax (94%), card-grid (90%) - radically rejected, conventional photography (90%) - bokeh-background portraits subvert the standard, warm palette in gradient sense (93%) - honeyed-neutral is structured, mono typography (81%) - only metadata, mysterious-moody tone (70%) - bold-confident chosen instead.