MoodPocket

• 

  MoodPocket Landing

Inspiration

MoodPocket Mood Boards are a great way to express creativity — but most moodboard apps feel static or focused on professional portfolios.
I wanted to create something fun, playful, and AI-powered, where the focus is on expressing moods, earning XP, and engaging with a creative community.

I was also inspired by the challenge of building an app that could balance AI costs with a sustainable SaaS model — turning an MVP into something launchable.

MoodPocket was built to be a place where anyone can express moods visually — and where AI is not just a backend tool, but a core part of the experience.

What it does

MoodPocket is an AI-powered moodboard app:

🎨 Generate AI Tiles with DALL·E 3
🖼️ Build Moodboards with AI Tiles + images + text
✨ Explore a playful Feed of Moodboards & Tiles
🏆 Earn XP for creative actions → level up and unlock badges
🚀 Compete in Mood Challenges → weekly themed creative prompts
📈 Track your progress → Leaderboard, Achievements, XP
💎 Upgrade to Pro/Creator tiers → unlock unlimited AI Tile generations and special features

How we built it

Built with:

JavaScript, TypeScript, Next.js, React, TailwindCSS, Radix UI, Framer Motion, OpenAI DALL·E 3, Stripe, Cloudflare KV, Postgres (planned expansion), Cloudflare Pages, Cloudflare Workers, NextAuth.js, Sentry, Bolt.new

Architecture highlights:

• Frontend: Next.js App Router + Radix UI + Framer Motion
  
• Storage: Cloudflare KV for Moodboards, AI Tiles, XP system
  
• AI: DALL·E 3 integration with caching and rate limiting
  
• Auth: NextAuth.js with JWT
  
• Payments: Stripe SaaS flow (Pro / Creator tiers)
  
• Deployment: Cloudflare Pages + Workers
  
• Built using structured Bolt.new prompts with Global + Project Rules
  

Challenges we ran into

• Designing a Feed that feels playful and expressive rather than just a static grid
  
• Balancing AI API costs → rate limiting + subscription model + caching
  
• Implementing a gamification system that feels motivating but not spammy
  
• Ensuring a delightful mobile-first UX → critical for mood apps
  
• Building full account management UX → Forgot Password, Change Password, Manage Subscription
  
• Getting Bolt.new outputs to perfectly match our custom brand tone → solved with strong Rule-based prompting
  

Accomplishments that we're proud of

• Built a full AI-powered Moodboard platform → ready for launch
  
• Designed a beautiful, responsive Feed UX that highlights AI Tiles
  
• Implemented a polished XP system + Leaderboard
  
• Completed Stripe SaaS integration → Pro / Creator ready
  
• Built Mood Challenges system to drive engagement
  
• Successfully used Bolt.new to build 80% of the platform through staged, structured prompts
  
• Created a product that feels fun, sticky, and community-driven — not just another AI demo
  

What we learned

• Bolt.new can build production-grade apps — but requires strong Rules + staged prompting
  
• AI-first apps need careful UX tuning → users must understand and value AI-generated content
  
• Gamification works best when combined with good UX, community features, and clear feedback
  
• "Less is more" → a playful, polished core experience is more powerful than feature overload
  
• Bolt agents respond better when given clear, incremental prompts with quality checks after each step
  

• Using discussion mode was a gem that I had been sleeping on!

  What's next for MoodPocket

• Launch Stripe SaaS subscription tiers → start driving revenue

• Launch Public AI Tile Galleries → virality driver

• Launch Follow Moodboards → notification and retention loop

• Add Remix AI Tile / Moodboard → viral creative loop

• Scale Mood Challenges → with badges, Feed promotion

• Implement Featured Creators → drive community growth

• Add Advanced Notifications + Activity Feed

• Integrate pgvector + vector search for AI Tile discovery

• Grow MoodPocket from MVP to fully operational AI-powered creative SaaS platform 🚀

Built With

• bolt.new
• cloudflare-kv
• cloudflare-pages
• cloudflare-workers
• framer-motion
• javascript
• next.js
• nextauth.js
• openai-dall?e-3
• postgres-(planned-expansion)
• radix-ui
• react
• sentry
• stripe
• tailwindcss
• typescript