For the past three days I’ve been slugging-it-out with the tag cloud and the first pass layout, trying to bring them out of the abstract and into something tangible. This is the part I always find really difficult. I’ve been spending a couple hours a day on this, pushing past all my negative reactions to the design as it evolves to find the next visual idea.

The above graphic shows the progression from the first ugly step (A) just getting some image and text down. Compared to the original thumbnail sketch (which itself is a bit vague), there are some differences, but the general idea is the same:

• There’s a BIG IMAGE at the top, which will be “responsive” in that it always fills the space from edge-to-edge in a browser. The image is a placeholder; ideally it will be an image that visually supports what I’m about.
• There’s a DAVE IDENTITY somewhere within that image, or next to it. Since it’s near this big image, I don’t have to lead with my face/name alone. Maybe this is a cop-out, but it is personal preference.

Also within the header are opportunities for additional supporting links. Right now I have a “what’s new” and “what is creative independence”. The image area might become a slider that cycles through several backgrounds, or there might be a small menu on the right.

Below the header are the content areas, which I will be constraining to 960 pixels wide centered in the frame. As this is the front page, the content areas will be stacked on top of each other and then divided horizontally according to whatever grid system makes sense.

I’m trying to get away from my current blog design, which is constrained in a white rectangle. I’ve admired some other website designs that have a more open feel by eliminating the edges, instead implying them through alignment. The result is a layout that feels more open, which is how I want to feel.

I’m thinking that the stacked content areas will give me some flexibility in design. As the content area is 960 pixels wide, this divides cleanly into halves, thirds, or quarters. It also isn’t a bad basis, from what I can tell, for a responsive design that crunches down to fit any screen. I’m not planning on making the design responsive, however. Perhaps in the future, but not right now.

Anyway, I’m thinking there will be at most two stacked content areas. The top one will be a slider that covers the three or four main features on the website using mostly graphics and large type, serving as a lead-in to inner pages. The bottom one will be more text-y, showing recent stories and whatever. This is what I have to design next.

Also in the queue, after the content areas are done to a rough pass, will be to design the inner pages: the blog templates, page templates, and shopping templates. Next week I’ll have to think about the minimum I need to launch with new content areas + shopping areas. I’m thinking I’ll be VERY lucky if I can get this all done by April 4.

For the rest of this week I’ll be quite busy so I don’t know if I’ll make much progress, but I can at least do the daily 15M on this to keep it fresh in my mind.