sketch style wireframes

Sketch style wireframe sounds good for concept development and putting up initial design ideas into paper for further consolidation. But, at the end of the day, a wireframe showing screen controls, groupings, layout etc would need tools like ppt & Visio. The advantage is that these wireframes could be iterated easily. In our projects, we have been adding another dimension to wireframe by including task flows as well using PPT. It is easy to understand and gives much better idea of how an application/website would look and behave before creating a high fidelity prototype.

Cheers,
Rajesh Jha

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

One benefit of having sketch fidelity UI elements in your 'toolkit' is that you can print out semi completed paper prototypes... i.e. page framework/fixed-containers and also print out individual elements i.e. buttons, selectors etc. Then when you're collaborating with your end-user or developer you can start mocking up the design, throw down element as needed and include hand-drawn additions, all using same level fidelity. The big problem this overcomes is that it avoids the cognitive dissonance caused by mixing hand-drawn additions to printouts that contain high fidelity elements, or visa versa.

In other words, you will throw a huge spanner in the works if you're trying to get a user to walk though a prototype that has visually finished designs and then that extra element you drew in at the last minute. The addition of different level fidelity elements will attract their attention, rendering any testing useless.

Niklas Wolkert created a sketchy stencil for visio. http://www.guuui.com/issues/02_07.php
I've started work on something for Omni that aims to be as close to what I could draw by hand (but with all the computery modifying goodness) and welcome suggestions/additions
http://graffletopia.com/stencils/414

regards /pauric

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

I have a feeling, just from my gut, that using an emulated 'sketch' style stencil will elicit different reactions from users than a truly hand-sketched prototype. I think I may just have an aversion stemming from my hatred of faux hand written fonts.

I guess I'm not answering your question rather offering an alternative to the 'sketch' templates you can use in the digital realm. Pick up a pen and draw. You can easily edit your sketches with tape, scissors, bits of paper, and white out (you can even do without this).

To your question, sketches will liberate the people you put them in front of to get active on that piece of paper. I contend, though, that there will be a difference in engagement between an digitally emulated sketch and a real one. Does anyone have any evidence of this?

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

- They are quicker to create (I knocked mine up with the freehand tool in Xara Xtreme) - They make people feel more comfortable scribbling on them - They (can) look cool.

I used Balsamiq Mockups on a tiny project earlier this week to put together and communicate initial ideas without having to scan hand-drawn sketches. The whole time, I wondered if I was doing more work than I needed to, as opposed to just going straight into OmniGraffle (which I use to create final, higher-res wireframes regardless of how I start the process). I kept thinking that I was going to recreate the screens in Graffle anyway (and flesh out far more detail), so maybe I was just adding an unnecessary step.

In the end, though, the final designs went a whole lot faster than they would have otherwise. Because I already knew what needed to be created, I was able to produce a set of screens in OmniGraffle in a very short time. And since the Mockups took so little time to create, I honestly think I spent less time as a whole by using the two products in tandem than Graffle by itself.

On another note, it's been my experience that lower-res designs (sketches, etc) tend to elicit better feedback. The more "finished" something looks, the more likely it is that people will hold back. They think, usually subconsciously, it appears, that a huge amount of work must have been done to produce a hi-res design, and they're less prone to offer feedback as a result. Lower quality designs give the impression that very little time has been spent on the design so far, so people tend to be more free with their feedback.

So, using hand-drawn sketches and/or Balsamiq Mockups, I can get ideas out more quickly, get better feedback, and spend half as much time in OmniGraffle.

It's too soon to tell how well Mockups will work for me, but it's off to a good start.

-r-

A couple of years ago, at CHI, there were a couple of papers relevant to this topic.

This discusses levels of fidelity
http://portal.acm.org/citation.cfm?id=1124959

while this one suggests that visual fidelity, the original topic of this thread, is less important than presenting alternative design solutions when soliciting feedback.
http://portal.acm.org/citation.cfm?id=1124960

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

While you can always do sketch style wireframes on the computer, it can be even more freeing to do them with pencil and paper. Even when sketching, the computer can still create the mindset that you need to make everything "perfect", so that you end up focussing your attention on the presentation, rather than what really matters about the idea you're exploring.

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

Having recently moved to an Agile environment I have been looking for ways to quickly present UI Design solutions. I do not have the time to create pixel perfect mockups up front and during the short iterations it is important for me to see the behavior then polish UI.

I started collaborating using white boards (In my opinion one of the best Agile design tools) then creating wireframes in Visio as reference for engineers. I liked using Visio as it was easier for me to make revisions and keep digital versions available for remote co-workers.

While this process seemed to be speed up the process I identified two issues. I still was not seeing things fast enough to iterate over on them and dev and documentation team were looking at wireframes as finished design. Both dev and doc were becoming frustrated as UI would continually change. After talking to various engineers we found that they were taking a lot of time to try and create UI as it appeared in the wireframe. Rather than getting UI stubbed out so that we could see behavior early they were trying to align elements, refine colors, basic pixel tweaking...

