I Built a "Slow Productivity" OS with Google Gemini (Because I Keep Forgetting Things)

This is a submission for the Built with Google Gemini: Writing Challenge

What I Built with Google Gemini

Let me tell you a story about how I built TaskStack. If you have ever felt like you are drowning in a sea of to-do lists, open tabs, and forgotten habits, you are not alone. I decided to build TaskStack, a "Slow Productivity OS", to fix my own chaotic workflow.

TaskStack is not just another aggressively demanding to-do app that makes you feel bad for missing a deadline. It focuses on skill mastery, energy mapping, and deep work rather than just checking off meaningless boxes.

The Core Features:

• The Dashboard & Habit Tracker: Your daily command center. A place to track what actually matters.
• Pomodoro Timer: Because sometimes you need a ticking clock to stop you from scrolling social media.
• Link Cards: A sane way to organize all those articles you swear you will read "later".
• The Creative Toolkit: This is where the magic happens. It includes a Distraction Journal to dump random thoughts, a Weekly Review to reflect on your progress, a Standup Log, and a Code Snippets manager.
• Energy Mapper: Because you are a human, not a machine. This feature syncs your energy levels so you know when you are in your "Peak Performance" hours and when you should probably just take a nap.
• Slow Productivity Rules Engine: A real-time tracker for practicing productivity philosophies.
• AI-Driven Roadmaps & Mastery Tracks: We moved away from simple habits to actual skill mastery. The app groups challenges by your professional role (like Angular Developer or Business Analyst).
• Proactive AI Workspace Previews: A generative UI card that shows you a draft of AI-generated workspaces before committing to them. It politely asks for consent before changing your workspace.
• PIN-Based Authentication: A lightweight 6-digit PIN system because remembering complex passwords is the opposite of slow productivity. Multi-user support on a shared instance is built right in.
• Multi-Role Grouping: Work on multiple career roadmaps at the same time without losing your mind.

The Role of Google Gemini:
And the best part? I didn't write every single line of code by myself while crying into a keyboard. I used Google Gemini as my incredibly patient AI pair programmer to build this entire project from a blank folder to a live URL on Vercel. We used it to scaffold the Next.js application, build generative UI prototypes, generate AI-driven mastery roadmaps, and even configure our Vercel deployments.

Demo

Check out the live application here: TaskStack

Here are some glimpses of the application in action:

**Landing Page

TaskStack Dashboard View

Get started with your prompt: Setup my workspace for an AI vibe coder

Setting Up Your Workspace

When you log in for the first time, you can prompt the AI to set up a personalized workspace. Here are some examples of what you can ask the AI:

- "I'm a junior frontend developer working on a SaaS project. Set up my workspace."
- "Set up a workspace for me as an indie hacker building my first product."
- "I'm a senior backend engineer. I want challenges related to system design and scalability."

The AI will generate a tailored set of tasks, learning resources, and setup a complete workspace draft for you to review!

Creative Toolkit and Energy Mapper

If the user selects low energy, the app will guide them through breathing exercises to help them relax.

AI-Driven Roadmaps & Workspace Previews

What I Learned

Building a full-stack application from scratch sounds intimidating. But with Google Gemini, it felt like having a senior engineer sitting next to me, minus the sighs of disappointment.

Deploying was another learning curve. I learned how to set up environment variable guards to make sure database access via Upstash Redis was secure, and how to seamlessly push to Vercel for pure, unadulterated deployment bliss.

Google Gemini Feedback

What worked well:
Starting with a blank slate was a breeze. I asked Gemini to help scaffold a Next.js application and set up the core design system, and within minutes, we had the basic structure. When I needed complex components like a Distraction Journal and an Energy Mapper, Gemini provided the React components, styling with Tailwind, and logic to sync everything up flawlessly. When we hit a bug where the UI states were out of sync, Gemini patiently debugged the state management.

Where I ran into friction:
There was some friction when dealing with complex state synchronization between the AI chat components and the main application dashboard. Occasionally, the generative UI states would get out of sync, requiring a few rounds of prompt refinement and explicit state management instructions to Gemini to get it right. But overall, the experience was incredibly smooth and way faster than writing it all from scratch.