Wireframing - what a waste of time... not!

  • View

  • Download

Embed Size (px)


Safe Area Please Read

WireframingWhat a waste of time not!Michael Gaigg, mgaigg@esri.com- it's a planning tool, whenever you need to turn a concept into design

-> implication: your design is only as good as your strategy/concept

- ask the right question (strategy)1DemoDemo:

- no need to describe to you the benefits, just see

Tips:- mockupstogo- mybalsamiq- don't have templates, but have stencils (symbols)- cropping- keyboard- 960 grid system- notes- from rough to detail- design to scale if possible- please no more lorem ipsum2Example 1 | Landscape Decision Tool

Let me show you some case studies to illustrate how and when we can help.This is the LDT, a proposal we are working on right now for the DOI. While usually I recommend 2 or max of 3 rounds of mockups, during proposals where requirements are vague its more important than ever to kick around ideas and bring the visuals in front of key stakeholders and decision makers. So we might end up with 6 or 7 rounds.3

Example 1 | Landscape Decision ToolAnd this is our final mockup that we felt confident fits the target audience of an executive.You see the basic elements: header, navigation, dashboard, RFI, MapsMove that screen!Can you guess which technology this is based on?4

Example 2 | Reviewer Server

WireframeFinal VersionReviewer Server asked us to help designing the RS Health Check Dashboard which was used and presented at the UC this year.

Validate your designs!!!5

When | As early as possibleIt will save you Energy Time Money

Because the majority of UI changes made before coding begins.


Who | Anybody should sketchdifferent disciplines need to interweave/overlap (designer needs to influence the requirements and a pm needs to influence designs)"Oh, here's some requirements that I have, and here is sort of high level what I'm thinking about.

a picture/sketch is so much richer than describing - communicate visually7

Why | Manage risk & expectationshelps prioritize and add emphasis to the important user storiesidentify gaps/possible wholes and not needed functionsnail down scope and functionality

Avoid building features that turn out to not be needed in the first placeLimit the amount of gotchas along the way, ah, we need to be able to save this damn thing, lets add another button


What | Dont get hung up on details- it's obvious that design is not done, looks unfinished, nothing set in stone- Dont get hung up on discussions about design details. Dont loose focus of the main goal and core tasks!

Detail '57 Chevy


How much | Limit amount of iterationsUnless there is a good reason proposal work, research, marketing max. 2 iterations!Finalize and move on!There is plenty of room for fine-tuning along the way


When | Not for documentation per seA sketch is a sketch (after serving its purpose its still only a by-product, like a white-board drawing)Dont end up spending more time updating all the sketches in all the places in all the documents thats not the idea of sketching

Get sign off!11

How | Tools dont replace experienceAs simple as it looks (or I make it look) sketching/prototyping is only as good as the person that does it.It doesnt replace experience and hard work.