Skip to Content

Aarron Walter

Updated 11.26.2007

About | This Site

I started this site in my sketchbook listing my goals and ideas, and drawing a few thumbnails to sort through the content I wanted to include and get initial organization ideas. Then I drew a brief sitemap to give me a better understanding of the scope and organization of the site. Next, I did a more refined wireframe drawing on my centered draftpad to scale, which the final design ended up staying very true to. There were many logo sketches in there as well. Finally, I started creating design comps using Photoshop, some of which were flops, but still ended up informing the final design. Failure in design is actually very helpful allowing you to identify the wrong direction, which can in turn put you on the right path.

“ You have to honor failure, because failure is just the negative space around success. ”
- Randy Nelson, Pixar

I decided to design for 1024 x 768, not because general web use statistics told me to, but because my server stats indicated that the vast majority of my audience was using 1024 x 768 or a higher resolution.

Design Process

The general approach I use (loosely at times) as my compass on design journeys once I have done my initial planning and research to define the scope of the site and my audience is as follows:

  1. Identify elements to be placed on the page
  2. Rank elements in order of importance for the user and the goals of the site
  3. Identify any groupings that could make user tasks easier to achieve
  4. Place all elements on the page, positioning them in visible areas according to their importance ranking (see Jakob Nielsen article for info about prime real estate on a web page)
  5. Use a grid alignment system to create an ordered visual relationship between elements (use guides and grids in Photoshop/Illustrator)
  6. Identify the desired mood of the design, considering audience profile, and goals of the site/brand
  7. Select typefaces that have conceptual relationships to the content, defining unique treatments for dominant, sub-dominant, and other important text creating a strong information hierarchy

I find that having a list of steps really helps me focus on individual tasks while keeping my eye on the big picture. It also gives one confidence to get started, rather than be transfixed by a blank page waiting for your brilliant ideas.

Web 2.N0

This site intentionally avoids the use of excessive gradients, shadows, and rounded corners beloved by the Web 2.0 revolutionaries in favor of a more simple approach inspired by Twentieth Century Graphic Design. I am, however, deliciously guilty of using 2.0-ish DOM scripting to provide certain functionality that serves the interface design goals.

Typography

Content display brought to you by Futura, Helvetica Neue for copy, and the gentle insights of Mr. Robert Bringhurst.

In Case You Were Wondering

This site uses Word Press to facilitate the publishing process in places. I'm on the Web Standards bandwagon with structure, formatting, and behavior, and PHP picks up the slack.

There's a lot of utilities at work here ...