Waterford Family Bowl website (www.waterfordfamilybowl.com)

A little while ago, my aunt approached me- she needed a website for her bowling alley. “Sure,” I said. “Let’s go over what you want and we’ll build something that works for you.”  In the back of my mind, I was thinking “awesome! Perfect timing to flex my HTML5 muscles and try jQuery 1.4 in a production environment; will it work?”

The site’s now completed, and in production. Go ahead and check it out at http://www.waterfordfamilybowl.com (still waiting on a little alternate content ). I’m going to, over a series of 4 or 5 posts, go over how the site works- how and why I used PHP, jQuery, HTML 5, jQuery, WordPress, Picasa, Google Analytics and Webmaster tools, and Google Apps; and, how I merged them all to create a dynamic, easy to use and easy to edit website. I used principles from books like “The Design of Everyday Things” and “Don’t Make Me Think”, and I’ll explain how and where these came into play.   The process I took made even IE 6 compatibility a breeze!

Brief overview on how I plan to break it down:

1. Intro to series
2. Design - architecturally and graphically
3. Implementation of WordPress, Picasa, etc.
4. “Contact Us”, finishing touches
5. Google Analytics and Google Webmaster Tools overviews
6. Wrap-up (maybe?)

Image by padday via Flickr

The first section of the book, called “Guiding Principles”, lays the foundation to begin thinking about usability. It explains the thought process that the end user takes; it’s never what you plan, but with proper design, you can help guide and funnel them in the right direction.

I’ve explained it in another post before: developers often think exactly like their application: we think, “if the user clicks X, they’ll see a menu for Y, which they can click to get to Z. Wire it up!” but in reality, the user isn’t a developer and doesn’t know the application end-to end. They have to muddle their way through the website, and if they’re lucky, they’ll manage to follow your carefully laid track. The only way we can have a hope to get them from X->Y->Z is by making each link, button, or step as clear as possible by developing controls that are self-explanatory in use. Buttons should look clickable, links should stand out from the text, headers should be obvious, and navigation should be clear. The user shouldn’t have to look up help text, experiment, or even pause to think in their quest to get to Z.

Cover via Amazon

After a 4-month break in which I was too busy getting ready for, delivering, and caring for our second child (Penelope Rose- November 16, 2009), I return!

I’ve had some pretty strange and interesting things go on in the meantime. The first of which that I will relay on to you will be some thoughts on the fantastic book “Don’t Make Me Think” by the brilliant Steve Krug.

I used to think of usability like it was some horrible sea monster, constraining design and getting in the way of just plain moving forward. But then some space ray hit a neuron in my brain, and suddenly I was interested in usability. “Can you develop fast, beautifully, and usable? Is it all about plain blue underlined links, and Times New Roman, or is usability something else?”

My first stop was another excellent book, The Design of Everyday Things by Donald A. Norman. I started with this much heavier book when I saw it on Jeff Atwood‘s reading list; it’s a more general book that covers design everywhere, whether industrial design, architecture, interface design… it was about the obvious dos and don’ts. I think that even though it was a heavier book, if I did it again I’d still start with it. It explains very well that usability isn’t about killing desig- it’s about making design accessible.

Then, one day when I was browsing around Barnes and Nobles (my wife in the children’s section, me in the computer), I saw in big letters “Don’t Make Me Think.” Having recently finished helping redesign several key areas of our website, all because these specific areas were a little rocky to use, I was intrigued. So, I picked it up… and two hours later, the store started to close while I was leafing through mid-book, my Peppermint Mocha congealed and cold.

There are two key points to Don’t Make Me Think that make it a joy to read: it’s brevity and bluntness, and it’s humor. It’s less than 200 pages, and the entire book could be read in a 4-hour sitting; but the wealth of information contained within it will impact for a lifetime.  I’ll be posting more over the coming weeks pertaining to specific chapters and sections of the book. Yay Usability!

But everyone still wants to ride the luxury yacht.