Weavora's guide to web app usability

  • View
    758

  • Download
    0

  • Category

    Design

Preview:

DESCRIPTION

Internal presentation that outlines some common practices to web app usability

Citation preview

Weavora’s Guide to Web App

Usabilityby Mike

Form validation

Realtime maskingthink twice!!!

Form grouping

Date format matters

be more human oriented!!!

Bad URLs

Modal pop up

Information on the background should be visibleOverlay should be movable

Have a titlebar

Have a close button & handle Esc

Pop up size is between 1/4 and 1/3 of existing window size

Alternatives

Date picker

Countries search

Data grid

Data grid

Inline editing

Inline editing

Inline editing

Inline edit UX

Super wide tablesOrganize most important columns to the leftExperiment with frozen columns

Limited # of columns in default view

Offer column resize

Offer columns rearrange

Group editable cells with editable & vice versa

Don’t abbreviate

Try out fat rowsSummary row = readabilityContinuous scrolling

Prior data visualization

In-column filtering

Readability

Empty container

Your inbox is empty

Button states

Interactive design

Collapsable content

Flash messages

Generic words

Error pages

Nice colors

Statistics

Sign up titles: {Create account (17%), Register (18%), Join (18%), Sign up

(40%), Start here (2%), Other (5%)}

Hints: {Static (57%), Dynamic (10%), No (33%)}; underneath (57%), top (13%), left (4%), right (26%)

Dynamic validation

30% display only an error message on top (no input fields highlighted)

29% highlight input fields with corresponding message inline (no message on top)

22% use realtime AJAX validation

14% use Javascript error warning

1% other

Confirm email {Yes (18%), No (82%)} Confirm password {Yes (72%), No (28%)}

Alignment of Submit button {left (58%), right (16%), center (26%)}

41% of the forms provide benefits of the registration

11%  inform the visitors how much time is required

54% requires at most 5 input fields, 34% requires 6-8 fields

62% had no optional fields at all

Communication

24% use conversational talk like "What's your name?" or "Your e-mail, please …"

38% both Formal ("Your name" or "Confirm password)" & System talk ("Login", "User name")

84% forms do not have any hover, active or focus-effects

Captcha {do not use (52%), 39% cannot refresh captcha without complete page refresh}

{end...}

“To design something really well you have to get it. You have to really grok what it’s all about. It takes a passionate commitment to thoroughly understand something — chew it up, not just quickly swallow it. Most people don’t take the time to do that. Creativity is just connecting things. When you ask a creative person how they did something, they may feel a little guilty because they didn’t really do it, they just saw something. It seemed obvious to them after awhile. That’s because they were able to connect experiences they’ve had and synthesize new things. And the reason they were able to do that was that they’ve had more experiences or have thought more about their experiences than other people have. Unfortunately, that’s too rare a commodity. A lot of people in our industry haven’t had very diverse experiences. They don’t have enough dots to connect, and they end up with very linear solutions, without a broad perspective on the problem. The broader one’s understanding of the human experience, the better designs we will have” by Steve Jobs

Recommended