Transcript Motwalli_Usabiliy_woAudio

usability
Olaa Motwalli
CIS764 , DR Bill – KSU
Overview




Usability factors.
Usability guidelines.
 Software application.
 Website.
Common mistakes.
Good and bad examples.
usability
Can usability be measured?
Usability factors:
 Ease of learning: How fast can a user learn the system sufficiently to




accomplish basic tasks?
Efficiency of use: A user's ability to quickly accomplish tasks and find
information with ease and without frustration.
Memorability: can a user remember enough information to use the
application effectively next time?
Error frequency: How often do users make errors while using the system,
and how do users recover from these errors?
Satisfaction: How much a user enjoys using the Web site or the application?.
Usability guidelines application/website
Involving Users in the Design Process:

Know Your Audience.

identifying the needs of your users.

Reflect the User’s Mental Model.

Build Prototypes.

Observe Users once you have a prototype.

Use the information recorded from your user tests.
2. Use Real-World Metaphors.
1.
Take advantage of people’s knowledge of the world by using metaphors to convey concepts
and features of your application.
Usability guidelines application/website
3. Keep It Simple and Pretty.

Making Design Decisions for
adding features in your
application or website.

Every time you add a feature to
your application or website,
Your application or website gets
larger, slower, and Your
application’s human interface
become more complex.
Usability guidelines application/website
4. Allow Direct Manipulation.

an example of an implied action that allows users to feel that they are
controlling the objects represented
5. Provide Rapid Response.
6. Keep Interfaces Natural.



Try not to overwhelm users by presenting too much information at once
Don’t overload windows and dialogs
Use high-quality graphics and icons.
7. Make Navigation Easy.
8. Make Your Application Consistent.
9. Give the User immediate Feedback when user perform action.
Usability guidelines application/website
10- Anticipate Errors.

Provide useful error messages to users
11- Give the User Control
12- Forgive the User.
13. improve structure:
1.
2.
3.
– avoid modes, features only in toolbars
Chunk information into visual groups, based on topic or functional similarity
from the audience's perspective.
Offer several ways to find information– navigational elements, search
functions, or a site map.
Use meaningful and consistent button names.
Usability guidelines application/website
13. improve structure:
5. Most navigation pages should not scroll.
7. put navigation elements or navbars in a consistent and/or predictable location.
8. Never make the viewer scroll to locate important navigation buttons such as
"Buy now“
9. Make it easy for users to skim; provide clues that allow users to find the
information by scanning rather than reading.
10. Do not give all the object same level of contrast.
Usability guidelines for App and Website
14- Make your application or website accessible to
people with disabilities.
Visual Disabilities – Color blindness.
 Hearing Disabilities

15- design your software for reliability.

Make sure your user interface behaves in a predictable way.
 The same set of actions should generate the same results each time.
Suggestion

Offer an application guidelines.

KDE Human Interface Guidelines.
 GNOME Human Interface Guidelines.

Offer a website guidelines.

W3C Web Standards (world wide web consortium).
Example for KDE Human Interface Guidelines

mix of interface elements: a dialog
box with a menu bar

Don't put status information in the
menubar. Use a statusbar for that!
Usability guidelines for website

why usability is important in the website–
On the Web, usability is a necessary condition for survival.
If a website is difficult to use, users get lost on it, or a website's
information is hard to read or doesn't answer users' key questions, people
leave.

To create a website that satisfies the use, it should be easy to
use and to learn as well as earn the user trust.
More detailed website guidelines

Text:






Make text easy to read.
Medium-sized fonts.
Mixed case for text rather than all capital letters.
Line lengths less than 50 to 60 characters.
High contrast between text and background colors to increase legibility.
Dark text against a light background is most legible.
Image:


Avoid using graphics as links or content.
Have small graphics.
 GIF vs. JPEG: Which should you choose?
More detailed website guidelines

Link:

Make link obvious by use colored, underlined text link (don't underline nonlink text).
 Differentiate visited and unvisited links.
 Don't use "click here" or other non-descriptive link text.
 don't open pages in new windows.

Background:

Keeping a consistent background from page to page to let a user know where
he or she is.
 Avoid using less contrast color together
using red and blue/ white and Yalow.
Catman's Color Brightness, Contrast, and Harmony Tool
More detailed website guidelines

Color:


Font:



Don't overuse color.
Major font reading time in second.
Times and Tahoma more readable.
Form:



Avoid brake the form.
Support different address formats.
Let users enter data in the format
they prefer.
Telephone Number (
)
-
.
Avoid a common mistakes



Do not have JavaScript which works only in internet Explorer.
Do not have archives for old good information.
Do not use PDF Files for Online Reading-hard to navigate - PDF is great
for printing.
bad Example
bad Example
Good Example
References
1- Apple Human Interface Guidelines
http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGui
delines/OSXHIGuidelines.pdf
2- Motif Style Guide
http://www.s-and-b.ru/syshlp/motif_guide/MotifStyleGuide/TOC.html
3- KDE user interface guidelines
http://usability.kde.org/hig/
4- GNOME Human Interface Guidelines (1.0)
http://developer.gnome.org/projects/gup/hig/1.0/index.html
5- msdn- Improving Web Site Usability and Appeal
http://msdn.microsoft.com/library/default.asp?url=/library/enus/dnsiteplan/html/ving
siteusa.asp
References
6- Top Ten Mistakes in Web Design
http://www.useit.com/alertbox/9605.html
7- The Usability Company, part of Foviance
http://www.theusabilitycompany.com/index.html
8- Usability Engineering Team Design Guidelines
http://www.grc.nasa.gov/WWW/usability/colorcss.html
good example link
http://www.lakeshorebaptist.net/
bad example links
http://www.lakeshorebaptist.net/hycws/
http://www.geocities.com/Paris/1594/
Questions