This is a real headline, indeed.

I used to want to write/blog about design because I thought it was a good way to get exposure in the industry. After doing so for a while, I learned that there are much more important reasons to write. It keeps me accountable by continually challenging me. When issues arise or I find myself in a rut, I’m tempted to ignore what’s happening and struggle my way through it with my head down. Though I might luck my way out of the situation, there’s a good chance that the problem will re-surface on the next project. Then what?

When I write about the issue, it forces me to think through the dilemma and come up with a solution. So now I write because I need to. It keeps me sharp and allows me to be confident in my opinions – whether it’s regarding design, process, business or any other topic. I feel like it’s my moral responsibility as a designer who cares about creating excellent work. Therefore, I needed a new site design which would accommodate my ramblings; one that would support content and organization. This is it.

From an organizational stand point, I knew I wanted this site to be simple. There’s only a few topics in which I really enjoy writing about, so I decided to focus on them:

1. Design Explanation: The review of my latest finished projects and the explanation behind my solutions.
2. Design Practice: The discussion of industry related topics including professionalism & process.
3. Photography: The review of my photo projects and the techniques I used to achieve my results.

Each article will fit conveniently into one of these three categories. I’m not currently in the need of a portfolio site, so I decided that text would function as my primary source of content. With text as my concept, three featured categories as my focus, and type as my desired aesthetic, I was ready to start designing.

Headlines Drive My Decisions

What communicates a message best: Imagery, headlines or both? In most cases, it’s probably both. The combination of a well written, targeted headline, teamed with a supportive image can really drive home a message. But what happens when you have a lot of messages that need to be conveyed?

My wife is really into fashion, so our house is flooded with all sorts of fashion and fashion related magazines. One thing that they (and most other magazines) have in common is that the cover page is always filled with headlines hinting towards the articles between the pages. I found inspiration in this. Yes, most magazine covers also include an image highlighting the featured story, but I wanted to look past that. I wanted to see what a headline, all by itself, treated properly, could really do. This drove the direction of the site design.

I wanted users to focus on the latest, ‘featured’ article. However, I also wanted to keep the archived articles easily accessible. So, like the magazine covers, I needed to showcase many articles, while placing more prominence on one over the others. So the homepage would essentially act as a hub, helping direct traffic to where it need to be.

After lots of thought, and many sketches, I came up with a structure that roughly resembles the homepage in it’s current state: Latest headline up top, exclusive categories in the middle, archived articles on the bottom. This was the guts; everything else was filler. Now to follow through to an article page…

Creating a Comfortable Reading Environment

Clearly, the article page is where the readers would spend the majority of their time on this site. So I might as well make it a comfortable experience. After all, nothings worse than going to Barnes & Nobel, picking up a few dozen design annuals and making your way to the nearest couch, only to find that there’s no seats left. So you end up sitting on the floor, leaning against a shelve of books while having to constantly move in order to avoid tripping other customers. At this point, I make it about half way through my first magazine and I’m gone. I feel like my last blog design sort of mimicked that experience. It wasn’t comfortable. So I wanted to be sure that I payed special attention to that on this iteration.

I’ve come to the conclusion that when reading large amounts of content, its simply easier to read dark text on a light background, than it is light text on a dark background. This is something that took me a while to come to terms with, because I’m usually very found of dark, dramatic looking sites. On top of this, I wanted to be sure that I had appropriately styled treatments for any obstacle that came my way, including: Intro text, body text, subheads, links, captions, quotes, lists, etc… Check. Last but not least, I wanted the size of my text working in tandem with the dimension (measure) of the text block. Using Robert Bringhurst’s method of calculating the type size by 30, allowed me to find the appropriate pixel width, which was roughly 500 pixels. Creating a good reading experience on a mobile device was also important to me, so keeping a fairly short line measure would easily accomplish that. Combining these elements with a loosely aired line height, helps create, what I’m hoping to be a very comfortable reading environment.

Beyond the logistics: Visual Aesthetic

So the logistical decisions had been made. Time to apply some style. To sum it up quickly: I really like flat looking duo-tone designs. Something about the combination seems so analog to me; which I like. I’m still trying adjust to the beveled edges, glossy buttons, and subtle gradients which are commonly found in modern web design. Though that certainly has it’s place in the medium, I’d much rather have my personal designs be a reflection of my taste and preference. Beyond that, I wanted this site to appear clean. I’m typically a huge proponent of grunge, texture, and multilayered elements, but that just didn’t feel appropriate here. I didn’t want the design of the site to have too much influence over the article at hand. Therefore, it was important to keep design elements to a minimum, while retaining an overall look which promoted good design.

As mentioned above, this site consists of three main categories (Design Explanation, Design Practice, Photography). I wanted each one of these categories to hold something of their own personal identity. So I associated a set color palate to represent each category. While the structure remains the same, the dominant color will change depending on what category you’re in, essentially creating the feel of an entirely new site. Ok, maybe not an entirely new site, but something slightly different, anyway.

A Footer to Remember

The shining star of this design (in my opinion anyway) really resides within the footer. Ever since I browsed the app store from my iPhone for the first time, I knew that I would someday employ fixed horizontal scrolling within a primarily vertical site format. Excuse my brutal honesty, but, I love this element. This footer allows the the reader to have access to all archived articles without ever having to leave the page they’re on. While I may not love every single article I’ve every written, I still want users to be able to access them easily. On top of the super slick functionality, the footer/archive is also very informative. Consisting of headlines, excerpts, category type and date published, the user will have a pretty good idea of what each article is about before even clicking on it. Awesome, right?

Honoring the Past

This new design is a anything but a subtle upgrade from my last site; it’s completely different. Form and function. That’s not to say I’m going to miss my old friend, v3, though. I really will miss that design. Each design iteration that encourage others has taken on has been an appropriate representation of where I was at that moment in my life (regarding design), but v3 was on a new level of maturity.

So, yes; I will miss him. He’s not to be forgotten though. I’ve branded my iPhone with ENCRG wallpaper from the second I got it. I’d like to share that with everyone else too. Download the ENCRG iPhone & iPad wallpaper and you too, can help the memory live on!

Coming Full Circle

Overall, I really am quite pleased with this site. It’s a good representation of my design preference, and I think it will function nicely for it’s intended purpose. I’d like to know what you think though. I’ve opened commenting on this design, so I’m looking forward to any and all potential feed back. In the future, other articles within this category will most likely contain much more imagery, as I’ll be showing the work that goes along with the explanation. This however, is sort of a unique example. After all, the design I’m reviewing is the design you’re viewing…

Last, but certainly not least, I can’t forget to thank Jon Christopher for all of his development expertise on this site. He made this sucker work as perfectly as it does. I owe him many beers. Thanks Jon. Thanks to everyone for reading and taking the time to browse through my new site. I hope you like what you see (and read).