Add screens/ and feels-promo/ to gitignore
Remove promo assets and screenshots from version control. These are generated/working files that don't need to be tracked. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
4
.gitignore
vendored
@@ -74,3 +74,7 @@ GoogleService-Info.plist
|
|||||||
!*.xcconfig.template
|
!*.xcconfig.template
|
||||||
Secrets.swift
|
Secrets.swift
|
||||||
**/Secrets.swift
|
**/Secrets.swift
|
||||||
|
|
||||||
|
# Screenshots and promo assets
|
||||||
|
screens/
|
||||||
|
feels-promo/
|
||||||
|
|||||||
@@ -1,7 +0,0 @@
|
|||||||
{
|
|
||||||
"permissions": {
|
|
||||||
"allow": [
|
|
||||||
"WebSearch"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
8
feels-promo/.gitignore
vendored
@@ -1,8 +0,0 @@
|
|||||||
node_modules
|
|
||||||
dist
|
|
||||||
.DS_Store
|
|
||||||
.env
|
|
||||||
|
|
||||||
# Ignore the output video from Git but not videos you import into src/.
|
|
||||||
out
|
|
||||||
*.mp4
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
{
|
|
||||||
"useTabs": false,
|
|
||||||
"bracketSpacing": true,
|
|
||||||
"tabWidth": 2
|
|
||||||
}
|
|
||||||
@@ -1,54 +0,0 @@
|
|||||||
# Remotion video
|
|
||||||
|
|
||||||
<p align="center">
|
|
||||||
<a href="https://github.com/remotion-dev/logo">
|
|
||||||
<picture>
|
|
||||||
<source media="(prefers-color-scheme: dark)" srcset="https://github.com/remotion-dev/logo/raw/main/animated-logo-banner-dark.apng">
|
|
||||||
<img alt="Animated Remotion Logo" src="https://github.com/remotion-dev/logo/raw/main/animated-logo-banner-light.gif">
|
|
||||||
</picture>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
Welcome to your Remotion project!
|
|
||||||
|
|
||||||
## Commands
|
|
||||||
|
|
||||||
**Install Dependencies**
|
|
||||||
|
|
||||||
```console
|
|
||||||
npm install
|
|
||||||
```
|
|
||||||
|
|
||||||
**Start Preview**
|
|
||||||
|
|
||||||
```console
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
**Render video**
|
|
||||||
|
|
||||||
```console
|
|
||||||
npx remotion render
|
|
||||||
```
|
|
||||||
|
|
||||||
**Upgrade Remotion**
|
|
||||||
|
|
||||||
```console
|
|
||||||
npx remotion upgrade
|
|
||||||
```
|
|
||||||
|
|
||||||
## Docs
|
|
||||||
|
|
||||||
Get started with Remotion by reading the [fundamentals page](https://www.remotion.dev/docs/the-fundamentals).
|
|
||||||
|
|
||||||
## Help
|
|
||||||
|
|
||||||
We provide help on our [Discord server](https://discord.gg/6VzzNDwUwV).
|
|
||||||
|
|
||||||
## Issues
|
|
||||||
|
|
||||||
Found an issue with Remotion? [File an issue here](https://github.com/remotion-dev/remotion/issues/new).
|
|
||||||
|
|
||||||
## License
|
|
||||||
|
|
||||||
Note that for some entities a company license is needed. [Read the terms here](https://github.com/remotion-dev/remotion/blob/main/LICENSE.md).
|
|
||||||
@@ -1,270 +0,0 @@
|
|||||||
# Feels Promo Video - Future Concepts
|
|
||||||
|
|
||||||
This document outlines additional promotional video concepts to target different user segments and marketing channels.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept A: "30 Seconds to Self-Awareness"
|
|
||||||
|
|
||||||
**Duration**: 30 seconds
|
|
||||||
**Target**: New Year's resolution crowd, mental health awareness campaigns
|
|
||||||
**Tone**: Motivational, aspirational
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-5s] HOOK: "What if understanding yourself took 5 seconds a day?"
|
|
||||||
[5-12s] DEMO: Quick-fire mood logging from widget, watch, app
|
|
||||||
[12-18s] PAYOFF: Calendar filling with colors → Year View heatmap
|
|
||||||
[18-25s] INSIGHTS: AI insight card appearing with personalized message
|
|
||||||
[25-30s] CTA: App icon + "Start today. Understand tomorrow."
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Time-lapse of mood entries accumulating
|
|
||||||
- Split-screen: logging (left) → patterns emerging (right)
|
|
||||||
- Focus on the "aha moment" when patterns become visible
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept B: "The No-Journal Journal"
|
|
||||||
|
|
||||||
**Duration**: 20 seconds
|
|
||||||
**Target**: People who've tried and abandoned journaling apps
|
|
||||||
**Tone**: Relatable, humorous, practical
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-4s] PROBLEM: Text overlay "Journaling is hard" → crossed out
|
|
||||||
[4-8s] SOLUTION: "Feels is easy" → one tap → done animation
|
|
||||||
[8-14s] COMPARISON: Journal app (complex) vs Feels (simple)
|
|
||||||
[14-18s] BENEFIT: Same insights, fraction of effort
|
|
||||||
[18-20s] CTA: "Finally, tracking that sticks"
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Side-by-side comparison (typing vs tapping)
|
|
||||||
- Exaggerated "effort meter" going from high to low
|
|
||||||
- Calendar streak growing effortlessly
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept C: "Your Year in Feelings"
|
|
||||||
|
|
||||||
**Duration**: 15 seconds
|
|
||||||
**Target**: Social media (Instagram Reels, TikTok)
|
|
||||||
**Tone**: Aesthetic, shareable, FOMO-inducing
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-3s] HOOK: Beautiful Year View heatmap filling in
|
|
||||||
[3-8s] ZOOM: Into specific days, showing mood details
|
|
||||||
[8-12s] SHARE: Year-in-review card being generated
|
|
||||||
[12-15s] CTA: "What will YOUR year look like?"
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Satisfying animation of colors appearing
|
|
||||||
- Premium, aesthetic design emphasis
|
|
||||||
- The shareable card as social proof
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept D: "Always There"
|
|
||||||
|
|
||||||
**Duration**: 25 seconds
|
|
||||||
**Target**: Apple ecosystem users
|
|
||||||
**Tone**: Seamless, integrated, premium
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-5s] SCENE 1: Morning - iPhone widget tap while coffee
|
|
||||||
[5-10s] SCENE 2: Midday - Apple Watch glance at work
|
|
||||||
[10-15s] SCENE 3: Evening - Lock Screen Live Activity
|
|
||||||
[15-20s] SCENE 4: Night - Quick note before bed
|
|
||||||
[20-25s] CTA: "Your mood tracker, wherever you are"
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Lifestyle shots (hands, devices in context)
|
|
||||||
- Seamless device transitions
|
|
||||||
- Emphasis on Apple ecosystem integration
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept E: "Make It Yours"
|
|
||||||
|
|
||||||
**Duration**: 20 seconds
|
|
||||||
**Target**: Customization-focused users, Gen Z
|
|
||||||
**Tone**: Expressive, creative, personal
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-5s] RAPID MONTAGE: Different themes flashing by
|
|
||||||
[5-10s] FOCUS: One theme in detail, showing variations
|
|
||||||
[10-15s] ICONS: Different mood icon packs cycling
|
|
||||||
[15-18s] WIDGETS: Custom widgets on home screen
|
|
||||||
[18-20s] CTA: "12 themes. Unlimited you."
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Quick cuts between dramatically different looks
|
|
||||||
- Color explosions during theme transitions
|
|
||||||
- Focus on personality expression
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept F: "Privacy First"
|
|
||||||
|
|
||||||
**Duration**: 15 seconds
|
|
||||||
**Target**: Privacy-conscious users
|
|
||||||
**Tone**: Trustworthy, secure, Apple-aligned
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-3s] TEXT: "Your feelings are personal"
|
|
||||||
[3-8s] VISUAL: Data flowing into iCloud (encrypted visual)
|
|
||||||
[8-12s] HEALTH: Apple Health integration badge
|
|
||||||
[12-15s] CTA: "Private. Secure. Yours."
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Shield/lock iconography
|
|
||||||
- iCloud and HealthKit logos
|
|
||||||
- No server, no tracking messaging
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Concept G: "The Streak Effect"
|
|
||||||
|
|
||||||
**Duration**: 20 seconds
|
|
||||||
**Target**: Gamification lovers, habit builders
|
|
||||||
**Tone**: Motivational, game-like, rewarding
|
|
||||||
|
|
||||||
### Scene Flow
|
|
||||||
|
|
||||||
```
|
|
||||||
[0-5s] HOOK: Streak counter at 0 → building up
|
|
||||||
[5-12s] BUILD: Calendar days filling, streak growing
|
|
||||||
[12-16s] CELEBRATE: Milestone celebration animation
|
|
||||||
[16-20s] CTA: "How long can you go?"
|
|
||||||
```
|
|
||||||
|
|
||||||
### Key Visuals
|
|
||||||
- Streak number incrementing dramatically
|
|
||||||
- Celebration particles/confetti
|
|
||||||
- Progress bar filling satisfaction
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Seasonal Variants
|
|
||||||
|
|
||||||
### New Year (January)
|
|
||||||
**Hook**: "New year, new understanding of yourself"
|
|
||||||
**Visual**: Year View starting fresh, first entry being made
|
|
||||||
**CTA**: "Start your journey January 1st"
|
|
||||||
|
|
||||||
### Mental Health Month (May)
|
|
||||||
**Hook**: "Small check-ins. Big self-awareness."
|
|
||||||
**Visual**: Gentle, soft colors, supportive messaging
|
|
||||||
**CTA**: "Your mental wellness companion"
|
|
||||||
|
|
||||||
### Back to School (August)
|
|
||||||
**Hook**: "Track your journey through the semester"
|
|
||||||
**Visual**: Student-relatable scenarios
|
|
||||||
**CTA**: "The simplest self-care routine"
|
|
||||||
|
|
||||||
### Holiday Season (December)
|
|
||||||
**Hook**: "Reflect on your year. All of it."
|
|
||||||
**Visual**: Year in review, sharing with loved ones
|
|
||||||
**CTA**: "See how far you've come"
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Platform-Specific Cuts
|
|
||||||
|
|
||||||
### App Store Preview (30s max)
|
|
||||||
- Full feature showcase
|
|
||||||
- High production value
|
|
||||||
- Sound on expected
|
|
||||||
|
|
||||||
### Instagram Reels (15-30s)
|
|
||||||
- Vertical format
|
|
||||||
- Hook in first 2 seconds
|
|
||||||
- Text overlays (sound off friendly)
|
|
||||||
- Trending audio compatible
|
|
||||||
|
|
||||||
### TikTok (15-60s)
|
|
||||||
- Casual, authentic feel
|
|
||||||
- Quick cuts
|
|
||||||
- Trend-adaptable structure
|
|
||||||
|
|
||||||
### YouTube Pre-Roll (6s)
|
|
||||||
- Ultra-condensed hook
|
|
||||||
- Single feature focus
|
|
||||||
- Immediate brand recognition
|
|
||||||
|
|
||||||
### Facebook/Meta (15s)
|
|
||||||
- Sound off friendly
|
|
||||||
- Clear text overlays
|
|
||||||
- Emotional appeal
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## A/B Testing Priorities
|
|
||||||
|
|
||||||
### Test 1: Hook Variations
|
|
||||||
- A: "Track your mood in one tap"
|
|
||||||
- B: "Your mood. Your journey. Your way."
|
|
||||||
- C: "The simplest mood tracker"
|
|
||||||
|
|
||||||
### Test 2: Feature Focus
|
|
||||||
- A: Lead with Widgets
|
|
||||||
- B: Lead with Insights
|
|
||||||
- C: Lead with Year View
|
|
||||||
|
|
||||||
### Test 3: Visual Style
|
|
||||||
- A: Lifestyle (hands, real contexts)
|
|
||||||
- B: Product (device mockups)
|
|
||||||
- C: Abstract (colors, animations)
|
|
||||||
|
|
||||||
### Test 4: CTA Messaging
|
|
||||||
- A: "Download now"
|
|
||||||
- B: "Start your journey"
|
|
||||||
- C: "Try free for 30 days"
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Production Checklist
|
|
||||||
|
|
||||||
### Pre-Production
|
|
||||||
- [ ] Script final approval
|
|
||||||
- [ ] Shot list created
|
|
||||||
- [ ] Assets gathered (screenshots, icons)
|
|
||||||
- [ ] Music licensed
|
|
||||||
|
|
||||||
### Production
|
|
||||||
- [ ] Remotion scenes built
|
|
||||||
- [ ] All animations tuned
|
|
||||||
- [ ] Preview reviewed on mobile
|
|
||||||
|
|
||||||
### Post-Production
|
|
||||||
- [ ] Color grading consistent
|
|
||||||
- [ ] Audio levels balanced
|
|
||||||
- [ ] Captions/text readable at small sizes
|
|
||||||
- [ ] Export in all required formats
|
|
||||||
|
|
||||||
### Delivery
|
|
||||||
- [ ] App Store (1080x1920, H.264)
|
|
||||||
- [ ] Instagram (1080x1920, <30s)
|
|
||||||
- [ ] TikTok (1080x1920, with watermark)
|
|
||||||
- [ ] YouTube (1080x1920 or 1920x1080)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
*Last Updated: January 2026*
|
|
||||||
@@ -1,266 +0,0 @@
|
|||||||
# Feels Promo Video Storyboard
|
|
||||||
|
|
||||||
**Version**: V1 - App Store Feature Video
|
|
||||||
**Duration**: ~25 seconds (7 scenes + outro)
|
|
||||||
**Resolution**: 1080x1920 (9:16 Portrait)
|
|
||||||
**FPS**: 30
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Video Concept
|
|
||||||
|
|
||||||
**Tagline**: *Track your mood. Understand yourself.*
|
|
||||||
|
|
||||||
**Target Audience**: People seeking a simple, beautiful way to track their emotional wellbeing without the complexity of journaling apps.
|
|
||||||
|
|
||||||
**Key Differentiators to Highlight**:
|
|
||||||
1. One-tap simplicity (vs. complex journaling)
|
|
||||||
2. Beautiful widgets & Apple Watch integration
|
|
||||||
3. AI-powered insights (Apple Intelligence)
|
|
||||||
4. Deep customization (themes, icons, colors)
|
|
||||||
5. Privacy-first with iCloud sync
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Scene Breakdown
|
|
||||||
|
|
||||||
### Scene 1: Hero (0:00-3:30)
|
|
||||||
**Title**: "Your mood. Your journey. Your way."
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Dark forest green gradient (#1a472a → #2d5a3d) with tiled app icons |
|
|
||||||
| **Animation** | Title springs in from top; phone slides in from right |
|
|
||||||
| **Phone Screen** | Day View showing mood list with colorful entries |
|
|
||||||
| **Layout** | Title top-left, phone large on right (extends off-screen) |
|
|
||||||
| **Emotion** | Empowering, personal, inviting |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen1-day.png` - Day view with several mood entries
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 2: Widget & Watch (3:30-7:00)
|
|
||||||
**Title**: "Tap. Logged. Done."
|
|
||||||
**Subtitle**: "Never miss a day"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Golden yellow gradient (#c4a000 → #d4b400) |
|
|
||||||
| **Animation** | Title springs in; widget scales up; watch scales up with delay |
|
|
||||||
| **Widget** | Large square widget showing mood selection |
|
|
||||||
| **Watch** | Apple Watch with Feels complication |
|
|
||||||
| **Labels** | "One-tap widgets" under widget, "Wrist ready" under watch |
|
|
||||||
| **Emotion** | Quick, effortless, accessible |
|
|
||||||
|
|
||||||
**Screenshots Required**:
|
|
||||||
- `screen2-widget.png` - Large widget with 5 mood options
|
|
||||||
- `screen2-watch.png` - Watch face with Feels complication
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 3: Journal (7:00-10:30)
|
|
||||||
**Title**: "Reflect & Record"
|
|
||||||
**Subtitle**: "Add notes & photos to remember why"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Medium green gradient (#3d7a4a → #4a8f5a) |
|
|
||||||
| **Animation** | Title springs in; phone scales up from center |
|
|
||||||
| **Phone Screen** | Note editor with text and photo attachment |
|
|
||||||
| **Layout** | Title top, phone centered with slight tilt |
|
|
||||||
| **Emotion** | Thoughtful, meaningful, personal |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen3-journal.png` - Note editor with example entry
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 4: Insights (10:30-14:00)
|
|
||||||
**Title**: "Beautiful Insights"
|
|
||||||
**Badge**: "Powered by Apple AI"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Blue gradient (#2563eb → #3b82f6) |
|
|
||||||
| **Animation** | Title springs in centered; phone scales up; AI badge pops in |
|
|
||||||
| **Phone Screen** | Insights view showing month/year analysis |
|
|
||||||
| **Badge** | White pill with sparkle emoji, appears at bottom |
|
|
||||||
| **Emotion** | Intelligent, modern, trustworthy |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen4-insights.png` - Insights view with AI badge visible
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 5: Privacy (14:00-17:30)
|
|
||||||
**Title**: "Private & Secure"
|
|
||||||
**Subtitle**: "Syncs with Apple Health - Locked to you"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Teal green gradient (#059669 → #10b981) |
|
|
||||||
| **Animation** | Title centered; shield emoji scales in; phone slides from right |
|
|
||||||
| **Phone Screen** | Settings or HealthKit integration screen |
|
|
||||||
| **Shield** | Large shield emoji (left side) |
|
|
||||||
| **Emotion** | Safe, trustworthy, Apple ecosystem |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen5-privacy.png` - Privacy/HealthKit settings
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 6: Themes (17:30-21:00)
|
|
||||||
**Title**: "Complete Customization"
|
|
||||||
**Subtitle**: "Your Style"
|
|
||||||
**Detail**: "12 Thoughtful Themes"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Purple gradient (#7c3aed → #8b5cf6) |
|
|
||||||
| **Animation** | Title right-aligned springs in; phone slides from left |
|
|
||||||
| **Phone Screen** | Theme picker showing color palette options |
|
|
||||||
| **Layout** | Title on right, phone on left (extends off-screen) |
|
|
||||||
| **Emotion** | Personal, expressive, premium |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen6-themes.png` - Theme/customization picker
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Scene 7: Notifications (21:00-24:30)
|
|
||||||
**Title**: "Guidance that gets you"
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Cyan gradient (#0891b2 → #06b6d4) |
|
|
||||||
| **Animation** | Title springs in; phone scales up from right |
|
|
||||||
| **Phone Screen** | Lock screen with Feels notification or Live Activity |
|
|
||||||
| **Layout** | Title top-left, phone large on right |
|
|
||||||
| **Emotion** | Supportive, timely, helpful |
|
|
||||||
|
|
||||||
**Screenshot Required**: `screen7-notifications.png` - Notification or Live Activity
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Outro (24:30-27:00)
|
|
||||||
**Text**: "Feels" + "Track your mood. Understand yourself."
|
|
||||||
|
|
||||||
| Element | Details |
|
|
||||||
|---------|---------|
|
|
||||||
| **Background** | Default purple gradient with tiled icons |
|
|
||||||
| **Animation** | App icon scales up with glow; text fades in |
|
|
||||||
| **Glow** | Pulsing white radial glow behind icon |
|
|
||||||
| **Emotion** | Memorable, brand moment, call to action |
|
|
||||||
|
|
||||||
**Asset Required**: `app-icon.png` - App icon (1024x1024)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Required Assets Checklist
|
|
||||||
|
|
||||||
### Static Assets
|
|
||||||
- [ ] `app-icon.png` - App icon (1024x1024)
|
|
||||||
- [ ] `phone.png` - iPhone frame overlay
|
|
||||||
- [ ] `watch-frame.png` - Apple Watch frame overlay
|
|
||||||
|
|
||||||
### Screenshots (capture from app)
|
|
||||||
- [ ] `screen1-day.png` - Day view with mood entries
|
|
||||||
- [ ] `screen2-widget.png` - Large widget mockup
|
|
||||||
- [ ] `screen2-watch.png` - Watch face/complication
|
|
||||||
- [ ] `screen3-journal.png` - Note editor with photo
|
|
||||||
- [ ] `screen4-insights.png` - Insights view
|
|
||||||
- [ ] `screen5-privacy.png` - Privacy/HealthKit settings
|
|
||||||
- [ ] `screen6-themes.png` - Theme customization
|
|
||||||
- [ ] `screen7-notifications.png` - Notification/Live Activity
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Color Palette by Scene
|
|
||||||
|
|
||||||
| Scene | Primary Color | Hex |
|
|
||||||
|-------|--------------|-----|
|
|
||||||
| 1. Hero | Forest Green | #1a472a |
|
|
||||||
| 2. Widget | Golden Yellow | #c4a000 |
|
|
||||||
| 3. Journal | Medium Green | #3d7a4a |
|
|
||||||
| 4. Insights | Royal Blue | #2563eb |
|
|
||||||
| 5. Privacy | Teal | #059669 |
|
|
||||||
| 6. Themes | Purple | #7c3aed |
|
|
||||||
| 7. Notifications | Cyan | #0891b2 |
|
|
||||||
| Outro | Purple | #667eea |
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Animation Timing Reference
|
|
||||||
|
|
||||||
| Animation | Duration | Easing |
|
|
||||||
|-----------|----------|--------|
|
|
||||||
| Title entrance | ~0.5s | Spring (damping: 200) |
|
|
||||||
| Phone entrance | ~0.8s | Spring (damping: 12, stiffness: 80) |
|
|
||||||
| Badge/icon pop | ~0.4s | Spring (damping: 10-15, stiffness: 100) |
|
|
||||||
| Scene transition | 0.6s | Linear fade |
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Future Video Concepts
|
|
||||||
|
|
||||||
### V2: "Year in Pixels" Focus
|
|
||||||
Highlight the Year View heatmap visualization - emphasize seeing a full year of emotions at a glance.
|
|
||||||
|
|
||||||
**Key Scene**: Animated heatmap filling in with colors over time.
|
|
||||||
|
|
||||||
### V3: "Streak Challenge"
|
|
||||||
Gamification angle - show streak building, Live Activity on lock screen, celebrating milestones.
|
|
||||||
|
|
||||||
**Key Scene**: Streak counter incrementing with celebration animations.
|
|
||||||
|
|
||||||
### V4: "Personality Packs"
|
|
||||||
Customization deep-dive - showcase different icon packs, themes, and color combinations.
|
|
||||||
|
|
||||||
**Key Scene**: Rapid montage of different visual styles.
|
|
||||||
|
|
||||||
### V5: "Share Your Year"
|
|
||||||
Social sharing feature - show the shareable year review card being generated and shared.
|
|
||||||
|
|
||||||
**Key Scene**: Year card animation rendering, share sheet appearing.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Technical Notes
|
|
||||||
|
|
||||||
### Remotion Commands
|
|
||||||
```bash
|
|
||||||
# Start preview
|
|
||||||
npm run dev
|
|
||||||
|
|
||||||
# Render video
|
|
||||||
npx remotion render FeelsPromoV1 out/feels-promo-v1.mp4
|
|
||||||
|
|
||||||
# Render specific frame range (for testing)
|
|
||||||
npx remotion render FeelsPromoV1 out/test.mp4 --frames=0-30
|
|
||||||
```
|
|
||||||
|
|
||||||
### Screenshot Capture Tips
|
|
||||||
1. Use iPhone 15 Pro Max simulator for highest quality
|
|
||||||
2. Enable "Show Touch" in simulator for interaction demos
|
|
||||||
3. Capture at 3x scale for maximum resolution
|
|
||||||
4. Remove status bar in post-processing if needed
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Messaging Framework
|
|
||||||
|
|
||||||
### Primary Message
|
|
||||||
"Track your mood in seconds, understand your patterns over time."
|
|
||||||
|
|
||||||
### Supporting Messages
|
|
||||||
1. **Simplicity**: "One tap. That's all it takes."
|
|
||||||
2. **Insight**: "See your emotional journey unfold."
|
|
||||||
3. **Privacy**: "Your feelings, your data, your control."
|
|
||||||
4. **Style**: "Make it yours with 12 beautiful themes."
|
|
||||||
5. **Ecosystem**: "Works seamlessly with Apple Watch and widgets."
|
|
||||||
|
|
||||||
### Emotional Arc
|
|
||||||
1. **Hook** (Scene 1): Personal, empowering
|
|
||||||
2. **Features** (Scenes 2-6): Practical, impressive
|
|
||||||
3. **Trust** (Scene 5-6): Secure, personalized
|
|
||||||
4. **CTA** (Outro): Memorable, action-driving
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
*Last Updated: January 2026*
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { config } from "@remotion/eslint-config-flat";
|
|
||||||
|
|
||||||
export default config;
|
|
||||||
4136
feels-promo/package-lock.json
generated
@@ -1,32 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "template-helloworld",
|
|
||||||
"version": "1.0.0",
|
|
||||||
"description": "My Remotion video",
|
|
||||||
"scripts": {
|
|
||||||
"dev": "remotion studio",
|
|
||||||
"build": "remotion bundle",
|
|
||||||
"upgrade": "remotion upgrade",
|
|
||||||
"lint": "eslint src && tsc"
|
|
||||||
},
|
|
||||||
"repository": {},
|
|
||||||
"license": "UNLICENSED",
|
|
||||||
"dependencies": {
|
|
||||||
"@remotion/cli": "^4.0.0",
|
|
||||||
"@remotion/media": "4.0.409",
|
|
||||||
"@remotion/transitions": "4.0.409",
|
|
||||||
"@remotion/zod-types": "^4.0.0",
|
|
||||||
"react": "19.2.3",
|
|
||||||
"react-dom": "19.2.3",
|
|
||||||
"remotion": "^4.0.0",
|
|
||||||
"zod": "3.22.3"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@remotion/eslint-config-flat": "^4.0.0",
|
|
||||||
"@types/react": "19.2.7",
|
|
||||||
"@types/web": "0.0.166",
|
|
||||||
"eslint": "9.19.0",
|
|
||||||
"prettier": "3.6.0",
|
|
||||||
"typescript": "5.9.3"
|
|
||||||
},
|
|
||||||
"private": true
|
|
||||||
}
|
|
||||||
|
Before Width: | Height: | Size: 806 KiB |
|
Before Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 25 KiB |