design without the user in mind
TRANSCRIPT
![Page 1: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/1.jpg)
1
Design Without the User in Mind
Comments… with some help from
User Interface Designfor Programmers
Joel SpolskyApress ™
ISBN: 1-893115-94-1
![Page 2: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/2.jpg)
2
UI Design: Choices
• Every time you provide an option, you’re asking the user to make a decision.
• The problem… you ask the user to make a choice that they don’t care about.
• “Users (us included)” care about a lot fewer things than software designers think!
• When does a feature become an annoyance?
![Page 3: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/3.jpg)
3
Useless Choices…
The “moving” task bar.
You can now choose to lock it ☺
How did I get all those Quicklaunch icons?
MS Word… where to begin?
More?
![Page 4: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/4.jpg)
4
The *#@!+& Keyboard
![Page 5: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/5.jpg)
5
“Just because Microsoft does it,doesn’t mean it is right.”
Consider:If MS is doing it in programs like Word, Excel, Windows, Internet Explorer… millions of users think it is “right”.What do you do?
![Page 6: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/6.jpg)
6
Harder to use… because it is notbehaving as the user expected.
“ Good UI designers use consistency intelligently, and though it may not show off their creativity as well, in the long run it makes users happier. ”
![Page 7: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/7.jpg)
7
Who is the user?
When you are writing a program targeted at non-expert Windows users, thinking like a JAVA programmer who visualizes design as a web of interacting classes is probably not the ideal mindset to visualize this typical user.
![Page 8: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/8.jpg)
8
People can’t read…What happens:• Advanced users skip over instructions.• Novice users skip over instructions, hoping
that the defaults are OK.• Some novice users read… and get lost.
![Page 9: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/9.jpg)
9
“I thought so, but maybe you are right…”
Thanks for using Juno. Are you sure you want to exit?Yes
Confirm Exit
User kept hitting no, and was surprised that Juno did not exit…
No
![Page 10: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/10.jpg)
10
Yes, No or was it No, Yes?
![Page 11: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/11.jpg)
11
![Page 12: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/12.jpg)
12
Aiming the mouse…
• Do you always point and click correctly?– Textboxes – like the URL address in your browser…– The “minimize, maximize, and exit” trio
• “Design your interface so that it is good enough to gesture with the mouse instead of requiring the precision of a surgeon with a scalpel.”– Radio button “target practice”
![Page 13: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/13.jpg)
13
Ready, aim, click…
![Page 14: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/14.jpg)
14
Moving tool bars …
![Page 15: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/15.jpg)
15
Double Clicking• First, the functionality is invisible• Next, the act of “double clicking”:
Click twice within roughly 500 msec.– Click too slowly– Jiggle the mouse between clicks– Click too fast in selecting text within a word – Click too slow…
![Page 16: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/16.jpg)
16
Double DysclicksiaSome people are immune!• They remember what requires double
clicking, and• They possess the aiming skills necessary to
“shoot a flying bird with a .357 caliber revolver while driving along a twisty mountain road.”
From Joel
![Page 17: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/17.jpg)
17
Microsoft and the Start Button
Way when… Usability Testing of Windows 95:To find documents or run software, users would not click on the Start button!Users somehow missed the logic of clicking Start to Shut Down, or Restart!!!
So… MS added a pop-up (“Click here to begin”) !
Usability didn’t increase, but the success rate in the Usability testing went up!
![Page 18: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/18.jpg)
18
“How did it know”I typed “teh” and it automatically changed it to “the” ☺
Microsoft Office contains a “ton” of these heuristics *… another,
I want a lower case i, but it keeps changing it to upper case!
* heuristics… rules that are probably right, but maybe not!
![Page 19: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/19.jpg)
19
Make your own ☺
![Page 20: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/20.jpg)
20
How annoying?
• There is a line … between “doing what you want automatically” and “annoyances”.Example
Using hyphens – such as - … No problem… cut and paste your choice!
• How do you turn off the “heuristics”? You can make money with “turn off” help!
![Page 21: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/21.jpg)
21
Did they miss the meeting?
![Page 22: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/22.jpg)
22
I have a new algorithm ☺
![Page 23: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/23.jpg)
23
When am I not annoyed?
“ A good heuristic is obvious, easily undone, and extremely likely to be correct. Other heuristics are annoying.”
![Page 24: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/24.jpg)
24
Customers / Users
How to increase the number of people that can use your software?Perspective building …
98% are smart enough to use a TV.70% can use Windows.15% can use Linux.1% can program.
0.01% can debug ASP code.
![Page 25: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/25.jpg)
25
Designing good software takes about 5 steps:
1. Invent some users.
2. Figure out the important activities.
3. Figure out the user model – how the user will expect to accomplish those activities.
4. Sketch out the first draft of the design.
5. Iterate over your design again and again, making it easier and easier until it’s well within the capabilities of your imaginaryusers.
6. Watch real humans trying to use your software.
Note the areas where they have trouble, which are probably areas where the program model does not match the user model.
![Page 26: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/26.jpg)
26
Designing “thoughts”
“… we think we’re designing for users, but no matter how hard we try; we’re designing for who we think the user is, and that means, sadly, that we’re designing for ourselves.
Until you prove that it’s usable by other people, your software is certainly not designed for them.
![Page 27: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/27.jpg)
27
“What does it do?”
Until you make the shift and let the users tell you how your software works, it simply can’t be usable.
Every successful software product is proof of this, as is every failure.
How many times have you installed some software or visited a Web site and wondered, “What does this do?”
![Page 28: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/28.jpg)
28
How will “they” use it?
Now, understand that other people will ask the same question about your software… but not in your presence.
It’s a puzzle… to solve it you must figure out how to get your software into a user’s mind, and to learn how to do that, you must learn how that mind works.”
![Page 29: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/29.jpg)
29
Where to begin?
• Build a prototype of the UI• Give users a set of tasks to accomplish and
step away!• Watch!• As they work, you may ask them what they
think is happening… what do they expect…
This is Usability testing!(well, there’s more to it than that… )
![Page 30: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/30.jpg)
30
Cardinal Axiom“A user interface is well designed when the
program behaves exactly how the user thought it would.”
All other rules of good UI design are corollaries!
Check out Joel at http://www.joelonsoftware.com/AboutMe.html
![Page 31: Design Without the User in Mind](https://reader031.vdocuments.net/reader031/viewer/2022012201/61de1f7da51cb112df67712d/html5/thumbnails/31.jpg)
31
Other good “reads”The Humane Interface, Jef RaskinThe Invisible Computer, Donald NormanEmotional Design, Donald NormanAbout Face 2.0, Alan Cooper & Robert ReimannThe Inmates Are Running the Asylum: Why High-Tech
Products Drive Us Crazy and How to Restore the Sanity, Alan Cooper
Also, Check out… http://www.guuui.com/and Jakob Nielsen’s site… http://www.useit.com/
Under construction ☺