Following traditional "waterfall" methods, designers create wireframes & high-fidelity comps which are delivered to developers who build the product. This "handoff" of design to development can cause frustration and inefficiency when construction starts. What happens when it's not possible to realize all aspects of the design within the constraints of the project? What about edge cases the designer didn't consider? Once the issues are discovered, designers often aren't available to make changes and the development team has to use their best judgement when implementing the design.
What if there were a better way? What if designers could preview their work earlier and developers could give input about technical considerations? When designers and developers have necessary conversations, they can better support each other and build better products, faster.
In this workshop, Lane Halley and Mike Wynholds of Carbon Five share some "recipes" to help your team create necessary conversations and get your whole team engaged in the user experience of your product.
http://blog.carbonfive.com/2013/06/03/ux-team-sport/
14. wireframe walkthrough
• Collaborative design critique
• For users, clients, designers, and developers
• Print it out, post it up, stand at arms length
• Use think aloud protocol
• Document with stickies on the wireframes
Wednesday, May 29, 13
15. When to do it?
•At start of project
• During iteration planning
Wednesday, May 29, 13
17. developer cheat sheet
1. frame the conversation
2. acknowledge the challenge
3. act like a curious user
4. questions over comments
5. say “we” over “you” or “i”
6. participate as a creative collaborator
Wednesday, May 29, 13
19. 1
designer:
print out and post the latest wireframes on a wall
at gallery height.
find a developer and put them at arms length
from the drawings.
Wednesday, May 29, 13
20. 2
developer:
ask about the current state of the designs and
what kind of feedback they’re looking for.
find out if the designer is more interested in
generative or evaluative feedback.
ask “where are you at?”
Wednesday, May 29, 13
21. 3
designer:
let the developer know about your goals for the
walkthrough.
say “i’m really interested in hearing your
thoughts on...”
Wednesday, May 29, 13
22. 4
developer:
acknowledge the challenge.
walk through the flow, pointing where your
mouse would be.
narrate what you are thinking and doing as a
user.
“i’m trying to find out how to...”
Wednesday, May 29, 13
23. 5
designer:
take notes on stickies.
place the stickies directly on the wireframes to
mark the location of the comment or observation.
this is a free usability test!
Wednesday, May 29, 13
24. 6
developer:
note missing functionality or difficult technical
challenges.
ask questions about the user rather than making
statements. for instance: “how would I find a
forgotten password?” rather than “you forgot the
forgot your password screen.”
keep in mind that this is a cooperative discussion
about the design, not a judgement on the
designer.
Wednesday, May 29, 13
25. 7
designer:
take notes and offer insights into the current
design solution.
listen, breathe, and try not to get defensive (or
think of elephants).
postpone deep or off-topic discussions.
“that’s something we’ve been really struggling
with.”
“we tried that but noticed...”
Wednesday, May 29, 13
26. 8
developer:
suggest alternatives to any particularly
challenging engineering implications.
“what user need are we trying to address here?”
“we could try... and get a similar result with less
effort.”
“this is our main feature so it makes sense that we
spend extra time on it.”
Wednesday, May 29, 13