Sushidoro Timer

A Gamified Sushi-themed Pomodoro Timer

Timeline

Role

Team

Skills

June - July 2025

June - July

2025

Designer

Solo

React, Tailwind CSS, Electron, Figma

Overview

I programmed a gamified Pomodor Timer with shop mechanisms, coin logic, and session tracking using React, Tailwind CSS, Electron, and Figma.

Design

  • Built all user interfaces and interactive prototypes in Figma

  • Illustrated and animated custom pixel-art graphics on Procreate

Programming

  • Coded a cross-platform desktop application using React, Tailwind CSS, and Electron through VS Code

  • Implemented state management including coin-earning logic, session tracking, and a dynamic shop system

Problem

Traditional Pomodoro timers lack the long-term incentives needed to maintain user consistency

Design

On Figma, I designed a cohesive visual layout, prioritizing a simple user flow

View the Figma here

Figma layout containing all user interface designs

All graphics and animations incorporated in the final product

Programming

I chose to use Electron because productivity tools are often more effective when they are outside of the browser

Using Electron allowed me to create a desktop experience from usual web-based interactions, making sure that this productivity tool felt integrated into a user's daily workspace.

Takeaways

Was a fun front-end project to both code and design as someone who loves productivity tools :)

I gained a lot of experience in translating Figma designs and animations into React components. Building the shop logic allowed me to prioritize user engagement, using rewarding micro-interactions to boost productivity and motivation for the users.

I gained a lot of experience in translating Figma designs and animations into React components. Building the shop logic allowed me to prioritize user engagement, using rewards to boost productivity and motivation for the users.