Every designer has an area of expertise – something to hang his or her hat on. And while designers tend to focus on those skills and expand their expertise, we sometimes ignore the building blocks of design that we work with every day.Working in web design, one thing I’ve regularly taken for granted is hexadecimal code for colors – lovingly known to designers as hex codes.
Many designers and developers interact with hex codes on a daily basis, yet the majority of us are probably uncertain as to what color something like #00ff99 would produce (Spoiler alert: it’s something close to a mint green). These 6 character codes seem hard to understand from the outside looking in, but they’re built on a pretty easy concept.
While it’s an easy concept, it can be difficult to actually visualize what a hex code would produce when you’re tweaking CSS color palettes or finding the perfect swatch in InDesign. So we made it easy for anyone to grasp the idea with a tutorial-style game called Hex Invaders.
When we were building Hex Invaders, we wanted something that would let experienced digital designers see how they stack up against their friends when it comes to color, but could also be an educational tool for young designers seeking a better understanding of color on the web. As the Earth is (slowly) invaded by hex-code aliens, players must shoot down the approaching alien whose color matches a given hex code. If you choose incorrectly, you’ll see the actual hex code of the invader until you take down the correct invader.
As you can probably tell, the game style is derived from Space Invaders (what can I say, we’re clever with names), but visually we wanted to produce something that was a little more with the times than the original 8-bit game designs. So, take a break from checking emails to defend the world real quick. You just might learn something.