I wanted to clearly identify wireframes as "conceptual" so started using the sketchy Visio stencil for my wireframes. I also explained that these conceptual versions were subject to change as part of the iterative process. Once we were ready for UI polish/refinement I use Visio with standard controls or even Photoshop mock ups. Moving to sketch style has been helpful in our process. I suspect that this could vary depending on the consumer of design artifacts.

Posted from the new ixda.org
http://www.ixda.org/discuss?post=32905

Agreeing with Brian on this one.
I can't for the life of me find a video that I've seen about 3 years ago that focuses on this very topic.
I have converted a whole company into following the Sketchpad religion. Often times JAD and WAR sessions are captured on a whiteboard with pics taken after. I've seen 3 companies do this (because whiteboard printers are so expensive). In several occasions, the flash got in the way of the pic (because of the whiteboard reflection) and information was lost. Enter the Sketchpad.
After making the decision to use a sketchpad, one of the first thoughts that came to mind was "Why didn't I think of this in the first place?" In one meeting, while trying to explain a concept on paper, the pen was snatched out of my hand from the marketing coordinator with the statement "Here let me show you something". Pretty soon, everyone around the table was hunched over while drawing or pointing to the pad. Within the same week, 4 of the 6 people who were in that meeting now had the exact same pad I had.
I don't see any problems with converting information from a sketchpad to the screen. As IAs, GUIs and Designers, that's our job- to capture information as effectively as possible and produce it in the best way possible. Photoshop, Illustrator, Axure, Visio, PPT, Word, Omni, Mindmanager, whatever, none of these softwares will capture information as speedily and effectively as the good ol pen and paper.
Try dragging in your laptop and visualizing everything on the screen in a WAR room session- doesn't happen.
Also notice how many times a URL is shot across the table. Someone may say something like "Well soandso.com has a good example of this"- And people begin to scramble for a pen and paper to write it down. A sketchpad:

1. Can be photocopied and passed around.

2. Is light and readily available to use.

3. Allows others to jump in on the process speedily

4. Makes you look 'Old School'.

5. Allows you to capture 'wild' thoughts immediately ('Buy flowers for the wife and pick up milk" )

6. Captures real-time thought processes whle allowing others to follow along

7. Adds an additional 99 years to your lifespan and stops heart burn.

All in all, there are pros and cons to both (A page in the sketchpad can be misplace whereas caputered info on a computer is permanent...well almost permanent.)
When the dust settles, you can NEVER go wrong with using a sketchpad as a habitual practice in gathering information and producing low fidelity visuals for the purposes of translation.

Brett Lutchman
Web Slinger.

On Mon, Sep 15, 2008 at 8:08 AM, Brian Pirie brianpirieixda at gmail.comwrote:

While you can always do sketch style wireframes on the computer, it can be even more freeing to do them with pencil and paper. Even when sketching, the computer can still create the mindset that you need to make everything "perfect", so that you end up focussing your attention on the presentation, rather than what really matters about the idea you're exploring. Posted from the new ixda.org http://www.ixda.org/discuss?post=32905 Welcome to the Interaction Design Association (IxDA)! To post to this list . discuss at ixda.org Unsubscribe .... http://www.ixda.org/unsubscribe List Guidelines http://www.ixda.org/guidelines [trim]

-- Brett Lutchman
Web Slinger.

quite please my first post provoked a good set of replys!

having searched the web for a free 'sketch' style font to match my 'sketch' style wireframes i decided to pick up a pencil.

brett: i think taking by pencil into meetings could be the natural extension to this and your argument is a very good one.

Cheers,

Chris

On Tue, Sep 16, 2008 at 2:58 PM, Brett Lutchman brettlutchman at gmail.comwrote:

Agreeing with Brian on this one. I can't for the life of me find a video that I've seen about 3 years ago that focuses on this very topic. I have converted a whole company into following the Sketchpad religion. Often times JAD and WAR sessions are captured on a whiteboard with pics taken after. I've seen 3 companies do this (because whiteboard printers are so expensive). In several occasions, the flash got in the way of the pic (because of the whiteboard reflection) and information was lost. Enter the Sketchpad. After making the decision to [trim]

I had a quick look... but its not free is it? $79 for the desktop version?

Cheers,

Chris

On Wed, Sep 17, 2008 at 6:34 PM, Diana Wynne diana at chestnutdrive.comwrote:

It really depends on how well you draw though. My handwriting has deteriorated terribly over time, and I've never been good at anticipating proportion. This is acceptable on a white board, but not for docs I circulate to remote team members or want to show to users. Do play with Balsamiq if you haven't already. It's free, and Peldi's a very talented developer, trying to solve exactly this problem. On Tue, Sep 16, 2008 at 8:58 AM, Chris Wright chris.mathew.wright at gmail.com wrote: quite please my first post provoked a good set of replys! having searched [trim]