This project began as a vibe coding experiment to create a Pomodoro timer that felt unique—mixing bold visuals and unusual type with a simple, functional experience.
The interface was designed in Figma and later built with HTML and CSS, exploring the expressive side of front-end design without relying on complex frameworks. Rather than following typical productivity-app aesthetics, I experimented with distorted type, bold color, and ’70s-inspired shapes.
Once the design was complete, I created a basic functional prototype using AI to test timing and interaction logic. Then, I worked on the HTML and CSS, ensuring the visual design matched the original concept closely.
During development, I noticed a visual inconsistency — the timer digits shifted each second due to uneven font widths. I fixed it in FontForge by adjusting each number’s width, keeping the countdown perfectly stable.
AI made it possible to design, build, and test this project from start to finish in just a few days. It proved how powerful these tools can be for creating and iterating products quickly—turning ideas into functional prototypes in a fraction of the usual time.
