PomoGoose

PomoGoose
PomoGoose Shop - Goose Skins

🐤 Inspiration 🕒

As students, it's difficult for us to get into the flow state when studying, working, or anything in-between. In other times, we've been too focused/locked into the flow state and forget to take breaks. It's important to maintain a good balance between working and taking breaks. Why not make an extension that helps us do both?

🍅 What Does PomoGoose Do? 🍅

PomoGoose focuses on 3 main things: 1) A Pomodoro technique based timer 2) A goose that covers your screen when you break so that you ACTUALLY take a break 3) A currency/shop system that rewards users for properly doing Pomodoro by allowing them to exchange coins for cute skins :)

🔧 How We Built It 🎨

We built a Chrome extension in Typescript with native HTML/CSS. Most of this project makes heavy use of the Chrome Extension API's. As for design, the shop layout was designed in Figma as a low and high fidelity prototype.

👀 Challenges We Ran Into 👀

Originally, we wanted our goose to eat the cursor and disable the user from using their cursor. Unfortunately, due to security concerns (boring!), Chrome doesn't allow extensions to have that level of control over the user's activity.

🎈 What We Learned🎈

This was the first time we worked with chrome developer tools to create an extension so there was a big learning curve with trying to figure out how to implement what we needed. This was also the first time that anyone on our team had worked with creating wireframes in practice. Going into the project, we didn't know how to take advantage of components, instances, and variants on Figma. We were able to learn about those tools which they made up a large part of our prototypes.