Ray Mascot — Style Variants
The same Ray mascot rendered through 15 different visual languages. Two purposes:
- Visual literacy. Same character, different style — what changes? Look at the deltas to see what each design movement actually does to a form.
- Brand asset library. Pull from these for newsletter headers, blog illustration, social posts, sub-property thumbnails, anywhere a styled Ray fits the surface.
Source mascot: vibrant pop-art / Murakami-influenced bot blob (red / yellow / pink / blue / black). Each variant preserves the silhouette (rounded head, antenna ball, big eyes, blob limbs) and re-skins it in the target style.
Generated 2026-04-23 via xAI Grok image API (grok-imagine-image). All variants single-shot, no retries.
Variants
| Style | Image | Glossary | What it teaches |
|---|---|---|---|
| Swiss style (International Typographic) |  |
06-reference/concepts/design-vocabulary-glossary#Swiss style International Typographic Style |
Grid as armature; restraint as expression. Helvetica + red + black + math. |
| Brutalism (web) |  |
06-reference/concepts/design-vocabulary-glossary#Brutalism web |
Anti-design as design. What "no styling" looks like when chosen on purpose. |
| Neumorphism |  |
06-reference/concepts/design-vocabulary-glossary#Neumorphism |
Dual-shadow embossing. Beautiful in stills, contrast-broken in practice. |
| Glassmorphism |  |
06-reference/concepts/design-vocabulary-glossary#Glassmorphism |
Frosted-glass translucency. The visionOS / Big Sur surface treatment. |
| Claymorphism |  |
06-reference/concepts/design-vocabulary-glossary#Claymorphism |
Pinch-able pastel 3D. Friendly and consumer-y; the kid-app default. |
| Skeuomorphism |  |
06-reference/concepts/design-vocabulary-glossary#Skeuomorphism |
Mimic real materials. Brushed aluminum, stitched leather, glass eyes. |
| Flat design |  |
06-reference/concepts/design-vocabulary-glossary#Flat design |
Strip ornament. Solid blocks, no shadows, geometric silhouettes. |
| Material Design |  |
06-reference/concepts/design-vocabulary-glossary#Material Design |
Physical-metaphor cards with elevation. Google's design grammar. |
| Modern minimalism |  |
06-reference/concepts/design-vocabulary-glossary#Modern minimalism |
Off-white + warm gray + one accent. The Stripe / Linear / Vercel look. |
| Apple-style premium |  |
06-reference/concepts/design-vocabulary-glossary#Apple-style premium product |
Hero-product photography on black. Premium positioning via negative space. |
| Bauhaus |  |
06-reference/concepts/design-vocabulary-glossary#Bauhaus |
Reduce form to circles, squares, triangles in red/yellow/blue. |
| Memphis design |  |
06-reference/concepts/design-vocabulary-glossary#Memphis design |
1980s postmodern chaos. Squiggles, confetti, clashing pinks/teals. |
| Cyberpunk / glitch |  |
06-reference/concepts/design-vocabulary-glossary#Cyberpunk glitch |
Neon + RGB shift + scanlines. Datamosh as decoration. |
| Hand-drawn / notebook |  |
06-reference/concepts/design-vocabulary-glossary#Hand-drawn notebook |
Wobbled contours, marker washes, cream paper. Concept-sketch warmth. |
| Editorial engraving |  |
06-reference/concepts/design-vocabulary-glossary#Editorial engraving |
Hedcut crosshatch. WSJ portraits + 1890s Atlantic illustration. |
How to use
- Learning a term: open this README beside the [[06-reference/concepts/design-vocabulary-glossary|glossary]]. Read the definition, then look at Ray. The image fixes the abstraction.
- Picking a style for a surface: browse the table, find the energy that fits, copy the slug into prompts or briefs ("render it in
claymorphismstyle"). - Pulling assets: PNGs are at
/Users/ray/rdco-vault/06-reference/design-mood-board/ray-mascot-variants/<slug>.png. Use directly or as illustration reference.
Re-generation
To re-generate a variant or add a new style, the prompts are in /tmp/gen-mascots.sh (regenerate the script if needed) — pull the xAI key with XAI_KEY=$(op read "op://Ray Agent/xAI Grok API/api_key") and POST to https://api.x.ai/v1/images/generations with {"model":"grok-imagine-image","prompt":"...","n":1}. ~$0.20 per image.