Buy my Books!

The Sketchnote Workbook is a fully-illustrated book and video, showing how to use sketchnotes in new ways, along with advanced tips and techniques.
Learn about and buy the book →
Download a FREE chapter →
Watch a FREE video sample →

The Sketchnote Handbook is a fully-illustrated book and video, designed to teach regular people how to create sketchnotes.
Learn about and buy the book →
Download a FREE chapter →

Mike Rohde (Color - Square)

ROHDESIGN is the website of designer Mike Rohde, who writes on design, sketching, drawing, sketchnotes, technology, travel, cycling, books & coffee.
Read more about Mike →

SIGN UP! Get the Rohdesign Newsletter.

« Rohdesign Redesign: Part 4 | Main | Rohdesign Redesign: Part 2 »

Rohdesign Redesign: Part 3

Good news! I've made progress on digital 'grey box' layouts for the redesign over the weekend, so I've decided to share them here tonight. I'm actually very pleased with the shape the design is in at this point, even though there are many details to settle on.

Grey Box Layout 01
Layout 01My first grey box layout came directly from the rough sketches I'd posted in parts 1 and 2, with the globe logomark and 'rohdesign' logo type on top of each other. My goal with these layouts was to keep the design as restrained and simple as possible, after my overarching goal of "Clean, uncluttered, clear design."

While my goal was simplicity, I still wanted to remain open to changes if I felt the need. For example, as I built the digital grey box layouts in Fireworks, I felt that a migration from 2 to 3 columns was necessary to add Items not present in the initial designs. In particular, I've decided to add a 'Notable' section to the weblog. The Notable section, inspired by other blogs, will be a place where I can post links to interesting articles I don't particularly want to do full blog posts on.

Plain text with triangular graphic indicators make up the navigation, along with simple icons in light toned bars to mark off sidebar sections. Other changes included the removal of the graphic badges from the lower navigation column, in favor of text links. I've also decided to turn article headlines into permalinks, replacing the 'Permalink' text on the current design.

Grey Box Layout 02
Layout 02Over the course of two sessions layout one was completed. However, it wasn't perfect. The upper section felt too vertical and disconnected — so I created a duplicate of layout 01, renamed as layout 02. I took some time to experiment with a horizontal treatment of the globe logomark and logotype, adding a color bar along the top edge of the page.

Immediately I felt the second layout suited my goals better than layout 01. I liked the offset globe slightly tilted, the rohdesign logotype to the right and carrying the tonal bars along the top edge of the page. 02 felt more balanced overall, and more interesting to boot.

Next Steps: Colors & Textures
Now that I'm comfortable with the layout, the next step is to experiment with colors and potential textures. I plan to carry my current colors over from the old design (or very close anyway). As for potential textures, I'm considering a aged look for some graphical items, but we'll see. I like crisp clean graphics, so an aged feel will need to be brewed on for a few days.

See you all on Friday...

Reader Comments (2)

I'm in awe.

oh and i hate you.

June 28, 2004 | Unregistered Commentermashby
Thanks Mash, I'm flattered! BTW, I'm already into the secondary page designs and it's looking good. Can't wait to start building this sucker. ;-)
June 29, 2004 | Unregistered CommenterMike Rohde

PostPost a New Comment

Enter your information below to add a new comment.

My response is on my own website »
Author Email (optional):
Author URL (optional):
All HTML will be escaped. Hyperlinks will be created for URLs automatically.