Upload
merlin-rebrovic
View
991
Download
4
Tags:
Embed Size (px)
DESCRIPTION
A lecture I held on Windays13 conference from 22nd to 25 of April 2013. The original was in Croatian with two hands-on demos. This lecture is translated to English and complemented with a few new slides from the demos to give it a bit more context.
Citation preview
Building Modern Software:User Experience and Design
Merlin Rebrović, Five Minutes
@merlinrebrovic
The award for the most overused buzzwordof the decade goes to “user experience”.
@merlinrebrovic
It's not a new area, but has come into prominence because users have more choices today and it's hard
to compete on hardware and features only.
How to create a lousy experience?
@merlinrebrovic
Common mistakes● Not understanding the
real need
@merlinrebrovic
Common mistakes● Building components
without a bigger picture
@merlinrebrovic
Common mistakes● Never tested in
production settings● “But it works on my
computer!”™
@merlinrebrovic
Common mistakes● Inconsistent labeling
and technical jargon
@merlinrebrovic
Common mistakes● Spelling and grammar
@merlinrebrovic
Common mistakes● No testing due to time
constraints● “We'll fix it later.”™
@merlinrebrovic
Common mistakes● End users not
educated to usethe product
● “But everyone should know that.”™
@merlinrebrovic
Common mistakes● “Just add another
button.”™
@merlinrebrovic
“If you're looking for usability disasters, just google for shareware or freeware. Sad but true, 99.9% of it looks like is was designed by a blind man with both
hands tied behind his back.”
@merlinrebrovic
Why is that happening?And a few guidelines on how to avoid these mistakes
1) Attitude “always done that way”Mentality, education, history
@merlinrebrovic
How to recognize it?● User interface is a necessary evil● Design starts from a database● We know exactly what a user needs● Keeping everything secret
@merlinrebrovic
Case study
@merlinrebrovic
Design lecture in a technical class
@merlinrebrovic
Design lecture in a technical class● Computer science students tasked with creating
paper prototypes for their class assignments● Never taught about user interfaces in four years
of studying
@merlinrebrovic
Design lecture in a technical class● Proved to be a hard, but rewarding exercise● Initial assumptions were shattered by other
students, but through iteration everyone got to a decent interface
● The lecture was declared a success by everyone
@merlinrebrovic
The best way to change someoneʼs attitudeabout user interfaces is to show them
users having problems with their product.
2) Creating unnecessary solutionsFailed communication with the customer
@merlinrebrovic
People value diversity and individuality,but during a design process we assume
that everyone is like us.
Conflict
@merlinrebrovic
Turn off your computer● Talk to people and observe their problems
@merlinrebrovic
For every solution● Ask what value does it bring to the customer● Can you test it before implementation?
@merlinrebrovic
Case studyA paper prototype used to validate assumptions
with the customer
@merlinrebrovic
Buses - assemble and simulate
@merlinrebrovic
@merlinrebrovic
@merlinrebrovic
@merlinrebrovic
@merlinrebrovic
3) Poor implementationFailed communication within the team
@merlinrebrovic
The most common problems● Mind reading (if I know it, everyone else does too)● Broken telephone● Textual specification is misunderstood or not read
@merlinrebrovic
Use the fastest and most efficientchannel of communication available:in person → video → audio → text
@merlinrebrovic
Don't write an email. Go to that person,grab a marker and use a whiteboard
to solve the problem if possible.
@merlinrebrovic
Case studyUsing storyboards and digital prototypes to get
everyone on the same page
@merlinrebrovic
Demo
@merlinrebrovic
Tested two layouts in the prototypes. Each had eight screens compiled into linked PDF for interactivity.
@merlinrebrovic
Prototype one
Listen to soothing music during a work session
Take a break when the time is up
@merlinrebrovic
Prototype two
Listen to soothing music during a work session
Take a break when the time is up
@merlinrebrovic
Time to build everything: 1 hourPresentation to the team: 3 minutes
Result: shared understanding
@merlinrebrovic
Tools● Pen and paper● Balsamiq, Axure, InVision● Prototyping in code
@merlinrebrovic
Always create wireframes?● http://merlin.rebrovic.net/blog/wireframes-or-not● No, it depends on the specific
situation and context.
@merlinrebrovic
Visual designAttractive is perceived as better
@merlinrebrovic
Conclusion
@merlinrebrovic
Communication is the mostimportant part of any project.
@merlinrebrovic
Step away from the computer whenstarting to design a solution.
@merlinrebrovic
Use simple tools so they're not an obstacle.