Wireframes a waste of time?
I often see that with relatively small or individual projects visual interface design is considered much more important then interaction design. Perhaps even on the scale of the Pareto principle. 80% of the time and attention is being spent on visual interface design and 20% on interaction design.
This is caused by the idea that wireframes (and persona’s, but that’s another story), which are an essential factor in interaction design, are often seen as a waste of time. Most designers don’t see the need of designing the framework first, and then the visual design. It feels to much like double work. And because time is preciouses, Photoshop is opened before Visio or Omnigraffle even had a chance.
A new way
I want to introduce another way of looking at interaction design, especially at making wireframes. It’s as followed;
Take wireframe design as serious as you would normally take visual design. Make a wireframe of every page of the website you’re planning to build. Add a little bit more detail to your wireframes as you normally would. And thereby spend also much more time making your wireframes. When you’re finished with the wireframes you would normally start to visually design the website. But that’s not necessary anymore. Because the only thing that’s left is skinning your wireframes; applying a certain style.
It’s the end of the term visual interface design, wireframe skinning it is!
Dennis Koks
10 June 2007
I do agree that a lot of people should take interaction design way more serious in the whole process. (There also are a lot of people out there who do) But don’t forget that it’s just part of a process and everything in that process should be perceived as equally important.
And about “wireframe skinning†as you’d like to call it. Well you have to be carefull and see that one from a different perspective. I mean, what would you rather have on your businesscard: Interface Designer or Wireframe Skinner?
Peter
11 June 2007
Interaction design should take up most of your time when designing a proper product. If you want to save yourself a lot of time, you do the interaction design first.
Brett Munro
11 June 2007
Are you talking about flow charts or blocking out websites visually?
See this - http://www.31three.com/projects/epc/
His wireframes are done in Illustrator, not programs like Visio.
Dr. Pete
13 June 2007
I think the whole appeal of wireframes and similar approaches is that those of us who have strong UI/usability skills but are just halfway decent designers can separate out what we do best. As a designer, I have a tendency to get in my own way, so it’s great to be able to map out a site and create something that a talented graphic artist can put to work.
matthijs rouw
14 June 2007
I feel that you really should not pay that much detailed attention to your wireframes. Meybe even less .. They are about showing _functionality_ not layout (I said layout - not design) .. So a tab in a wireframe can end up as a menu button on the left hand side on the site .. You do not want anyone saying anything about the position of a functionality on a page in a wireframe yet, so you should try to look it as little like a page as possible .. But then not too abstract, since that’s hard to communicate about .. Wireframes - diffucult but o so useful!
My rules of thumb:
- make things look like a shetch (so a little un-alignment is ok)
- no colour, unless you need to emphasise - then make it a bright ugly colour
- no images or logos, maybe a placeholder for a logo ..
my 2c
Peter
18 September 2007
You are so right, Rogier. Totally agree!