qa(plan): add Pass H Branding & artwork + ClaudeBrandingReview.md (house style + ChatGPT prompts)
- Pass H: consumer-mindset branding review of every screen; output = ready-to-paste ChatGPT image prompts; must lock the house style first (read brand docs + open existing illustrations) so all generated art matches the shipped artwork. - ClaudeBrandingReview.md: canonical House Style prompt prefix + palette + negatives; screen-by-screen audit (every route); 12 illustration prompts (A1-A12) + glyph set + pack-art prompt, all reusing the house style; flags 'wire existing iOS art into Android' vs new generation. - Future.md QA: non-art branding ideas (wire iOS illustrations to Android, consistent glyphs, rotate privacy messages on auth screens). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
null
parent
2545da5c8b
commit
450ddccd16
|
|
@ -0,0 +1,161 @@
|
|||
# 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.
|
||||
|
||||
---
|
||||
|
||||
## 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: a single heart made of two equal pink+lavender
|
||||
> halves, 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, brand logos, alarm/urgency/surveillance/fire imagery.
|
||||
|
||||
**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):** `illustration_couple_onboarding`, `_invite`, `_history`, `_paywall`,
|
||||
`_subscription`, `illustration_tonight_partner_prompt`, `illustration_partner_activation`,
|
||||
`illustration_reveal_celebration`, `illustration_streak_milestone`, `illustration_together_empty`,
|
||||
`pack_art_{deep_reflection,family_commitment,home_life,trust_repair,money_values}`, `particle_heart`, `particle_petal`.
|
||||
NOTE: most live only in iOS / `drawable-nodpi`; several screens below need the **Android copy** wired up, not new art.
|
||||
|
||||
---
|
||||
|
||||
## Screen-by-screen audit
|
||||
|
||||
Legend: ✅ on-brand / no art needed · ➕ add/þwire art (prompt below) · 🎨 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) | has recovery phrase, clean | ➕ small `illustration_couple_invite` at top (exists on iOS — wire to Android) |
|
||||
| Pair: accept code / pairing success | minimal | 🎨 **A1** pairing-success celebration |
|
||||
| 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) | functional | ➕ use `illustration_reveal_celebration` + petal/heart particles at the reveal beat |
|
||||
| Answer history | list | ➕ empty state → wire `illustration_couple_history`; 🎨 **A2** if none |
|
||||
| Play hub | card list, game glyphs | ✅; verify each game card has a consistent brand glyph 🔤 |
|
||||
| This or That (setup/play) | clean | ✅ |
|
||||
| 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) | text list | 🎨 **A3** series/“small steps” header + per-series glyphs |
|
||||
| Connection Challenges (active day) | clean | 🔤 small streak/heart glyph; ✅ otherwise |
|
||||
| Memory Lane (list) | sealed rows | 🎨 **A4** empty state (no capsules) + sealed-capsule glyph |
|
||||
| Memory Lane (sealed capsule) | lock + date | ➕ use capsule art (A4) on the sealed card |
|
||||
| Date Match (deck) | clean cards | ✅ |
|
||||
| Date Match (your matches / empty) | list | 🎨 **A5** “no matches yet” + match celebration |
|
||||
| Plan Date / Date Builder | form | 🔤 small date-card glyph; ✅ otherwise |
|
||||
| Bucket List (empty) | list | 🎨 **A6** “save ideas together” empty state |
|
||||
| Question Packs (library) | `pack_art_*` present | ✅; 🎨 **A7** packs needing art (any pack without `pack_art_*`) |
|
||||
| Messages (inbox empty) | list | 🎨 **A8** “no messages yet” (two soft bubbles, no text) |
|
||||
| Conversation | chat | ✅ keep clean; quiet-hours state → A9 |
|
||||
| Past Games (empty/list) | list | ➕ small replay/heart glyph; 🎨 **A10** if empty state bare |
|
||||
| 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 | text | 🎨 **A11** privacy-lock illustration (two sealed cards behind a soft lock) |
|
||||
| Privacy & Terms | text | 🔤 small lock glyph header |
|
||||
| Delete account | warning copy | 🎨 **A12** calm export/delete privacy scene (no alarm imagery) |
|
||||
| Quiet hours (settings) | toggle | 🎨 **A9** moon/window/two-muted-phones |
|
||||
| Notifications (system) | fallback glyph | 🎨 **G-set** monochrome notification glyph (heart/paired-card) |
|
||||
|
||||
---
|
||||
|
||||
## Art to generate — ChatGPT prompts (prefix the House Style block to each)
|
||||
|
||||
Priority order = the moments a user feels most. Each is self-contained after you paste the House Style block first.
|
||||
|
||||
**A1 · Pairing success celebration** — *1:1, transparent bg.*
|
||||
> Scene: two equal heart-halves (soft pink + soft lavender) sliding together into one whole heart at the center, with
|
||||
> a gentle burst of small floating hearts and petals around it. Convey "you're connected now." Calm, joyful, no text.
|
||||
|
||||
**A2 · Answer history empty state** — *1:1.*
|
||||
> Scene: a small soft journal/photo-album, slightly open, with two paired cards tucked inside and a few faint floating
|
||||
> hearts; a lavender sprig beside it. Conveys "your shared moments will collect here." Quiet and inviting.
|
||||
|
||||
**A3 · Connection Challenges header ("small steps together")** — *16:9 banner, object-led.*
|
||||
> Scene: a gentle winding path of soft stepping-stones, each stone a small rounded card, leading toward a glowing
|
||||
> heart; a tiny lit candle and lavender fronds at the edges. Conveys a shared daily habit, "one small step at a time."
|
||||
|
||||
**A4 · Memory Lane — sealed capsule** — *1:1 (also usable as the sealed-card glyph).*
|
||||
> Scene: a softly glowing sealed keepsake box/time-capsule with a small heart latch, a calendar/moon hint above it, a
|
||||
> couple of petals settling. Conveys "sealed until your chosen date." Warm, secret, safe.
|
||||
|
||||
**A5 · Date match — "it's a match" + empty** — *1:1.*
|
||||
> Scene: two date-idea cards (one pink, one lavender) leaning together to meet in the middle with a small heart where
|
||||
> they touch; faint calendar/clock and a sun/hill motif behind. Conveys "you both chose this." For the empty variant,
|
||||
> show the two cards slightly apart with a dotted soft line between them.
|
||||
|
||||
**A6 · Bucket List empty state** — *1:1.*
|
||||
> Scene: a soft open notebook with a checklist of blank rounded lines, a small star and heart doodle, a pin/map dot
|
||||
> and a tiny suitcase, lavender sprig accent. Conveys "save ideas to do together." Hopeful, light.
|
||||
|
||||
**A7 · Question pack art (per missing pack)** — *16:9 banner, object-led, match `pack_art_*`.*
|
||||
> Scene: a fanned deck of paired cards as the hero object, themed to the pack topic with one simple symbol (e.g.
|
||||
> intimacy = soft flame + petals; communication = two speech shapes; future = a small horizon/sunrise), framed by
|
||||
> lavender fronds and a soft glow. No people, no readable text. (Generate one per pack that lacks `pack_art_*`.)
|
||||
|
||||
**A8 · Messages empty state** — *1:1.*
|
||||
> Scene: two soft rounded chat bubbles (one pink, one lavender) gently overlapping with a small heart between them and
|
||||
> a few floating petals; **no text inside the bubbles.** Conveys "your private conversation starts here."
|
||||
|
||||
**A9 · Quiet hours** — *1:1.*
|
||||
> Scene: a calm night window with a soft crescent moon and stars, and two muted phones resting face-down on a bedside
|
||||
> surface with a small lavender sprig. Conveys "gentle, no pressure, paused for the night." Soothing, no alarm imagery.
|
||||
|
||||
**A10 · Past Games empty state** — *1:1.*
|
||||
> Scene: two paired game cards stacked with a soft replay/loop arc of petals around them and a faint heart. Conveys
|
||||
> "the games you've played together will live here." Playful but calm.
|
||||
|
||||
**A11 · Privacy / Recovery — privacy-lock** — *1:1 or 4:5.*
|
||||
> Scene: two sealed cards or closed journals nestled behind a soft, friendly padlock with a small heart on it; a key
|
||||
> shape made of a lavender sprig; quiet protective glow. Conveys "only the two of you hold the key." Reassuring, warm —
|
||||
> **not** a cold security/vault look.
|
||||
|
||||
**A12 · Account deletion — calm goodbye** — *1:1.*
|
||||
> Scene: a soft open box gently releasing a few hearts/petals upward, with a faint door/horizon and a lavender sprig;
|
||||
> muted, respectful, peaceful. Conveys "your data leaves with you." **No** warning triangles, red, broken hearts, or
|
||||
> alarm imagery.
|
||||
|
||||
**G-set · Notification + relationship glyphs** — *single-color vector, square, legible at 24 dp.* (One prompt each:)
|
||||
> Simple single-color flat glyph in the Closer style, no text, no background: **heart-of-two-halves**, **paired sealed
|
||||
> cards**, **daily card**, **sealed answer (card with small lock)**, **memory capsule**, **date-card with heart**,
|
||||
> **quiet-hours moon**, **couple-premium (heart + small crown/spark, tasteful)**, **export-data**, **delete-account**.
|
||||
> Export in lavender for in-app and as high-contrast monochrome for the platform notification glyph.
|
||||
|
||||
---
|
||||
|
||||
## 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.
|
||||
- Several items above are **"wire existing iOS art into Android,"** not new generation — do that first (cheaper):
|
||||
history, invite, daily-question, together-empty, partner-activation already exist on iOS.
|
||||
- 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>
|
||||
|
|
@ -307,6 +307,37 @@ relationship settings), `memory_capsule_unlocked`(scheduled→capsule), `challen
|
|||
mid-session; account deletion cascade; same account on two devices. No orphaned/broken state.
|
||||
- **Crash reporting:** confirm crashes/ANRs are actually captured (Crashlytics) so field issues surface.
|
||||
|
||||
### Pass H — Branding & artwork (every screen: could it carry more of the brand? where would art help?)
|
||||
A consumer-mindset pass focused on **brand presence and delight**, not defects. Walk **every screen and surface** and
|
||||
ask: *does this feel like Closer (private, warm, equal, intentional — a ritual for two)? Could brand color, the heart
|
||||
mark, a brand message, or an illustration make it warmer or clearer without clutter?* Output is **artwork descriptions
|
||||
written as ready-to-paste ChatGPT image-generation prompts** — the user generates the images; we only describe them.
|
||||
- **First, lock the house style (do this once per round, refresh if the art evolved):** read `docs/brand/visual-identity.md`
|
||||
+ `docs/brand/asset-system.md` AND open 2–3 existing illustrations (`illustration_couple_onboarding`,
|
||||
`illustration_reveal_celebration`, `pack_art_*`) to capture the *actual* look. New screens/features since the last
|
||||
brand review must be folded in. Keep the canonical **house-style prompt prefix** + palette in the branding deliverable
|
||||
(`ClaudeBrandingReview.md`) so every prompt reuses it and **all generated art matches the existing artwork.**
|
||||
- **House style (must hold for every prompt):** flat 2D pastel vector illustration; soft rounded shapes, no harsh
|
||||
outlines, gentle gradients; palette aubergine `#24122F` / deep purple `#56306F` / lavender `#B98AF4` / soft pink
|
||||
`#F7C8E4` / soft lavender `#D9B8FF` / blush white `#FFF8FC`; motifs = two-equal-halves heart, paired/sealed cards,
|
||||
floating hearts + petals, candle/mug/lavender-sprig warmth, moon/quiet-hours, calendar/date-card, capsule; mood =
|
||||
warm, quiet, equal, intentional. Couple figures balanced + inclusive, faces simple. **Never** show readable answer/
|
||||
prompt/message text, invite codes, emails, dating-app clichés, stock photos, alarm/urgency/surveillance imagery.
|
||||
- **Per screen, decide the brand opportunity** (pick the lightest that fits — don't over-decorate):
|
||||
- none needed (already on-brand, or a dense list/form where art would clutter) — say so;
|
||||
- **color/typographic** brand touch (palette, heart mark, a rotating privacy message);
|
||||
- **small glyph** (brand glyph for a relationship concept — describe it for the glyph set);
|
||||
- **hero/empty-state/celebration illustration** (the high-value case → write the full ChatGPT prompt).
|
||||
- **Each artwork item records:** screen/route · placement (hero / empty / header / card / celebration) · why it helps ·
|
||||
filename to match the existing scheme (`illustration_*`, `pack_art_*`, `glyph_*`, `particle_*`) · **the ChatGPT
|
||||
prompt** (house-style prefix + the specific scene) · aspect ratio/size + light/dark behavior. Cross-check the
|
||||
brand doc's "Needed additions" / empty-state list and **mark which already have assets vs still need art** (e.g.
|
||||
Android may still lack illustrations that iOS has).
|
||||
- **Prioritize** the screens a user feels most: onboarding/pairing, Home, paywall/subscription, reveal/celebration,
|
||||
empty states (no messages/dates/capsules/history), Memory Lane, Connection Challenges, date match, quiet-hours.
|
||||
- Branding *defects* (mis-colored, clipped, off-brand, low-contrast art) are bugs → `ClaudeReport.md`. Pure
|
||||
"works but could be warmer / a feature idea" → `Future.md` `## QA`. New art to create → `ClaudeBrandingReview.md`.
|
||||
|
||||
## Reporting → ClaudeReport.md (living QA report)
|
||||
- Header: date, build, devices, round number + run-state header.
|
||||
- One section per pass (A/B/C/D/E/F), each a table: **ID | Area | Screen/Route | Mode | Severity | Description | Repro
|
||||
|
|
|
|||
12
Future.md
12
Future.md
|
|
@ -24,3 +24,15 @@ Improvement & feature ideas surfaced while QA-testing as a consumer (each works
|
|||
- **Friendlier paywall empty/error state.** A-OBS fixed the raw SDK error leak; as a follow-up, when plans genuinely
|
||||
can't load, consider a retry-with-backoff + an offline-aware message, and hide the disabled "Continue" until plans
|
||||
load. *Prompted by:* A-OBS (env had no RevenueCat sandbox, but the state is worth polishing for real failures).
|
||||
- **Wire existing iOS illustrations into Android (brand uplift, low effort).** `docs/brand/asset-system.md` notes the
|
||||
couple illustrations exist on iOS but several Android screens don't show them yet (answer history, invite, daily-
|
||||
question, together-empty, partner-activation empty states). Mirroring the PNGs into `drawable-nodpi/` and using them
|
||||
would noticeably warm up empty states with no new art needed. *Prompted by:* Pass H branding review.
|
||||
- **Consistent brand glyphs across game cards + waiting/notification surfaces.** Game cards (Play hub), the
|
||||
WaitingForPartner screen, and notifications mix Material icons with brand art. A small custom glyph set
|
||||
(heart-of-two-halves, paired/sealed card, daily card, capsule, date-card, quiet-hours moon) used consistently would
|
||||
strengthen identity. See `ClaudeBrandingReview.md` "G-set". *Prompted by:* Pass H branding review.
|
||||
- **Rotating privacy messages on more entry surfaces.** The approved privacy-message rotation is a strong, on-brand
|
||||
reassurance; consider surfacing it on the sign-up/login/forgot-password screens (currently plain forms). *Prompted by:* Pass H.
|
||||
|
||||
> Artwork to generate (ChatGPT prompts, house-style-matched) lives in `ClaudeBrandingReview.md`, not here.
|
||||
|
|
|
|||
Loading…
Reference in New Issue