Closer/ClaudeBrandingReview.md

# Closer — Branding & Artwork Review (Pass H)

Living deliverable for the **Branding pass**. It captures, screen by screen, where Closer could carry more of its
brand, and gives **ready-to-paste ChatGPT image-generation prompts** for the artwork worth adding. The user generates
the images; this file only describes them. Every prompt reuses the **House Style** block below so all new art matches
the existing artwork (`docs/brand/visual-identity.md` + `docs/brand/asset-system.md` + the shipped `illustration_*` /
`pack_art_*` / `particle_*` assets).

> Branding **defects** (off-brand color, clipped/low-contrast art) → `ClaudeReport.md`. Pure "could be warmer / feature"
> ideas → `Future.md` `## QA`. New art to create → here.

---

## R10 brand walk (2026-06-26) — existing art integration clean, 0 defects
R10 visual sweep doubled as the Pass-H existing-art integration check: Today (paired-books daily-question art),
Paywall (couple illustration), Security (padlock), Memory Lane / Date / Bucket-List empties, Home cards — **all render
on-brand, in-context, both themes, no clipping/placeholder/off-brand issues** (any defect would be a `ClaudeReport.md`
bug; none found). The new game-alert surfaces (`GamePromptBanner`, `GameWaitingHeroCard`) use the brand purple gradient
+ PlayArrow glyph and read as intentional action banners — no illustration warranted. No new art to add this round.

## This or That gameplay brand plan (Codex QA, 2026-06-27)
Live review used a dedicated QA launcher/device (`CloserCodexQA`) with a fresh admin-created test couple
(`codex-this-or-that-*` / `codex-partner-*`). Screenshots checked the mood picker and active gameplay in light and dark
mode. The visual issue is real: light-mode option buttons are directionally good, but dark mode makes the current prompt
backdrop feel like an accidental placeholder.

**Verdict:** The current `ChoicePromptBackdrop` two-circle + diagonal-line drawing should be treated as a branding defect
for active gameplay. In dark mode the diagonal line cuts through the question, the circles turn muddy, and the whole
motif reads like a technical diagram instead of a warm private ritual for two.

**Plan**
- Replace the two circles + line with a Closer-native "private choice" motif: two soft sealed answer cards, paired-card
  silhouettes, or a subtle C-heart/keyhole accent. Keep it decorative and low-contrast behind the prompt; no line should
  cross the question text.
- Keep the light-mode option card shape, spacing, and button feel. Make the colors theme-aware rather than reusing fixed
  purple/pink values in both themes.
- Dark-mode option cards need stronger contrast: readable body text, visible borders, and selected states that feel rich
  instead of dim. Disabled/other-selected states should still be legible.
- Keep `closerBackgroundBrush()` as the foundation, but consider one very subtle game-local glow or paired-card vignette
  in brand colors. The background should support focus, not compete with the question or options.
- Re-check the mood picker after gameplay is fixed. The numbered mood circles are acceptable, but paired-card glyphs or
  warmer step badges would feel more branded than plain numbered bubbles.
- Results can reuse `illustration_reveal_celebration` and existing heart/petal particles for high-match moments; the game
  surface itself should stay code-native rather than needing a full raster illustration.

**Implementation map**
- Update `app/src/main/java/app/closer/ui/thisorthat/ThisOrThatScreen.kt`, especially `ChoicePromptBackdrop`,
  `OptionCard`, and `VersusBadge`.
- Add local theme-aware helpers for This-or-That option A/B colors, selected colors, disabled colors, border colors, and
  prompt-backdrop alphas. Validate against both `MaterialTheme.colorScheme.background` and `surface`.
- Prefer Compose `Canvas`/shape drawing for the prompt motif. Generate raster art only if the code-native motif cannot
  carry the brand; if generated, use transparent PNG art with no readable text.
- Add or update light/dark Compose previews for mood selection, active prompt, selected answer, waiting/disabled, and
  results.

**Acceptance checks**
- Light and dark screenshots show no decorative element crossing or competing with the prompt text.
- Long prompts, long options, selected, unselected, and disabled states stay readable.
- The light-mode cards retain the current friendly button feel.
- Dark mode feels intentionally Closer-branded: aubergine/lavender/pink, soft and private, not a placeholder diagram.
- Logs are checked after opening a game from notification/deep link before assuming the route worked.

## ✅ WIRED INTO ANDROID (2026-06-26 art drop) — generated illustrations live
The generated art (source in gitignored `docs/brand/generated-art/`, copied full-res to
`app/src/main/res/drawable-nodpi/`) is now wired into the app via the shared `EmptyState`
(rounded-tile, theme-safe) and a new `ui/components/BrandIllustration.kt` helper:

