Category Archives: Redesign

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.

Designing this site: prologue

I don’t blog much. Which is weird, because I have plenty of things I’d love to just get down “on paper”, so to speak. But I’m a designer. I love beautiful things. This blog in its current form doesn’t fall into that category. That makes it less enticing to deal with.

Fact is, client work comes first during work time. And family comes first during personal time (and work creeps in all too often). So when to blog? When to play around with stuff I can’t play around with (yet) in client work?

In one of our recent conversations on the highs and woes :) of web work, ppk suggested that I kill two birds with one stone: design my blog and write about the process. So I can actually do my own blog design (the current one is a third-party WP theme) and write on the blog at the same time, instead of waiting until the design is “finished”, which all of you designers out there know is never the case.

It made me think about what Mark Boulton and Leisa Reichelt did for Drupal, and what Andy did with New Internationalist. Not necessarily the part about inviting feedback (which was a key factor in Mark’s process), but the part about publishing the process. Being open about this process will allow me to “think out loud”. And I’m sure some of my talented friends will give helpful and critical feedback along the way.

So my thoughts at this point are basically:

  • Create the design I want, which should at least hint at the fact that I am an experienced designer.
  • Switch from WordPress to Drupal. While I like WordPress, I love Drupal and know much more about using it.
  • Use HTML5. Like it or not, HTML5 is coming, and now’s the time to start playing with it. Some problems with HTML5 are obvious, but others will only see light in practice.
  • Although I’m not a fan of the mainly decorative parts of CSS3 which browsers have been quick to implement, there are some parts of CSS3 I’d already like to take advantage of.

That’s a start. I’ll be posting my thoughts, sketches and experiences here, documenting what I can for myself and whoever might be interested.

We’ll see where it goes.