person using track pad
Photo by Glenn Carstens-Peters on Unsplash

I don’t consider myself a designer by any stretch, but I wanted to have a place to document some of the choices I have made concerning this website. Not sure how often I’ll update it but might add something every so often.

Inspiration

I’ve been a fan of the design for Wale’s Hate Is The New Love mixtape ever since the first time I saw it. The grayscale photograph in the background and the colors of DC’s Metro map overlaid in the foreground play against each other nicely. I’ve wanted to emulate something like this in a website’s design for a long time.

Album cover for Hate is the New Love by Wale

Colors

Instead of going with the same colors from the mixtape, I decided to look a little closer to home. Since I’m not from DC, I pulled my colors from an NYC subway map I found somewhere on the web. They’re a bit brighter, which I like, and I got the names from an online color name matcher. It’s kind of fitting that two of the names wound up being locations in Pokémon’s Kanto region.

  • Cinnabar

    #ef3e42

  • Ecstasy

    #f58220

  • Candlelight

    #ffd420

  • Green Haze

    #029d57

  • Deep Cerulean

    #006bb6

  • Plum

    #9d3d96

For the grayscale, I chose a pretty basic range. I think I found it as part of the default palette in a design program I was using at the time.

  • Mineshaft

    #333333

  • Emperor

    #4f4f4f

  • Gray

    #828282

  • Silver

    #bdbdbd

  • Alto

    #e0e0e0

  • Concrete

    #f2f2f2

Fonts

As a developer, I have been using Input Mono in my text editors and terminals for years. When I saw that DJR released its companion, Output Sans, I knew I had to use it for my next website. Nearly all the text across this website is set in Output Sans with few exceptions.

Output Sans

The world is veiled in darkness. The wind stops, the sea is wild, and the earth begins to rot. The people wait, their only hope, a prophecy…

“When the world is in darkness Four Warriors will come…”

After a long journey, four young warriors arrive, each holding an ORB.

For embedded code samples, the font switches over to Input Mono. It is also used on specific elements that are meant to look like video game text.

Input Mono

The world is veiled in darkness. The wind stops, the sea is wild, and the earth begins to rot. The people wait, their only hope, a prophecy…

“When the world is in darkness Four Warriors will come…”

After a long journey, four young warriors arrive, each holding an ORB.

Icons

Years ago, I bought all four Pictos icon packs from Drew Wilson, which I guess are now considered Pictos Classic. I still find myself using them in projects from time to time and this website is no different.

Software

Due to its simple aesthetic, most of this site was designed right in the browser in code. But I will jump into Sketch here and there to work through an idea or concept.

If there is anything else you want to know about, feel free to get in touch with me. I’m happy to answer any reasonable questions.

More interested in bytes than pixels? I have a page about the technology too.