| Art | Screen wired | Verified |
|---|---|---|
| A1 `pairing_success` (transparent) | PairingSuccessScreen hero (replaced the keyhole chip; pulse/spring kept) | gallery (transparent floats) |
| A2 `answer_history_empty` | AnswerHistoryScreen empty (replaced generic couple_history) | shared EmptyState (Run-2 both-theme) |
| A3 `connection_challenges_header` (banner) | ConnectionChallengesScreen series-list header | gallery (16:9 banner) |
| A4 `memory_lane_capsule` | MemoryLaneScreen empty (replaced 📦 emoji) | shared tile |
| A5 `date_match_empty` / `date_match_success` | DateMatchesScreen empty / "It is a match!" modal | shared tile / gallery |
| A6 `bucket_list_empty` | BucketListScreen empty | **live dark + light** |
| A8 `messages_empty` | MessagesInboxScreen (new empty state added) | shared EmptyState |
| A9 `quiet_hours` | NotificationSettings quiet-hours section | **live dark** |
| A10 `past_games_empty` | WheelHistoryScreen ("Past Games") empty | shared tile |
| A11 `privacy_recovery` | SecurityScreen header | **live dark** |
| A12 `account_deletion_goodbye` | DeleteAccountScreen header | **live dark** |

All 12 also live in the debug **Art preview** gallery (Settings → Art preview) for both-theme verification.
**Not done:** A7 pack art = **N/A** (all 10 packs already have `pack_art_*`). **G-set glyph art generated
2026-06-27 and ready to add** from `docs/brand/generated-art/glyphs/`; app wiring is still pending.
A1-A12 prompts are complete and should not be regenerated. Empty/match/pairing states that need empty-or-new data weren't
reachable on the baseline couple — render path proven via the shared tile + gallery. Commits `077a408`→`5868d06` on `dev`.

---

## House Style (paste this at the top of EVERY image prompt)

> Flat 2D pastel vector **illustration** in the "Closer" couples-app style: soft rounded shapes, **no harsh outlines**,
> gentle smooth gradients, calm and intimate. **Palette only:** aubergine `#24122F`, deep purple `#56306F`, lavender
> `#B98AF4`, soft pink `#F7C8E4`, soft lavender `#D9B8FF`, blush white `#FFF8FC`. Mood: **warm, quiet, equal,
> intentional — a private ritual for two.** Recurring motifs available: paired/sealed cards, floating hearts and
> petals, a small wooden table with mugs + a lit candle + a lavender sprig, moon/window for quiet hours, a
> calendar/date-card, a sealed capsule/box. If people appear: **two balanced, inclusive figures, simple friendly
> faces, no dominant partner.** Soft abstract floral/heart shapes in the background.
> **Do NOT include:** any readable text, answer/prompt/message content, invite codes, emails, app UI/buttons, generic
> dating-app clichés, stock-photo realism, other brands' logos/wordmarks/app-store badges,
> alarm/urgency/surveillance/fire imagery.

> **The Closer brand mark** (use ONLY where a prompt explicitly calls for it — otherwise keep art mark-free): a
> pink-to-lavender **"C"** whose upper arc is soft pink and lower sweep is lavender, curving around a **heart-shaped
> negative space** with a small **dark aubergine keyhole** at its center (the keyhole = trust/privacy; the heart =
> the couple). Keep it faithful — do not redraw it as a plain `C`, turn the keyhole into a heart, add a key/lock
> shackle, add faces or text. On dark/aubergine surfaces use a white keyhole; on light/blush use the aubergine keyhole.

**Aspect/format conventions**
- Hero/onboarding/paywall: portrait **4:5** (matches `illustration_couple_*`).
- Empty states: roughly **square 1:1**, generous padding, sits centered above text.
- Celebration: **1:1**, transparent or blush-white background.
- Glyphs: **single-color** simple vector, square, legible at 20–32 dp.
- Pack/category art: **landscape ~16:9** banner, object-led (no people), like `pack_art_*`.
- Always readable on **both** blush-white (light) and aubergine (dark) surfaces — keep a soft self-contained vignette
  rather than a hard rectangular background; export PNG with transparency where noted.

**Existing assets (reuse before generating):** the generated A1-A12 illustration set above, `illustration_couple_*`,
`illustration_daily_question`, `illustration_tonight_partner_prompt`, `illustration_partner_activation`,
`illustration_reveal_celebration`, `illustration_streak_milestone`, `illustration_together_empty`, all 10
`pack_art_*` assets, `particle_heart`, and `particle_petal`. These are Android assets now; only generate new art when a
future QA pass finds a specific missing surface or replacement-worthy defect.

---

## Screen-by-screen audit

Legend: ✅ on-brand / no art needed · ➕ add/wire art · 🎨 new art to generate · 🔤 brand-copy/color touch

