Pet Todo List

The dead cat state
The fed and happy cate state
The hungry cat state

Inspiration

We wanted to create a simple yet emotionally engaging task tracker that motivates users through a virtual pet. Inspired by Tamagotchi and the Pomodoro technique, PETodo adds a touch of cuteness and consequence: if you leave tasks overdue, your cat gets sad—or even dies. Complete tasks, and it stays happy and well-fed.

What it does

PETodo is a to-do list with a twist:

Add, edit, and delete tasks with due dates.
Your pet cat changes its mood based on your productivity:
- No tasks = happy cat
- Pending tasks = hungry cat
- Overdue tasks = dead cat
Visual and textual feedback helps users stay motivated.

How we built it

React for the frontend logic and UI components.
useState and useEffect hooks to manage task data and update the cat's status in real-time.
Custom assets (love.png, fish.png, died.png) to visually reflect the pet's condition.
Lightweight CSS animations and absolute positioning for status messages.

Challenges we ran into

Designing the cat's emotion logic to be reactive yet non-intrusive. Managing timing for temporary happy states. Handling date comparisons and formatting in a way that works across browsers. Making sure the UI stays clean even with multiple editing tasks.

Accomplishments that we're proud of

Created a working emotional-feedback system with just a few lines of logic. Built a compact and visually engaging widget from scratch. Provided positive reinforcement (e.g., "You feed the cat") while keeping playful consequences.

What we learned

How to use React hooks to build responsive, interactive UIs. How small visual changes can strongly affect user experience. The importance of feedback in keeping users engaged. How to handle editing logic cleanly with multiple states.

What's next for Pet Todo List

Add support for multiple pets with different personalities. Introduce sound effects and animations. Persist tasks with localStorage or backend support. Add habit streaks and rewards to deepen gamification. Make it mobile-responsive and turn it into a browser extension.