Closer/docs/brand/asset-system.md

# 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 compact brand mark is now the approved Closer C-heart-keyhole. The couple artwork should remain
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/brand/sources/closer-approved-icon-source.png` as the visual source of truth for the compact
  C-heart-keyhole mark.
- `docs/store/sources/app-icon.svg` as the source wrapper for the launcher/store icon.
- `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 mark is strong for launchers, auth, loaders, notification glyphs, and small privacy seals. 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 C-heart-keyhole 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/brand/sources/closer-approved-icon-square-white-keyhole.png` |
| Mark for dark backgrounds | Logo use on aubergine/purple surfaces | `docs/brand/sources/closer-mark-on-dark.svg` |
| Mark for light backgrounds | Logo use on blush/white/light surfaces | `docs/brand/sources/closer-mark-on-light.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 notification small icon | `app/src/main/res/drawable-nodpi/ic_notification_closer.png` |
| 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 mark should mean "Closer is the private space around your relationship." Keep the
approved pink upper C, lavender lower sweep, heart-shaped inner space, and true keyhole. Do not
redraw it as a generic `C`, turn the keyhole into a heart, add a key or lock shackle, add faces, add
text inside it, or use it as a reaction emoji.

Keyhole rule: use the white keyhole in the official launcher/store icon and on dark aubergine/purple
logo surfaces. Use the aubergine keyhole on light or blush in-app surfaces when the mark should feel
calmer.

### 1a. Loaded asset sets → where they are used (routing)

This maps the asset sets currently on disk to their destination. Treat the `sources/` files as
masters (do not ship them directly); ship the exports and the wired Android rasters.

| File on disk | Role | Wired into / destination |
| --- | --- | --- |
| `docs/brand/sources/closer-approved-icon-source.png` | Master source of truth (full color, dark keyhole) | Regenerate all icons from this after any mark change |
| `docs/brand/sources/closer-approved-icon-square.png` | Square 1024 master | iOS `AppIcon` 1024, store 1024 |
| `docs/brand/sources/closer-mark.svg` | Vector master of the mark | Source for all PNG exports |
| `docs/brand/sources/closer-mark-transparent-keyhole-white.png` | Transparent mark, white keyhole (for dark aubergine/purple) | **Source of** `drawable-nodpi/closer_launcher_foreground.png` (adaptive fg over the aubergine bg) + the Auth/Onboarding logo tile (dark surface) |
| `docs/brand/sources/closer-mark-transparent-keyhole-aubergine.png` | Transparent mark, dark keyhole (for light/blush surfaces) | Logo on light/blush placements + web/docs exports (no in-app wiring today — in-app loaders now use the white-keyhole chip) |
| `docs/brand/sources/closer-mark-transparent-keyhole-black.png` | Mono/max-contrast mark | Print/legal, max-contrast light |
| `docs/brand/exports/logo/transparent-keyhole-aubergine/closer-mark-{24..1024}.png` | Sized PNGs, dark keyhole | Web/email/social on light, docs, favicons |
| `docs/brand/exports/logo/transparent-keyhole-white/closer-mark-{24..1024}.png` | Sized PNGs, white keyhole | Same, on dark surfaces |
| `docs/brand/exports/logo/transparent-keyhole-black/closer-mark-{24..1024}.png` | Sized PNGs, mono | One-color/print/footer |
| `docs/brand/exports/logo/social/closer-mark-social-{1024,2048}.png` | Square social avatars / OG | Social profile + open-graph square |
| `docs/brand/exports/logo/app-icon/closer-app-icon-512.png` | Play listing icon | `docs/store/app-icon-512.png` (Play Console) |
| `app/src/main/res/drawable-nodpi/closer_launcher_foreground.png` | Adaptive **foreground** (white-keyhole mark, safe-zone) | `drawable/ic_launcher_foreground.xml` → `mipmap-anydpi-*/ic_launcher*.xml`; Auth/Onboarding logo tile; **`CloserMarkLoader` chip + `PairingSuccess` hero** (white-keyhole logo on the aubergine app-icon chip) |
| `app/src/main/res/drawable/ic_launcher_background.xml` | Adaptive **background** (aubergine gradient) | `mipmap-anydpi-*/ic_launcher*.xml` |
| `app/src/main/res/drawable-nodpi/closer_launcher_monochrome.png` | Themed-icon **monochrome** (grayscale+alpha) | `drawable/ic_launcher_monochrome.xml` → `mipmap-anydpi-v33/*` |
| `app/src/main/res/drawable-nodpi/ic_notification_closer.png` | Notification small icon (white+alpha silhouette) | `NotificationHelper`, `PartnerNotificationManager` `setSmallIcon` |

Note: the section-1 rows `closer-mark-on-dark.svg` / `closer-mark-on-light.svg` and the lockup/favicon
rows are still **to-build** — the on-disk equivalents today are the `transparent-keyhole-white` (dark)
and `transparent-keyhole-aubergine` (light) PNG sets above.

### 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, Play, and iOS AppIcon assets exist and should be regenerated from the approved source
  image after any future mark change.

### 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 | C-heart-keyhole + 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. Build wordmark/horizontal/one-color lockups around the approved C-heart-keyhole.
2. Mirror illustration PNGs into Android and start using them in onboarding, empty states, paywall,
   and store screenshots.
3. Rework the Play feature graphic to include one couple/private-ritual illustration.
4. Add the new notification and privacy illustrations listed above.
5. Build a small custom glyph set for privacy/reveal/date/capsule concepts.