Create a demo prototype for "MoneyMinded" - a behavioral finance app that helps users understand their spending triggers and improve their financial fitness.
Important: This is a demo prototype only. No authentication, no onboarding flows, no sign-up required. Users should land on the page and try the app immediately with pre-loaded dummy data.
Structure: Two Pages
Page 1 - Landing Page
- Hero section with headline: "Fiscally Fit" and subheadline: "The behavioral finance app that treats your spending like Noom treats eating - daily check-ins, AI-powered trigger detection, and human accountability."
- Financial Fitness Score preview showing a sample score of 72/100 with a circular progress indicator
- Three key features: "Know Your Triggers" (AI surfaces spending patterns), "Daily Check-ins" (quick mood + spending logs), "Accountability Buddy" (get matched with a peer or coach)
- CTA button: "See Your Dashboard"
Page 2 - App Dashboard
- Financial Fitness Score prominently displayed (72/100) with trend arrow showing +4 from last week
- "Your Spending Triggers" card showing AI-detected patterns:
- "Weekend stress spending: You spend 40% more on Saturdays after high-stress work weeks"
- "Late-night Amazon: 68% of your impulse purchases happen after 10pm"
- "Coffee shop creep: Your daily coffee habit has increased 25% this month"
- "Today's Check-in" card with mood selector (😊 😐 😟 😤) and quick spend log
- "Recent Activity" feed showing transactions with trigger flags (e.g., "🚨 Potential stress purchase" on a $85 DoorDash order)
- "Your Accountability Buddy" card showing matched buddy "Sarah M." with next check-in scheduled
- Weekly spending chart comparing this week vs last week vs budget
Design Specs
- Colors: Deep green (
#1B4332) as primary, mint (#95D5B2) as accent, white background
- Clean, calming aesthetic - think Calm app meets modern fintech
- Rounded corners, soft shadows, plenty of white space
- Font: Inter or similar clean sans-serif