Inspiration

A few days ago, I got a text from my sister saying that she just finished her degree and that her watching me study inspired her to go back to school. I had no idea how much of a role I played. I was having a pretty bad week at school but that one message completely shifted my week.

It made me realize that the thing that pulled me out of a dark place was a small moment of connection, and that got me thinking: there are tons of mental health tools for students, but they all ask you to sit on your phone and "work" on your mental health. Meditate. Journal. Talk to a chatbot. But when you're struggling, you don't open an app and journal, you need a nudge to do something - ideally something that gets you off your phone and into the real world.

What it does

Whims gives every student on campus the same daily "whim", one small thing to do. Today it might be "give a friend some flowers." Tomorrow it might be "text someone you haven't talked to in two weeks." Half the whims are inward (for you) and half are outward (for someone else).

When you open the app, you see the day's whim and how many others are doing it right now. You tap join, go do it, and come back to log a quick reflection. It can just be an emoji (or draw how you feel), and an optional note/photo. Over time, your whim history shows you what actually makes you feel good based on your actions. The app never asks how you're feeling, it just gives you something worth doing with hundreds of people doing it alongside you.

How I built it

Designed the main screens in Figma with a few illustration components. It's a "whimsical" character that changes based on each day's whim. Built the frontend in Next.js with TypeScript, Tailwind CSS, and Framer Motion for animations. Used Cursor with Composer 2 as the primary development tool, feeding it Figma screenshots and prompts to translate designs into code. Deployed on Vercel. The app uses localStorage for reflection data persistence, a deterministic date-based algorithm so every user gets the same whim on the same day, and (for now) a simulated live count that fluctuates to create a sense of ambient community. Shadcn/ui's Drawer component powers the reflection bottom sheet. Added as a PWA to the home screen so it runs full-screen without the browser UI.

Challenges I ran into

Getting the visual feel right was the biggest challenge. The "Sweeeeeeeeet" scroll animation needed precise timing to feel playful without being annoying. The curved green hill behind the character illustration took multiple iterations with clip-path to feel right. Mobile Safari's dynamic viewport height caused layout issues, the browser UI would appear on some pages and not others, squishing the content.

Accomplishments that I'm proud of

I personally think the app genuinely doesn't feel like a mental health tool, and that's by design! If someone sees your phone, they should think "cute app," and not "online therapy." There's also an ethical data model since the app stores almost nothing, just which anonymous whims you completed, and your reflection. No identity, location, friends, contacts, mood tracking. Also getting the live demo to run on my actual phone from a Vercel URL with a home screen icon, which feels really nice.

What I learned

The difference between a wellness app people open once and one they actually want to use comes down to tone and whether it respects their time. I also learned that behavioral activation (the psychology behind Whims) is one of the most evidence-backed interventions for depression, and that prosocial behavior (doing things for others) consistently outperforms self-focused strategies for reducing anxiety, depression, and loneliness. The research validated the core design decision to make half the whims outward-facing.

On the technical side, Cursor with Composer 2 is remarkably effective for solo hackathon development and the workflow of pasting Figma screenshots and describing what's wrong let me iterate on visual polish much faster than any other methods.

What's next for Whims

Campus pilot, partnering with a university counseling center to deploy Whims to a real student body and measure impact. A campus-wide anonymous "mood weather map" that shows aggregate wellbeing trends without exposing individuals. A warm handoff feature: if someone's whim completion drops off or has low ratings for an extended period of time, the app surfaces local counseling resources. Seasonal and context-aware whims (finals week whims, move-in week whims, winter break whims). A feature I'd be most excited about is "ripple tracking" which could show you how many people started their whim after you completed yours, so you can see your impact (without needing to know who they are).

Built With

  • figma
  • framer
  • next.js
  • react
  • tailwind
Share this project:

Updates