# Design Language for shinonome.stream ## Aesthetics and Tone Anti-design aesthetic in the specific tradition of Yokoland, David Carson's "Ray Gun" magazine, Ed Fella's hand-distorted lectures, but transposed into deep ocean cold rather than punk warmth. The tone is minimal: this is a streaming site that refuses to behave like a streaming site - no algorithmic recommendations, no engagement counters, no "trending now" anxiety. Instead, the anti-design language breaks every UX convention to slow the viewer down and force a different relationship with the medium. Ocean-deep palette plunges the entire design into 3000-meter abyssal blackness, illuminated only by bioluminescent accents and rare path-draw-svg moments that emerge from the dark like jellyfish trails. Organic-blob motifs (gelatinous deep-sea life forms, soft amoeba shapes) drift through the composition - never aligned to grids, never tied to layout. ## Layout Motifs and Structure Hero-dominant layout: a single massive hero section occupies 90% of the initial viewport-experience - one enormous typographic statement, one floating organic-blob, one ambient atmosphere. Below the hero, content "streams" arrive in irregular, intentionally-misaligned blocks that defy hierarchical structure: a video preview floating at 30% width on the left, a paragraph of description at 65% width on the right with 23% top-offset, the next block at 50% width centered but rotated -2 degrees. The anti-design discipline: nothing aligns to a grid, gutter sizes vary section-to-section, type sizes jump abruptly between blocks. Each "stream entry" is a unique compositional moment, not a templated card. Organic-blob shapes (SVG path-based, no geometric primitives) float as decorative elements at random positions, their paths slowly morphing on a 30-second cycle. ## Typography and Palette Display and body face: Recursive (Google Fonts) - the variable-fluid spec - a variable font with axes for proportion (sans/mono), weight (300-1000), slant, and casual. Use Recursive's variation axes dynamically: hovering text causes the slant axis to shift 0->8 degrees and the casual axis to shift 0->1, creating fluid typographic life. Display hero-statement at clamp(120px, 18vw, 280px) - massive type as graphic. Body at 16px/1.65 with variable proportion mostly toward sans but occasional mono burst for emphasis. Caption and metadata in Recursive Mono at 12px tracked +4%. The variable-fluid choice IS the anti-design typographic gesture - typography that refuses to settle into a fixed identity. Palette (ocean-deep): - #02071A abyssal-black (primary background, the trench) - #0A1530 trench-midnight (secondary surface, slightly elevated) - #1C3E5C deep-current (mid-tone, scrollbar accents) - #4FE8C5 bioluminescent-mint (primary accent, glow effects) - #8FB8FF moonlight-blue (secondary accent, text emphasis) - #E8F4FF surface-mist (primary text, near-white with cool warmth) - #6B7E94 plankton-gray (secondary text, captions) ## Imagery and Motifs Water-bubbles imagery: every visual element is treated as if photographed underwater - bubble overlays, subtle refraction distortions, blue-cast color grading. Subjects are deep-sea creatures and abstract underwater photography: bioluminescent jellyfish, anglerfish silhouettes, deep-sea coral, abyssal vents, plankton clouds. Each image carries a 12% blue-cast color overlay and 3-5 floating bubble overlays (white circles, 8-24px, 30% opacity). Organic-blob motifs: SVG path shapes morph slowly across the page - 4-6 blob shapes simultaneously, each on a 20-30 second morph cycle using CSS @keyframes that interpolate between 4 path-states. Blobs glow gently with bioluminescent-mint (radial gradient, 30% opacity inner, 0% outer, 200-400px diameter). ## Prompts for Implementation Build the site as a slow descent into the abyssal stream - the user dives deeper as they scroll. Hero: full viewport. The title "shinonome.stream" appears at 280px in Recursive's display proportion, the letters slowly morph their slant axis from -2 to +6 degrees over 4 seconds, then settle. A single massive bioluminescent organic-blob floats in the upper-right, its SVG path slowly morphing. Below the title: "an abyssal channel" in Recursive Mono at 14px. As the user begins scrolling, the path-draw-svg pattern (7% corpus) activates: hand-drawn jellyfish-trail SVGs in bioluminescent-mint draw themselves across the screen at random intervals, each over 1800ms using stroke-dashoffset animation. These are the page's only "decorations" - they emerge, glow briefly, fade. Use path-draw-svg as the dominant pattern: every section reveal triggers 1-3 SVG drawings somewhere in the viewport. Anti-design composition: each stream entry sits at a different visual location - never the same place twice. Rotation by -3 to +3 degrees varies per entry. NO conventional CTAs, NO subscription counts, NO play-count metrics - the only metadata is duration in HH:MM:SS. Cursor leaves a 600ms-decay trail of 3 fading bubble-circles in bioluminescent-mint. Page scroll has a slight downward drag (the user is descending) creating gentle drift in the floating blobs. ## Uniqueness Notes - Anti-design aesthetic (2% corpus) committed to as a structural principle rather than decorative choice - nothing aligns, type axes shift, rotations vary - the design itself is the rebellion. - Path-draw-svg pattern (7% corpus, less common) used as the primary visual hook with hand-drawn jellyfish-trails as ambient illustrations - the "drawings emerge" approach is distinctive. - Ocean-deep palette (2% corpus) combined with bioluminescent accents and variable-fluid typography (2%) - the deep-sea triple is absent from the corpus. - Chosen seed: aesthetic: anti-design, layout: hero-dominant, typography: variable-fluid, palette: ocean-deep, patterns: path-draw-svg, imagery: water-bubbles, motifs: organic-blobs, tone: minimal - Avoided patterns from frequency analysis: parallax (94%) - only subtle scroll-drag drift, card-grid (90%) - radically rejected, photography (90%) - all underwater-treated, warm palette (93%) - cold abyssal blues instead, mono typography (81%) - variable-fluid handles it, mysterious-moody tone (70%) - minimal chosen instead.