# CLAIR — App Store Screenshot Specifications
**Required:** 6 screenshots
**Device frame:** iPhone 15 Pro Max (6.7")
**Dimensions:** 1290 x 2796 px (portrait)
**Format:** PNG, sRGB
**Background:** latte `#E6DACD` or background-light `#F9F5F1`
---
## Screenshot 1: Hero — Dossier Ready
**App screen:** `marketing-assets/screenshots/dossier-ready-87pct.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"Know Before You Meet"** |
| Subheadline | "Full intelligence dossier in 20 seconds" |
| Background | latte `#E6DACD` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing 87% match dossier, subheadline below phone |
**Purpose:** Lead with the end result — the completed dossier with compatibility score. Establishes the core value proposition immediately.
---
## Screenshot 2: Upload Flow
**App screen:** `marketing-assets/screenshots/extracting-profile-data.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"One Screenshot. That's It."** |
| Subheadline | "Works with Hinge, Bumble, Tinder — any dating app" |
| Background | background-light `#F9F5F1` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing profile extraction in progress |
**Purpose:** Show how simple the input is. One screenshot from any app they already use.
---
## Screenshot 3: Compatibility Analysis
**App screen:** `marketing-assets/screenshots/compatibility-analysis.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"87% Compatible. Here's Why."** |
| Subheadline | "Trained on 127,000+ successful couples" |
| Background | latte `#E6DACD` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing detailed compatibility breakdown |
**Purpose:** Showcase the depth of the compatibility analysis. The data-from-couples proof point builds credibility.
---
## Screenshot 4: Red Flag Detection
**App screen:** `marketing-assets/screenshots/red-flag-analysis.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"Red Flags. Before Date One."** |
| Subheadline | "Identity gaps, inconsistencies, and risk signals — surfaced automatically" |
| Background | background-light `#F9F5F1` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing red flag results |
**Purpose:** Safety is CLAIR's strongest cultural defense. This screenshot speaks to the safety-conscious persona and differentiates from pure compatibility tools.
---
## Screenshot 5: Conversation Starters
**App screen:** `marketing-assets/screenshots/conversation-starters.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"What to Say. And What Not To."** |
| Subheadline | "Personalized openers and coaching for every match" |
| Background | latte `#E6DACD` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing personalized conversation starters |
**Purpose:** Demonstrates ongoing value beyond the initial dossier. Appeals to the practical "what do I do with this information" question.
---
## Screenshot 6: Full Dossier Detail
**App screen:** `marketing-assets/screenshots/dossier-details.png`
| Element | Specification |
|---------|--------------|
| Headline overlay | **"The Full Picture. 20 Seconds."** |
| Subheadline | "Identity. Personality. Social. Compatibility. One dossier." |
| Background | background-light `#F9F5F1` |
| Headline font | Outfit, extralight (200), obsidian-dark `#1a120e` |
| Subheadline font | Outfit, light (300), obsidian-brown `#291E18` |
| Layout | Headline top-center, phone frame center showing full dossier with personality, social media, and tools sections visible |
**Purpose:** Closing screenshot showing the comprehensive depth. Reinforces the "20 seconds" speed claim alongside the breadth of intelligence.
---
## Production Notes
### Typography
- All headline overlays: Outfit from Google Fonts, weight 200 (extralight)
- All subheadlines: Outfit, weight 300 (light)
- No bold text in any screenshot overlay — the CLAIR aesthetic is defined by ultralight type at large sizes
### Color
- Text: obsidian-dark `#1a120e` for headlines, obsidian-brown `#291E18` for subheadlines
- Backgrounds alternate between latte `#E6DACD` and background-light `#F9F5F1` for visual rhythm
- No clinical-blue `#4DDCFF` in overlays — let the app UI provide the accent color naturally
### Layout
- Phone frame centered vertically, offset slightly below center to leave room for headline
- Headline positioned at ~15% from top
- Subheadline positioned at ~80% from top (below the phone frame)
- Maintain minimum 40px padding from edges
### Device Frame
- Use iPhone 15 Pro Max frame with titanium bezel
- Screenshots should be placed inside the device frame at native resolution
- Status bar visible (time, signal, battery) for authenticity
---
*CLAIR — Dating, Decoded. | askclair.io | Early Access 2026*