Inspiration

I do art, and as artist, I value color perception more than others. Other sites have ways to judge my color perception, but it's done through one-dimensional tests and standard difficulty implements. I have multiple of these sites saved, but sometimes I can't remember a specific test associated with these sites. Hence I wanted a consolidated version that is creatively difficult and still easy to show off.

To do this, I was inspired by a couple of games that I've played. My solution is to apply modular difficulty implements on a standard game, similar to the rhythm game Osu. I have also applied the timed scoring system from Kahoot, which combine for a high ceiling of skill expression. To match the water theme, I have associated the difficulty increase with the storm from Fortnite, eliminating the colors furthest from the target.

What it does

You are given a target color. Your goal is simple: find the matching color amongst the gallery.

At first, it will be simple, as the gallery consists of all possible colors. But the more correct colors are identified, the more the storm grows, until the colors are hardly discernible from one another.

You may additionally add in mods to alter the gameplay experience. None of them are mutually exclusive, and adding more can compound the final score modifier. Beware of drastic difficulty increases by doing this however.

How we built it

React + TailwindCSS + Typescript

Challenges we ran into

The difficulty system. In a single sentence, it chooses "distractor" colors from the solution using a margin 100-0. (100 is the full color range, lower decreases the range, much like the storm eliminating constestants)

Obviously I can't use 0, since the distractors would be fully imperceptible. The "highest" difficulty level caps this at 10, but I still believe this to be extremely difficult. The game loop is simplified to adjust to 5 "storm" levels off this interval for an "acceptable" difficult curve. I am still unsure of how I should increase the difficulty as the rounds progress. For now it is 15 rounds, and the storm level increases for every 3 correct answers.

There are also some constraints when picking the target color in the first place. Using the HSL color system, the color can't be too gray, black, or white. Extreme blacks, whites, or grays are too difficult to discern. I needed to ensure the randomization is still fair yet sufficiently challenging, and choosing the extremes kind of ruins the point of a "color storm"

Accomplishments that we're proud of

The flashlight mod, or stacking mods in general. I didn't want my game to rely on just the storm level. Combining mods creates unique difficulty interactions that elevate each other, even without a formalized difficulty level.

What we learned

Fast UI development. I basically used the stack from the last hackathon, only that I could execute my idea a lot faster with more experience.

What's next for ColorStorm

Additional mods (e.g. Sudden Death, Hue lock) Custom # of rounds and colors

Built With

Share this project:

Updates