Inspiration

One of our team members is an (incredibly successful!) competitive Rubik's cube solver and we decided to create an app to aid competitors (and anyone looking to practice their speed solves!)

What it does

The application offers an automatically generated Rubik's Cube algorithm that competitors can use to scramble their block for a new challenge. It also offers a stopwatch that allows users to see their solve times down to the hundredths of a second. You can interact with the stopwatch by clicking (anywhere in the app) or using your spacebar - and if you press and hold the timer won't start until you release (helping users get the most accurate times possible!)

How we built it

This application built with HTML, CSS, and vanilla JavaScript and deployed through GitHub pages. We utilized various online resources (Stack Overflow, YouTube, etc...) and practiced both individual sprints and pair/mob programming.

Challenges we ran into

Following online resources, like a YouTube tutorial ended up being somewhat detrimental to our process, and in order to better understand our code and ultimately produce a better product, we ended up scrapping all of the code we built following the tutorial in favor of writing our own from scratch.
We also ran into one particularly notable bug - where a default action we weren't aware of with a keypress triggered an unintended, separate functionality under a particular set of circumstances (specifically, pressing 'spacebar' for the stopwatch after manually generating an algorithm re-triggered the algorithm generator unintentionally). By logging out the event object in each of these situations we were able to realize what was happening with the default action and add event.preventDefault() to mitigate it.

Accomplishments that We're proud of

A couple of things that we're particularly proud of is being able to render the algorithm scrambler on the webpage dynamically, as well as being able to write the stopwatch functionality from scratch, and also critically being able to write out the logic engine for the algorithm generator itself.

What We learned

For this project, we decided to challenge ourselves to not utilize any outside libraries or frameworks, and use the project as an exercise in the fundamentals of JavaScript itself.

What's next for Solve White, Stop Watch

In future iterations of this project, we would like to offer an updated listing of the user's best time, their average score, and a log of all scores. We also floated the idea of creating a server for hosting a database, allowing us to offer users the ability to compare scores and interact across the platform.

Built With

Share this project:

Updates