From 5e7ef19b8f6d542ec13a9c77ac381e518a35884a Mon Sep 17 00:00:00 2001 From: null Date: Thu, 25 Jun 2026 11:26:21 -0500 Subject: [PATCH] docs(brand): add asset-system.md, cross-link from visual-identity.md --- docs/brand/asset-system.md | 243 ++++++++++++++++++++++++++++++++++ docs/brand/visual-identity.md | 3 + 2 files changed, 246 insertions(+) create mode 100644 docs/brand/asset-system.md diff --git a/docs/brand/asset-system.md b/docs/brand/asset-system.md new file mode 100644 index 00000000..56a9c8f0 --- /dev/null +++ b/docs/brand/asset-system.md @@ -0,0 +1,243 @@ +# Closer Artwork Asset System + +This is the working artwork asset set for Closer. It keeps the existing purple/pink color scheme +and the 2D pastel couple illustration style, but gives every visual surface a clearer job. + +The brand should feel like a private ritual for two people: warm, quiet, equal, and intentional. +The heart remains the compact brand mark. The couple artwork should become the primary visual +language anywhere there is enough space to show a human moment. + +## Current Artwork Review + +### README and Positioning + +The README is aligned with the right promise: private mutual reveal, real encryption, calm UX, no +public social mechanics, and one subscription per couple. That is the brand spine. Asset decisions +should reinforce that before adding more romance, gamification, or feature volume. + +Recommended visual translation: + +- Privacy: lock, sealed card, quiet room, closed journal, two-device reveal. +- Equality: paired shapes, mirrored halves, balanced figures, side-by-side cards. +- Ritual: daily card, cup/table setting, evening prompt, calendar/date cue. +- Warmth: existing pastel couple scenes, soft surfaces, pink/lavender accents. + +Avoid: + +- Generic dating-app hearts as the only signal. +- Loud streak/game badges as the main identity. +- Stock-couple photography. +- Notification copy or graphics that imply surveillance, urgency, or partner pressure. + +### Existing Artwork + +Keep: + +- `docs/store/sources/app-icon.svg` as the source of the compact heart mark. +- `iphone/Closer/Resources/illustration-couple-*.png` as the human brand style. +- `iphone/Closer/Resources/pack-art-*.png` as the category/pack art direction. +- `iphone/Closer/Resources/particle-heart.png` and `particle-petal.png` for celebration moments. + +Improve: + +- The heart is strong for launchers and tiny UI, but too generic when used alone at larger sizes. + Use couple illustrations for onboarding, paywall, empty states, store screenshots, and web/social. +- Android currently has the launcher vectors but not the larger illustration library. Mirror the + iOS resources into Android when those screens start using raster art. +- Store feature graphics should show the heart plus one illustrated/private ritual scene, not only + cards and symbols. + +### Notification Artwork + +This section is only about the artwork used to represent notifications, not notification behavior. + +- Use a dedicated monochrome notification glyph, not the colored launcher foreground. +- Keep notification artwork quiet: heart, lock, paired-card, moon, calendar, and capsule symbols. +- Large notification-adjacent artwork may use partner avatars or the couple illustration style, but + never show readable private answer content. +- The visual tone should say "gentle invitation," not alarm, urgency, surveillance, or streak loss. + +## Master Asset Set + +### 1. Brand Marks + +| Asset | Use | Source / Target | +| --- | --- | --- | +| Primary app mark | Launcher, favicon, small brand moments | `docs/store/sources/app-icon.svg` | +| Adaptive foreground | Android launcher layer | `app/src/main/res/drawable/ic_launcher_foreground.xml` | +| Adaptive background | Android launcher layer | `app/src/main/res/drawable/ic_launcher_background.xml` | +| Monochrome mark | Android themed icon, single-color use | `app/src/main/res/drawable/ic_launcher_monochrome.xml` | +| Notification glyph | Android/iOS notification art direction | Needed: monochrome heart/paired-card source | +| Wordmark lockup | Website, store hero, press kit | Needed: `docs/brand/sources/closer-lockup.svg` | +| Horizontal logo | Email header, social headers | Needed: SVG + PNG exports | +| One-color logo | Legal docs, monochrome print, dark/light footer | Needed: SVG exports | +| Favicon set | Website/browser/PWA | Needed: 16, 32, 48, 180, 192, 512 px | + +Logo rule: the heart mark should mean "two equal people meeting in the middle." Do not split it, +rotate it, add faces, add text inside it, or use it as a reaction emoji. + +### 2. App Icons + +| Platform | Required Assets | +| --- | --- | +| Android | Adaptive icon, round icon, themed monochrome icon, Play 512 px icon | +| iOS | AppIcon asset catalog: 20, 29, 40, 60, 76, 83.5, 1024 px | +| Web/PWA | favicon.ico, SVG favicon, Apple touch icon, maskable 192/512 icons | + +Current status: + +- Android and Play icon assets exist. +- iOS has an asset catalog folder but no visible app icon set in the checked file list. Add the + full iOS app icon set before TestFlight/App Store review. + +### 3. Illustration Library + +Use the 2D pastel couple art as the large-format identity. + +| Asset Family | Current Assets | Primary Use | +| --- | --- | --- | +| Couple moments | `illustration-couple-onboarding`, `invite`, `history`, `paywall`, `subscription` | Onboarding, pairing, history, paywall | +| Product rituals | `illustration-daily-question`, `partner-activation`, `reveal-celebration` | Daily question, partner wait state, reveal | +| Play and progress | `illustration-spin-wheel`, `streak-milestone`, `together-empty` | Play hub, milestones, empty states | +| Pack art | `pack-art-*` | Question pack cards and category headers | +| Particles | `particle-heart`, `particle-petal` | Reveal, match, milestone celebration | + +Needed additions: + +- `illustration-privacy-lock`: two cards or journals behind a lock. +- `illustration-quiet-hours`: moon/window/two muted phones. +- `illustration-date-match`: two chosen date cards meeting. +- `illustration-memory-capsule`: sealed box/open capsule. +- `illustration-chat-thread`: two soft message bubbles with no readable text. +- `illustration-account-deletion`: calm export/delete privacy scene. +- Android copies of the iOS illustration assets, preferably under `app/src/main/res/drawable-nodpi/`. + +### 4. Notification Artwork Assets + +| Notification Type | Small Icon | Optional Large Icon | Route Mood | +| --- | --- | --- | --- | +| Partner answered | Heart/paired-card glyph | Partner avatar | Calm invitation | +| Reveal ready | Heart + unlock symbol | Heart mark | Moment is ready | +| Chat message | Heart/paired-card glyph | Partner avatar | Direct but private | +| Daily question | Heart + card | App mark | Daily ritual | +| Gentle reminder | Heart/soft nudge | Partner avatar optional | No pressure | +| Date match | Heart + calendar/card | Date-card art optional | Shared choice | +| Capsule unlocked | Heart + lock/open card | Capsule art optional | Memory opened | +| Challenge waiting | Heart + small path/card | Challenge art optional | Small next step | + +Notification artwork rules: + +- Never show readable answer text, prompt text, invite codes, message previews, or sensitive category + labels inside artwork. +- Avoid alarm-bell, siren, warning-triangle, fire, or countdown imagery. +- Prefer sealed cards, paired cards, soft hearts, moon/quiet-hours, calendar/date-card, and capsule + objects. +- Use the existing pink/lavender palette with high-contrast monochrome exports for platform glyphs. + +### 5. In-App Icon and Glyph Set + +Use Material/SF Symbols for normal UI controls. Use custom brand glyphs only for relationship +concepts that need a softer product voice. + +Needed custom glyphs: + +- `glyph-private-reveal` +- `glyph-two-people` +- `glyph-daily-card` +- `glyph-sealed-answer` +- `glyph-memory-capsule` +- `glyph-date-match` +- `glyph-quiet-hours` +- `glyph-couple-premium` +- `glyph-export-data` +- `glyph-delete-account` + +These should be simple single-color vectors that work at 20-32 dp/pt. + +### 6. Store and Marketing Assets + +| Asset | Spec | Direction | +| --- | --- | --- | +| Play feature graphic | 1024 x 500 PNG | Heart + one private ritual illustration + short promise | +| Play screenshots | Up to 8 phone screenshots | Use product screens; omit login unless testing trust | +| App Store screenshots | iPhone 6.7", 6.5", 5.5" as needed | Mirror Play story | +| Social open graph | 1200 x 630 | Couple illustration + "A private space for two." | +| Press/brand header | 1600 x 900 | Illustration-led, logo lockup | +| Website hero | Responsive bitmap | Couple illustration in first viewport, not a symbol-only hero | + +Recommended screenshot story: + +1. Onboarding/private promise. +2. Home next-best action. +3. Daily question/private answer. +4. Mutual reveal/history. +5. Question packs. +6. Play/spin wheel. +7. Date planning. +8. Privacy/settings/subscription trust. + +### 7. Empty States and Milestones + +Each major empty state should have a matching illustration or glyph: + +- No partner yet: `illustration-couple-invite` +- Waiting for partner: `illustration-partner-activation` +- No history yet: `illustration-couple-history` +- No messages yet: new `illustration-chat-thread` +- No date matches yet: new `illustration-date-match` +- No memory capsules: new `illustration-memory-capsule` +- Quiet hours enabled: new `illustration-quiet-hours` +- Premium/paywall: `illustration-couple-paywall` or `illustration-couple-subscription` + +### 8. Motion and Celebration + +Keep motion small and intimate: + +- Heart pulse for pairing/reveal ready. +- Petal/heart particles for mutual reveal, date match, milestone. +- Slow card unlock animation for reveal/capsule. +- No confetti storms for sensitive answers. + +### 9. File Organization + +Recommended structure: + +```text +docs/brand/ + asset-system.md + visual-identity.md + sources/ + closer-mark.svg + closer-lockup.svg + closer-lockup-horizontal.svg + notification-art/ + notification-heart.svg + notification-paired-cards.svg + notification-quiet-hours.svg + notification-capsule.svg + glyphs/ + exports/ + logo/ + store/ + social/ + +app/src/main/res/ + drawable/ # vectors exported from artwork sources + drawable-nodpi/ # raster illustrations shared with Android + mipmap-*/ # launcher icons + +iphone/Closer/Resources/ + Assets.xcassets/ # app icons and platform-managed assets + illustration-*.png + pack-art-*.png +``` + +## Priority Build List + +1. Keep the current heart mark, but create wordmark/horizontal/one-color SVG lockups. +2. Add the missing iOS AppIcon set. +3. Mirror illustration PNGs into Android and start using them in onboarding, empty states, paywall, + and store screenshots. +4. Rework the Play feature graphic to include one couple/private-ritual illustration. +5. Add the new notification and privacy illustrations listed above. +6. Build a small custom glyph set for privacy/reveal/date/capsule concepts. diff --git a/docs/brand/visual-identity.md b/docs/brand/visual-identity.md index 3a716972..ff7f8cbd 100644 --- a/docs/brand/visual-identity.md +++ b/docs/brand/visual-identity.md @@ -6,6 +6,9 @@ a public dating profile. Product goal: **private, mutual-reveal relationship questions with real encryption and calmer UX**. Visual decisions should reinforce that promise before decoration, novelty, or growth mechanics. +For the full working asset set, including illustration, notification, store, and logo-export +requirements, see `docs/brand/asset-system.md`. + ## Brand mark The mark is one heart formed by two equal halves. Pink and lavender represent two people meeting at