Slacker

Max Upgrades
Memory mini-game
Dumpster Diving mini-game

Inspiration

We wanted to make a fun way to be productive, but our idea leaned more into its game aspect as we planned it. Our hero, a flower, wakes up to find their friends in a trance and non-responsive. By visiting productive websites, the hero is safe from the trance as they focus on self-improvement and competence, and therefore level up and become stronger. From here, we knew our antagonist had to be the epitome of laziness: the sloth. We wanted our story to show that by being self-motivated, you can overcome the sloth. The grand finale reveals that this scary boss is only as powerful as you let it be.

What it does

Slacker is a Chrome extension that makes being productive online fun. Gain XP while visiting sites on your customizable “goals” list. Level up your character and unlock five new mini-games. Uncover a unique story and break the curse infecting the land. Keep track of your journey in a journal and enjoy hand-drawn artwork and animations along the way.

How we built it

This extension was built using JavaScript, HTML, css and artwork designed in Procreate.

The coding was split among 3 team members, each generally focusing on their own mini-games that they were tasked with. The artwork and animations behind the game were hand-drawn using Procreate entirely by the other teammate. Despite the individual mini-games being made separately, they were tied together by their shared art style, final overarching UI edits, and a storyline that ensured that each piece complemented the next.

Challenges we ran into

GitHub: Our group, prior to the hackathon, did not have lots of experience using version control with GitHub, with multiple people working on the same project at the same time. This led to some very hands-on learning on the spot in order to feel comfortable merging changes, reviewing code additions, and more.

First Hackathon: For all four members of our team, this was the first Hackathon any of us had ever attended. This made everything a new experience and took some time adjusting. This was also somewhat of a benefit, as it was exciting and motivating to do as much as we could.

Original Art: All of the art in this game is hand-drawn with no artificial generative tools. Given the time crunch and the great demand for images needed, it was a great struggle to get everyone the art that they needed as soon as they needed it.

Accomplishments that we're proud of

Our ability to work as a team was a big accomplishment. We brainstormed, planned, and built as a team. Everyone had an equally big part in each step. Each team member was hardworking. Not only that, but we could all learn something from one another. When one person was stuck, someone else would help them, and when the other person was stuck, they’d get help in turn, and so on.

Our creativity was something to be proud of, as well. Not only did we come up with a unique concept and story, but we kept it fun. We worked on a project that we enjoyed, which made it all the more exciting to put it together.

What we learned

We learned how to better collaborate on a project with other people. Not only like we mentioned above with the technical side, such as GitHub, but also just how to manage multiple people working on an idea, and everyone having a slightly different idea about how it should turn out.

What's next for Slacker

Overall, we feel very proud of how polished Slacker feels in the short amount of time we had. However, there is certainly lots of room for improvement.

As of now, the hero can be upgraded five times and fights the sloth as the final boss. Once a user is productive enough to reach that level, there is no more material for them to discover. One clear path moving forward is to add more levels, mini-games, and a new story (if Sloth was the first boss, then another one of the seven deadly sins could be next).

Another way to improve Slacker would be to enhance its productivity element. There could be pop-ups that dissuade the user from going to those websites. Also, instead of a user taking a study break on their phone and scrolling for an indefinite amount of time, the Slacker mini-games could be used as a short study break that keeps the user’s attention on their laptop. The mini-games could also be slightly altered to be more educationally friendly.