usability considerations for developing web applications
Post on 25-Feb-2016
36 Views
Preview:
DESCRIPTION
TRANSCRIPT
Usability ConsiderationsFor Developing
Web Applications
Mihail V. Mihaylov (Mike Ramm)CEO, RammSoft
www.rammsoft.com
February 20, 2008February 20, 2008
RammSoft
The KeyTo Your Success
2
Ram
mS
oftWeb Site Vs. Web Application• Web site• Information
• Monologue
• Design• Aesthetics
• Navigation
• Security
• Web application• Business use
• Interactive
• Design • Utility
• Usability
• Security
3
Ram
mS
oftWhy Use Web Applications?• Widely accessible• Easy deployment• Easy management• Simple interaction
4
Ram
mS
oftReasons To Avoid Web Apps• Local network• Fast interaction• Standard interface• Typing activities• Security / Control
5
Ram
mS
oftTypes of Web Applications• Intranet applications• Local language applications• Internationally used• Commercial applications• Workload and security considerations
6
Ram
mS
oftWhat Is Usability?• System design approach• Puts the user at the center of the
process• Addresses the relationship between
tools and their users• A tool must allow intended users to
accomplish their tasks in the best way possible
7
Ram
mS
oftUsability Factors• What does usability depend on?• How well the functionality fits user
needs• How well the flow through the
application fits user tasks• How well the response of the
application fits user expectations
8
Ram
mS
oftA Broad Definition• A quality of a system that makes it • Easy to learn• Easy to use• Easy to remember• Error tolerant• Subjectively pleasing
9
Ram
mS
oftA Narrow (Formal) Definition• Ease of use• Measures how easy it is to use a
product to perform prescribed tasks
• Usefulness• Measures whether the actual uses
can achieve their goals
• Utility• The ability of the product to perform
tasks
10
Ram
mS
oftUtility Examples• Windows calculator
11
Ram
mS
oftUtility Examples• MS Word for DOS
12
Ram
mS
oftMethods of Achievement• User-centered design• Incorporates user concerns from the
beginning of the design process• Dictates that the user needs should
be foremost in any design decisions• Usability testing• Testing with ordinary users• Feedback
• Slogans Don’t Work
13
Ram
mS
oftOther Aspects• Likeability• People tend to like highly usable
products but a well-liked product is not always usable
• Usability testing primarily measures performance, not preference
• You can use standardized questionnaires to measure preference across products
14
Ram
mS
oftOther Aspects (2)• Discovery• Looking for, and finding, a product’s
feature• Learning• The process by which the user
figures out how to use a discovered feature
• Efficiency• The point at which the user has
“mastered” the feature
15
Ram
mS
oftWhy Is Usability Important?• For the customer• Better productivity• Low costs• Profit
• For the users• Less pain• Professional improvement
16
Ram
mS
oftWhy Is Usability Important? (2)• For the development company• Reduces the number of support calls
from users• Reduces training costs• Increased user acceptance• Differentiates your products from
those of your competitors
17
Ram
mS
oftHow to Achieve it?• Early focus on users• Concentrate on understanding the
users needs early in the design process
• Integrated design• All aspects of the design should
evolve in parallel, rather than in sequence
• Early and continual testing• Iterative design
18
Ram
mS
oftWhy Doesn’t it Happen?• Not an explicit project goal• PMs do not see the tradeoffs
• The unseen impact on the system architecture
• Confusing customers with users• Technical focus on the project• Feature-based design vs. scenario-
based design• Diffusion of design authority
19
Ram
mS
oftUI Design Principles• The customer is not the user• You don’t know what your user
wants• Observe user’s activities• Test early, test often, then test again• Talk one language• Use metaphors
• Make difficult decisions
20
Ram
mS
oftUI Design Principles (2)• Let the user work• Prevent, don't scold• Give sufficient feedback• Don't lose the user• Don't keep them waiting• Accessibility for disabled
21
Ram
mS
oftWeb UI Concepts• Explicitness• Be perfectly accurate• Use verbose phrasing
• Grouping and segregation• Put related things together• Separate and distinguish them
• Make everything browsable
22
Ram
mS
oftWeb Application Paradox• Server-based design• The client has a lot of options to
impact the design• They don’t use them
23
Ram
mS
oftDesign Tips• Do not use small fonts• Do not use color or textured
backgrounds • Use pop-ups carefully• Screen resolution• Accessibility for disabled
• Put important things at the top and left
• Test on different browsers
24
Ram
mS
oftAccessibility Tips• Have menus always available• Use a navigation bar• Have search ability on top
25
Ram
mS
oftAmazon Example
26
Ram
mS
oftAccessibility Tips(2)• Windows can be resized• Use flexible layouts
• Do not make them scroll horizontally• Beware of the “Back” button• Avoid using long pages• Create page menu (summary)
27
Ram
mS
oftWikipedia Example
28
Ram
mS
oftGeneral Form Usability Tips• Avoid using long forms. Use wizards
instead• Avoid reloading the page on every
click. Load some lists at the client
29
Ram
mS
oftRegistration Form Usability Tips
• Don’t ask for more information than is required
• Distinguish required fields from optional with an asterisk (*)
• Make the email address the username
• Clearly define password requirements
• Ask user to confirm email and password
30
Ram
mS
oftAlibris Example
31
Ram
mS
oftRegistration Form Usability Tips (2)
• Avoid security questions, instead send a confirmation email with login details
• Make sure your registration form is internationally usable
• Don’t use unreadable captchas
32
Ram
mS
oftCaptcha Examples
33
Ram
mS
oftCaptcha Examples (2)• Hotmail
• Yahoo!
34
Ram
mS
oftTips for Commercial Applications
• Don’t ask the user to register at first• State benefits of registration using a
bulleted list• Avoid hiding important information in
graphics that look like ads• Allow customers to enter billing
address and credit card information at a later date
35
Ram
mS
oftThank You!• Email: mikeramm@rammsoft.com
• Official website:
• http://www.rammsoft.com
• Professional blogs:
• http://pmstories.com
• http://spriipomisli.blogspot.com
top related