Skip to main content
A calm, narrative-driven overview of how users experience Rainy Day, from first visit to weekly habit. Rainy Day is the financial weather system for your life: it keeps you prepared and calm about money the same way a forecast prepares you for the week.
See also: Product Overview for product vision and technical architecture | UI Layout Overview for component structure and wireframes
Rainy Day’s UX is built on two beliefs: “Life can be difficult. Managing your money shouldn’t be.” “Good weeks start with clarity. Rainy Day Forecast shows the conditions ahead.” These beliefs keep the experience focused on emotional safety, clarity, and predictability.

​
1. First-Time User Experience (7 Phases)

The first-time UX is designed to establish trust, reduce anxiety, and ease users into the weekly habit. Forecast, expected charges, and installments work together from day one so users avoid surprise payments.

​
Phase 1 - Warm, calm welcome

Purpose:
Set the emotional tone and help users feel safe, not judged. Screen content:
  • Tagline: “Life can be difficult. Managing your money shouldn’t be.”
  • Short explanation:
    • Rainy Day gives you clarity without stress
    • Securely upload your bank data, privacy and protection are top priorities
    • We help organize transactions
    • You get a gentle weekly checkup and forecast for what is ahead
CTA: Get started

​
Phase 2 - How Rainy Day works

Purpose:
Set expectations before users upload anything. 3 card explanation:
  1. Upload your bank data (CSV or statement)
  2. We organize your transactions (spreadsheet-first clarity, expected charges, and subscriptions identified)
  3. You get a weekly checkup and Rainy Day Forecast (simple outlook for the coming week with buffer guidance)
CTA: Upload your first file

​
Phase 3 - First upload

Purpose:
Introduce the user to the system in a simple, reassuring way. Behavior:
  • User selects a CSV or PDF statement
  • Rainy Day shows subtle progress/loading
  • On success:
    “Your data is ready. Let’s review your transactions.”
CTA: Review transactions The user is taken directly into setup mode before seeing any dashboards.

​
Phase 4 - First-time spreadsheet setup mode

Purpose:
Build trust. Let users teach Rainy Day their preferences. A banner explains:
“Let’s clean up your transactions. Rainy Day will remember what you set here.”
User capabilities:
  • Rename payees
  • Categorize transactions
  • Mark recurring charges
  • Merge duplicates
  • Correct mislabeled entries
  • Add optional notes
All choices create silent rules Rainy Day remembers for future uploads. These rules keep expected charges, installments, and subscriptions accurate in future forecasts.

​
Phase 5 - Transition into dashboard

After finishing setup: Confirmation screen:
“Your transactions are ready.” CTA: View your dashboard User is routed into the Overview page for the selected period (usually This Week). This is their first taste of the calm dashboard experience.

​
Phase 6 - Introducing the weekly checkup

If enough valid data exists for a full prior week: Rainy Day gently suggests: “Your checkup for last week is ready.” The checkup reviews the past week’s behavior and closes with the Rainy Day Forecast: a forward-looking outlook for the upcoming week based on expected charges, subscriptions, and detected installments. The forecast labels the upcoming week as Clear, Cloudy, or Storm and recommends a buffer when balances look tight. User can choose:
  • View Weekly Checkup, or
  • Continue exploring the Overview
This is optional to avoid overwhelming new users.

​
Phase 7 - The long-term weekly habit loop

This is where Rainy Day becomes part of the user’s financial rhythm and daily sense of weather.

​
Core principles

  • Users can upload CSVs anytime
  • The viewing period stays fixed (“This Week: Nov 10-16”)
  • New uploads recalculate insights and the next forecast
  • The Weekly Checkup updates gently, never abruptly
  • The top bar shows:
    Updated: Nov 14, 2:11 PM

​
Weekly checkup states

  • No data:
    “Your weekly checkup will appear here once you upload some transactions.”
  • In-progress week:
    “Here is your 5-minute checkup for Nov 10-16 so far.”
  • Completed week:
    “Here is your 5-minute checkup for Nov 3-9.”
    • Completed checkups always end with the Rainy Day Forecast card for the next week.

​
Forecast states

  • Clear Week: Light expected activity, keep your usual rhythm.
  • Cloudy Week: A few larger or recurring charges are lining up, keep a small buffer ready.
  • Storm Week: Dense bills or installments are coming, move money early and add a stronger buffer.

​
Habit loop

  1. User uploads new CSV
  2. Rainy Day merges and dedupes
  3. Overview updates
  4. Weekly Checkup updates with a new forecast
  5. User returns next week
  6. Over time -> clarity, calmness, awareness

​
2. Global Behavioral Rules

These rules apply across the entire product.

​
Period selector

  • Includes: This week, Last week, This month, Custom
  • Changing the period updates all pages:
    • Overview
    • Transactions
    • Weekly Checkup
    • Timeline
The period is the user’s anchor.

​
Upload behavior

  • Users can upload anytime during the week
  • Rainy Day automatically:
    • Deduplicates
    • Merges
    • Cleans data
    • Applies learned rules
  • Weekly Checkup and Overview update silently in the background
Success toast example:
“4 new transactions added for Nov 10-14.”

​
Data integrity and learning

Rainy Day gradually learns:
  • payee names
  • categories
  • recurring patterns
  • user edits
  • merchant types
This supports a smoother experience each week and keeps forecasts accurate.

​
Forecast inputs and outputs

Rainy Day Forecast combines several signals to reduce surprise payments:
  • Expected charges from subscriptions, bills, and recurring payees
  • Installments module that detects BNPL and other payment plans, tracks remaining payments, and shows their impact on the upcoming week
  • Recent spending patterns that influence which weeks look Clear, Cloudy, or Storm
  • Buffer recommendations to prevent checkout stress and low-balance moments

​
3. Empty States

​
Overview

“Upload your first CSV to see your dashboard.” Not sure how to get your CSV? Most banks have different methods. Tap here for help with your specific bank. We will guide you step by step, no technical experience needed.

​
Transactions

“Your transactions will appear here after your first upload.”

​
Weekly checkup

“Your weekly checkup will appear here once you upload some transactions.”

​
Money movement timeline

“No data for this period yet.”

​
4. Tone and Copywriting Principles

Rainy Day’s voice follows these rules:
  • Calm
  • Human
  • Short and clear
  • No financial jargon
  • No judgment
  • Beginner-friendly
  • Encouraging, never urgent
Examples:
  • “Here is your checkup for this week so far.”
  • “You spent a little more this week, mostly from one-time purchases.”
  • “Your spending has been consistent. Great job staying aware.”

​
5. Motion and Interaction Philosophy

Rainy Day uses Motion subtly:
  • fade-ins
  • soft slides
  • staggered card animations
  • no bouncy transitions
  • no aggressive movements
  • everything feels intentional and calming
The product should feel premium, quiet, and reassuring.

​
6. Summary

The Weekly Checkup provides a narrative, data-driven recap of your week and ends with a Rainy Day Forecast: a gentle, actionable outlook that labels the next week as Clear, Cloudy, or Storm and suggests a buffer when needed. The UX of Rainy Day is:
  • spreadsheet-first (easiest model to understand)
  • insight-driven
  • habit-reinforcing
  • calm and human
  • built for weekly clarity rather than budgeting pressure
  • anchored in the idea that managing money should feel as simple as checking the weather
This ux-flows.md document defines the emotional and functional flow of the experience, while the UI Layout doc defines the structural components and visual placement. Together with the Product Overview, they form a complete map of Rainy Day’s user experience.