Designing TodayTasker from Scratch
A UX Designer’s adventure in solving workflow chaos
The Challenge
Working remotely for the past three-ish years has taught me one thing: you need a solid workflow to stay on top of things. With no boss hovering over your shoulder to keep you in check, it’s all on you to stay on top of things. Plus, let’s be honest—nothing feels worse than an unproductive day, missing a task you swore to Kevin you’d finish by EOD, or getting derailed by a random Slack message that throws your whole plan into disarray.
I’ve tried tons of methods to tame my workflow, from digital tools to good ol’ pen and paper, with mixed results. Some worked okay, but I always felt like the tools could be better, simpler, more tailored to how I think.
So, I thought, why not design my own app?
For starters, I've been wanting to flex my UX design muscles on a solo project for a while now, and I was super curious about this “vibe coding” thing with AI, could it help me build something awesome faster? Spoiler: it did.
Digging into User Needs
I'd be a terrible UX designer if I didn't do a little bit of user research. So I started talking to people; family, friends, coworkers. I wanted to hear about how people organised their daily tasks to see if i could learn from them. People have so many different ways of tracking their tasks, and it was so interesting to hear the different methods that people swear by. Some people swear by a physical notepad, crossing off tasks line by line. My coworker Dan, who runs an IT business, has this quirky system: he writes tasks on sticky notes, sticks them on his desk, and they “haunt” him until he crushes them into the bin. Others leaned on their work’s tech stack, like Jira, or blocked out their day in Google Calendar.
My brother Ben’s system stood out. He uses a Trello Kanban board with three lists: Upcoming, Today, and Done. Every morning, he picks tasks from Upcoming, moves them to Today, and that’s his day sorted. New tasks? They go straight to Upcoming, no stress. It’s simple but genius—his day doesn’t get hijacked by every new request. I tried a similar setup in Notion, and wow, moving tasks to Done was so satisfying. Plus, ignoring Slack pings until tomorrow? Honestly life-changing. I could even look back at my Done list to feel good about my week.
But Notion wasn’t perfect. The workflow felt clunky, and I was already buzzing with ideas to make it smoother and more tailored. That’s when I knew I had to build my own app.
Design and Ideation
To kick things off, I used affinity diagramming. Affinity diagramming is a great tool and a super efficient way to dump ideas and sort them out. I scribbled down every feature I could think of for the app, from task lists to notifications. Then, I grouped them into clusters, prioritised the ones that mattered most, and now I had a clear list of goals to guide my prototyping.
Designing the App
Next, I jumped into designing. I started with low-fidelity wireframes in Figma using just rectangles and text to nail down the app’s structure fast. This kept me focused on function, not getting lost in pretty colours or fonts. I mapped out a Kanban-style board inspired by Ben’s Trello setup: Upcoming, Today, and Done, with drag-and-drop tasks. Once I was happy with the bones, I moved to higher-fidelity prototypes, still keeping it grayscale to stay practical. These were close enough to what I’d eventually build but didn’t distract me with aesthetics yet.
After coding the core functionality (more on that in a sec), I went back to Figma for the final polish. I added colours, tweaked typography, and made sure the UI felt clean and intuitive. The goal? A beautiful, distraction-free app that just worked.
What on earth is vibe coding?
You may or may not have heard of this new thing called ‘Vibe Coding’. Basically it means using the latest AI models to do the ‘heavy lifting’ of code while you play the role of the ideas guy. It’s controversial; some devs worry it leads to buggy code if you don’t know what you’re doing. As a UX designer who knows a bit of web dev, I could’ve built this app the old-school way, but vibe coding promised to speed things up big time. And, as AI researcher Simon Willison puts it, if you review and test every line of AI-generated code, it’s not just vibe coding—it’s using AI as a “typing assistant.”
"If an LLM wrote every line of your code, but you've reviewed, tested, and understood it all, that's not vibe coding in my book—that's using an LLM as a typing assistant."
Simon Willison
AI researcher
I set up my project with Next.js and Vercel for the front end, and Supabase for authentication and database. Then, I hooked my code editor (Zed) to Claude 3.7 and started vibe coding. Far out, it was a game-changer. Turning ideas into working code was so much faster. I could experiment with different solutions, tweak the structure, and modularise my code without breaking a sweat. Sure, I double-checked everything to make sure I understood it and that it worked, but reviewing code is way quicker than writing it from scratch.
It also taught me a ton. I knew nothing about backends or Postgres databases before this, but now I’ve got a working app that lets you sign in with Google. The productivity boost from vibe coding blew my mind, and despite the haters, I’m convinced it’s the future of development.
Bringing It All Together
So, what did I end up with? an app called TodayTasker, and it’s everything I wanted: a simple, Kanban-style tool that lets me prioritise my day, defer new tasks, and track what I’ve done. I've still got a bit of work to do in getting it just right but testing it myself, I found my days were way less chaotic. I even shared it with a few friends, who loved how intuitive it was. I’m already itching to iterate, maybe adding features like time-blocking or mobile push notifications. For now, TodayTasker is my proof that you don't need a giant tech company to meet user needs, and sometimes a simple idea works because it's simple.