| Screen / surface | Current brand state | Opportunity |
|---|---|---|
| Onboarding carousel | ✅ couple art + warm copy | ✅ strong already |
| Welcome (Create / I have account) | heart mark + privacy line | ✅ on-brand; could rotate privacy messages 🔤 |
| Sign up / Login / Forgot password | plain form | 🔤 add small heart mark + one privacy line above the form (no big art — keep forms clean) |
| Create profile — name / sex / photo | plain steps | 🔤 light: small step glyphs; ✅ otherwise (forms stay clean) |
| Pair: invite (create code) | `illustration_couple_invite` wired | ✅ |
| Pair: accept code / pairing success | `illustration_pairing_success` wired | ✅ |
| Home (paired) | cards, warm copy | ✅ good; ensure card icons use brand glyphs 🔤 |
| Home (unpaired "bring your person in") | couple art present | ✅ on-brand |
| Today / daily question | clean card | ✅; reveal moment is the place for art (below) |
| Answer reveal (mutual) | `illustration_reveal_celebration` wired | ✅ |
| Answer history | `illustration_answer_history_empty` wired | ✅ |
| Play hub | card list, game glyphs | ✅; verify each game card has a consistent brand glyph 🔤 |
| This or That (setup/play) | light buttons good; dark prompt backdrop off-brand | 🔤 replace two-circle/line motif + theme option colors |
| This or That / How Well / Desire Sync **results** | score + rows | ➕ small celebration header art (reuse `reveal_celebration`); particles on high match |
| How Well / Desire Sync intro | icon + copy | ✅ |
| Spin the Wheel | nice wheel art | ✅ wheel is on-brand |
| Wheel complete / results | text reveal | ➕ celebration header (reuse particles) |
| Connection Challenges (series list) | `illustration_connection_challenges_header` wired | ✅; verify per-series glyph consistency 🔤 |
| Connection Challenges (active day) | clean | 🔤 small streak/heart glyph; ✅ otherwise |
| Memory Lane (list) | `illustration_memory_lane_capsule` empty state wired | ✅ |
| Memory Lane (sealed capsule) | lock + date | ➕ optional: reuse capsule art on sealed-card detail, no new art |
| Date Match (deck) | clean cards | ✅ |
| Date Match (your matches / empty) | empty + success art wired | ✅ |
| Plan Date / Date Builder | form | 🔤 small date-card glyph; ✅ otherwise |
| Bucket List (empty) | `illustration_bucket_list_empty` wired | ✅ |
| Question Packs (library) | all 10 `pack_art_*` assets present | ✅ |
| Messages (inbox empty) | `illustration_messages_empty` wired | ✅ |
| Conversation | chat | ✅ keep clean; quiet-hours art is in settings |
| Past Games (empty/list) | `illustration_past_games_empty` wired | ✅ |
| Your Progress / Activity | stats | 🔤 brand-colored charts; reuse `streak_milestone` for milestones |
| Paywall / Subscription | couple art present | ✅ strong (couple illustration + “one subscription for both”) |
| WaitingForPartner | category glyph + copy | ✅ on-brand; ensure glyph per game type |
| Settings + sub-pages | dense lists | ✅ keep clean — **no illustrations**; brand via section headers/color only 🔤 |
| Security / Recovery phrase | `illustration_privacy_recovery` wired | ✅ |
| Privacy & Terms | text | 🔤 small lock glyph header |
| Delete account | `illustration_account_deletion_goodbye` wired | ✅ |
| Quiet hours (settings) | `illustration_quiet_hours` wired | ✅ |
| Notifications (system) | G-set glyph art generated, not wired | ➕ wire `docs/brand/generated-art/glyphs/android-vector/glyph_*.xml` |

---

## Art to generate — status

A1-A12 were generated and wired into Android. A7 is not needed because all 10 question packs already have `pack_art_*`.
G-set glyphs were generated 2026-06-27 and are ready to add from `docs/brand/generated-art/glyphs/`. There are no active
art-generation prompts right now.

Do not regenerate completed illustration art unless a future QA pass logs a specific defect that requires replacement.
Always clean up completed art items: once an asset is generated, wired, and verified, remove its prompt from this active
backlog and update the audit table/status notes so only unfinished work remains.

**Generated G-set files:** `glyph_closer_mark`, `glyph_paired_cards`, `glyph_daily_card`, `glyph_sealed_answer`,
`glyph_memory_capsule`, `glyph_date_card_heart`, `glyph_quiet_hours_moon`, `glyph_couple_premium`,
`glyph_export_data`, `glyph_delete_account`.

---

## Notes for the asset hand-off
- Match filenames to the existing scheme: `illustration_<name>.png` (nodpi), `pack_art_<pack>.png`, `glyph_<name>.xml`,
  `particle_<name>.png`. Provide @1x in `drawable-nodpi/` (illustrations) or density buckets where the existing asset has them.
- For the generated G-set, use the source SVGs in `docs/brand/generated-art/glyphs/source-svg/` for review and the
  Android-ready vectors in `docs/brand/generated-art/glyphs/android-vector/` for app wiring.
- After adding art, re-run Pass C (visual, light + dark) on those screens to confirm contrast + no clipping, and
  re-export store graphics per `docs/brand/visual-identity.md` if the palette/mark changed.
</content>