Site Design

This website, along with the other ones in the I Need More Coffee family, are worry stones. As a result, the design is likely going to be altered and changed as time goes on, but I do want to outline some basic principles that shape the way , as well as design elements I want to use for consistent identity and small visual flair.

Principles

Be Lightweight and Crisp

In keeping with the main I Need More Coffee site, this site’s aesthetic is defined by it’s relative lack of visible styling. The site uses your device’s built in sans-serif font, images dithered with Bayer ordered dithering (in black and white when possible), and doesn’t have any flashy navbars or buttons or anything else.

A main goal I have is for the site to be just as readable and usable on paper as it is on a screen.

Design Elements

Components

Napkin Drawings

I draw on napkins a lot. It started as a natural consequence of what my workflow during this past summer has been, as I’ve been posting up in coffee shops and often carry only a small backpack (meaning my legal pad stayed home). As a result, I started jotting down notes on napkins.

As I continued doing this, however, I realized that the napkin represents a unique medium for thought. They’re informal and not as meaningful as writing on paper or in a notebook, but demand some level of refinement due to how difficult it is to write on them. Focus is needed when drawing on a napkin and make deliberate strokes, it can’t merely be lazy chickenscratch like what I often find myself writing in my legal pad.This creates a unique environment where I both find myself actually putting thoughts down, unlike notebooks that can feel intimidating, but forces me to form my thoughts deliberately enough that the end product is actually useful.

As a result, when determining what the visual style of this site would look like, I chose to use my napkin drawings as a major visual element. I personally love when authors use visuals to convey their thought process, in particular I’m a huge fan of how Maggie Appleton uses extraordinary visuals to explain very complex concepts, and maintains a very consistent theme of visualizing things across her site. While I’m no illustrator, and certainly don’t have the same capability to express my thoughts in very cohesive and clean visuals, I still do work through my mental process visually and spatially on napkins, and I think they provide insight into my mind that text alone cannot provide.

To digitize my napkins, I typically take a photo with my iPhone, then use the “subject cutout” feature to eliminate the background. I then feed it into Dither It! to dither it using Bayer ordered dithering with a black and white palette.