“Designing for the web” or “Ouch! My double-click finger hurts”

I recently had the opportunity to watch a client look over some site comps. (Ellen, the client, is a local artist. I have been teaching her to use her digital camera and Photoshop to document her artwork. She knows that I also do web design and wanted my opinion on her new site. I agreed to take a look, and learned something in the process.) Ellen’s designer sent her a zipped folder as an email attachment. This is where the trouble begins…

Ellen’s first struggle is with the attachment itself. She isn’t sure where Mail puts attachments. After a brief conversation about the likely locations, we do a quick search using Spotlight and find the .zip in question in the Mail Downloads folder. After accidentally un-archiving three copies of the .zip, Ellen locates the folder of JPEG comps.

The folder contains over 40 JPEGs, named for their page titles. Each JPEG represented a ‘page’ on the website. Ellen double-clicks on one of the JPEGs to open it in Preview. She comments that she likes the overall design, and starts clicking on the site’s navigation in Preview. Nothing happens.

Closing the Preview window, she goes back to Finder. Double-clicking some more, she accidentally opens the same image again. Oops! Unable to navigate the site from Preview, she returns to the Finder and opens a different JPEG. Lather, rinse, repeat.

What’s wrong with this scenario? Ellen’s designer has made something that Ellen likes (she said so immediately after opening the first JPEG), but the experience of reviewing the work is cumbersome and even somewhat frustrating. This review process doesn’t resemble what it will be like to use the website (at least I hope not!) and makes it difficult for Ellen to imagine how the site will work.

Aside from the fact that Ellen’s designer is wasting time making over 40 separate mock-ups in Photoshop, this process sucks the interaction out of the design and reduces it to a collection of slides in a clumsy projector.

It’s our job as professionals to make working with us enjoyable, and as designers to create engaging and satisfying experiences for our users. Designing for the web using tools intended for print just doesn’t make sense, and it’s clear when you have to watch a client stumbling through a project that’s presented as if designing this way works.