Designing this site, part 2: Values, goals and requirements

A week of hard client work behind me and it’s time to be my own client. And just as my clients would tell you when I badger them with the questions I’ll be asking myself, the first part of good design is not necessarily the fun part. It’s about asking questions, sometimes difficult, but always meant to encourage focus. Focus on what the website needs to be, and for whom.

As I mentioned last week, I’m redesigning this website, which for non-colorblind visitors is the pukey–green monstrosity before you. The color combination has been a joy to me, watching people dry–heave and reach for their feed readers while they still had the chance. But those days are numbered. I consider it quite unacceptable to be creative director of a reputable web design firm and not have a personal site which shows the same amount of thought and effort that goes into client work.

I’ll be putting my money where my mouth is, and using the same process I’ve evangelized for years and use for clients all the time. The Design Funnel is nothing new; many designers follow similar processes. I claim no patented process. It’s simply a (traditional?) process which I’d like to see more designers utilize, especially in this age of jumping–right–into–Photoshop, but also for those who don’t sketch before designing in the browser. It’s about thinking through before doing. It’s about design instead of decoration, which is so prevalent on today’s Web. This site is an example of decoration, and that shows. And that’s a pity.

Step one is defining values and goals. Defining the problem isn’t enough (and defining possible solutions at this point borders on evil—if you’re a designer, you know that a lot of clients tend to do this). My problem is pretty much stated in the second paragraph. But what’s important to me? Let’s not worry about formulating at this stage. This stage is about aggregation. To do this, I’ll answer some of the questions I ask my own clients.

What do I want (the site) to communicate, show, tell or do?

I work hard, with a talented team, for some awesome clients, many of whom are very happy with our work. Client work is nevertheless sprinkled with compromise and factors such as existing brain–dead branding by brain–dead design firms. This is actually the hallmark of good designers: working within constraints. But that doesn’t mean it’s easy. It also doesn’t mean the end result will fit your personal taste.

The Haystack should fit my personal taste. It should be what I feel is appropriate design, and I want to design it myself. It should demonstrate my ability as a designer and art director, and should adapt to the content I choose to publish. It should not overpower the content, nor should it be mere decoration for the content. It should be pleasurable to visit and read (okay, calmly, slowly, place the feed reader on the ground and kick it over to me).

It should be an online repository for all thoughts, ideas, discoveries, code, images, sketches and anything else I’d like to share publicly. It should be technically adaptable to my usual flurries of endless ideas, re-evaluation and mind–changing. It’s a bird, it’s a plane, it’s…

For whom?

I’ll be writing and posting about things for which I have a passion, and that means mostly design and web development, art, technology and any combination thereof. Therefore the audience will be (and is) industry creatives, developers and perhaps a few societal misfits and some very nice people. Oh yeah—some family and friends who will get here by clicking on the little blue E.

Any branding guidelines or creative considerations?

No brand. But the site should make a mark by being recognizable. Creatively, I’d like to be able to tailor the design of posts and pages to the content. Being able to art direct my own posts will be one of the biggest advantages to the redesign. Jason Santa Maria does this fantastically; he’s chosen not to let his CMS determine his design possibilities. The new site should allow me to art direct the full design of a post: type, color, layout and imagery.

It should be standards–compliant. It should be accessible. It should uphold basic usability principles, but I’m giving myself some space on that one. Usability purists, simply turn off CSS completely, thank you.

Technical considerations?

• Write it in HTML5, just for the challenge of getting the design I want using a moving target. I will, however, think twice about using vague so-called “semantic” elements like

• Use as much CSS3 as possible. Not necessarily the decorative stuff like border-radius et. al., but really cool stuff like media queries and the tastier selectors.
• Use Drupal, because I’ve got 2+ years experience with it, and it will allow me the flexibility I want in implementing a design. Plus, it is quite awesome.

Next steps

Reading through this, I realize that if a client had sent this to me as their wish list, I would’ve had a conniption fit at the office. It’s a good thing I know what I mean by all of the above. Now that I’ve got it typed out, though, it’s enough to get the ideas flowing. We’ll cover it and let it simmer for a while.

And then it will be time to start sketching.