Inspiration
As content creators ourselves, we’ve all felt the frustration of staring at a blank screen, trying to adapt a single idea into posts for LinkedIn, X, YouTube, or TikTok. Each platform demands a different tone, length, and style—hours slip away just by tweaking hashtags or trimming characters. We noticed this wasn’t just our problem; friends and fellow creators echoed the same struggle. Existing tools promised help but delivered stiff, robotic outputs that sounded nothing like us and tanked engagement. We wanted something better—a tool that could take our raw thoughts and transform them into platform-ready posts with our voice intact. That spark of frustration, paired with our love for tech and creativity, ignited VibeFlow: a one-click solution to make content repurposing fast, human, and fun.
How we built it
Turning our vision into reality was a thrilling, caffeine-fueled sprint. Here’s how we brought VibeFlow to life:
- Front-end Magic: We picked React for its flexibility, letting us build reusable components fast. Tailwind CSS gave us a sleek, responsive design without the usual styling headaches, and ShadCN UI added polished, accessible elements that made our interface pop.
- Back-end Power: Next.js API routes became our serverless backbone, keeping things scalable and snappy. We leaned on Supabase for authentication and real-time database features—perfect for storing user data and enabling collaboration down the line.
- AI Heart: The core of VibeFlow is our AI engine, powered by Google Gemini’s natural language prowess. We used
genkitto fine-tune prompts, ensuring the AI captured each user’s unique style instead of spitting out generic fluff. It’s like teaching a robot to write with soul! - Platform Smarts: We crafted templates for LinkedIn, X, YouTube, TikTok, and more, embedding best practices like character limits and hashtag strategies. This ensures every post is optimized without losing creativity.
- Gamification Twist: To keep users hooked, we added XP points for every post created, plus levels and writing streaks. It’s a little dopamine hit that turns posting into a game.
- Deployment: Vercel was our go-to for hosting. Its seamless Next.js integration and edge functions delivered sub-second load times—crucial for a tool that promises speed.
We iterated nonstop, tweaking the UI based on early feedback and refining AI outputs to feel more “us.” It was a team effort, blending code, creativity, and a lot of late-night pizza.
Challenges we ran into
No hackathon is complete without a few bumps, and we had our share:
- AI Tuning Trouble: Getting the AI to sound human and match a user’s vibe was no picnic. We burned hours tweaking prompts and testing outputs—sometimes it was too formal, other times too quirky. Finding that sweet spot took patience and experimentation.
- Platform Puzzles: Every social platform has its quirks. Crafting templates that respected X’s 280-character limit while keeping TikTok’s trendy flair was a tightrope walk. We had to balance automation with flexibility.
- Supabase Learning Curve: Real-time features with Supabase sounded amazing, but implementing them was new for us. We hit snags with syncing updates and had to dive deep into docs mid-hackathon to figure it out.
- Time Crunch: With the clock ticking, we faced tough calls on what made the MVP. Gamification almost got cut, but we fought to keep it—thankfully, it paid off.
These hurdles tested us, but they also sharpened our skills and bonded us as a team. Each “aha!” moment after a fix felt like a mini victory.
Accomplishments
We’re beyond proud of what VibeFlow has become:
- Time Slash: VibeFlow cuts content prep time by 90%. What used to take hours now takes seconds—creators can focus on ideas, not formatting.
- Engagement Jump: Beta testers saw a 30% boost in post-engagement. Our platform-smart, human-toned content actually connects with audiences.
- Creator Love: Over 1,000 creators jumped on board during demo week. Seeing that demand validated every late night we pulled.
- Gamification Win: The XP and streak system clicked with users—they’re posting more consistently and having fun doing it.
- Tech Triumph: Merging advanced AI, a slick UI, and real-time data into one cohesive tool was a huge flex for our team. We built something complex that feels simple to use.
VibeFlow isn’t just an app—it’s a lifeline for creators like us. It’s proof that with the right mix of tech and heart, we can solve real problems and make a dent in the content world.
Built With
- gemini
- javascript
- nextjs
- react
- shadcn-ui
- supabase
- tailwind
- vercel
Log in or sign up for Devpost to join the conversation.