This game was created as an experiment to see if the math segments of Countdown could work as a video game. More specifically, I wanted to see what the best user interface to recreate this experience would be. I didn't just want to make a calculator. I tried to craft an interface that would make parentheses feel natural and that would make it clear which numbers hadn't been used yet.

For Enumerate I started experimenting with an effect that would become one of the primary features of Transition.js. Essentially when the user taps a number, it moves between the bottom and top of the UI, and this is done using a combination of a little math in JavaScript and some dynamic CSS transforms/transitions.

Rather than trying to carefully position everything in CSS in some convoluted way so that I can just use the transition property to animate the change, I can style them as I normally would, as if I weren't animating them. To read more about how I animate them, check out Transition.js. (Although I'm not actually using that library here, that library uses the same technique.)

There's plenty of small features in Enumerate that come together to make the whole better than the sum of its parts. Two of these small features are worth mentioning here: The seeded number generator and the difficulty indicator.

Instead of just using the built-in Math.random function in JavaScript, Enumerate uses a custom random number generator that supports seeds. This makes it possible to share especially challenging puzzles with friends.

The difficulty indicator is a much more interesting feature. When you hover over the number at the top of the screen (or tap on it), it'll slide upwards to reveal stars. These stars indicate the difficulty of the current puzzle on a scale of 0 (easiest) to 3 (hardest).

Because the puzzles are randomly generated, the difficulty of each puzzle cannot be assessed by a human. The difficulty of the puzzles is not dependent on any one factor. A computer might think a puzzle that can be solved by multiplying 37 and 13 is obvious and simple because it's just two numbers, but most of us don't have our times tables memorized to that extent. But if the puzzle can be solved by multiplying 10 and 13, suddenly this seems completely reasonable.

So how does it tell?

Enumerate takes into account how many different ways the puzzle can be solved, how many of the numbers are required for each solution, what operations (addition, etc.) are required. So a puzzle that can be solved a 1,000 different ways will be considered incredibly easy (0 stars), but a puzzle that requires 5 numbers to get any of the solutions will generally be very difficult (3 stars).

In addition to the features mentioned above, Enumerate also works offline (thanks to Service Workers). Enumerate isn't technically a full Progressive Web App like Regretris, but it has all of the features of one that directly impact the User Experience.