28 October 2011

101: Fast UX

1) Agile development is feedback driven.

2) Development teams need to keep testing quick, simple, and frequent.

3) Agile UX must be flexible. It must respond to end user feedback and market changes in one iteration (one week).

That is what ScreenZest provides for them. It is better than other methods of user validation like Interviews, In-house usability tests, Focus groups, Surveys, Beta tests, and Demos. They are just too slow.

It appears what we are selling is "Fast User Validation" --not "Reduced Bounce Rate".

100: Keep testing quick, simple, and frequent.

Agile development is feedback driven.

Here are some ways salesforce.com facilitates testing:
  • The company uses simple screen-sharing software (GoToMeeting) to share prototypes electronically. Testers pass control of mouse and keyboard to their users to watch them work.
  • A simple conference call lets a facilitator talk to users and lets the user explain likes, dislikes, and areas of confusion.
  • The company sometimes uses TechSmith’s Morae to record the screens and audio as users interact with the software.
  • A projector displays the user’s interactions with the product in a large format so that all the product team members can easily observe them.
A typical weekly testing cycle has salesforce.com designers testing Monday, fixing Tuesday, testing Wednesday, fixing Thursday, and then testing again Friday. By the
end of the week, things are getting pretty good. User-experience people, product man­agers, developers, and others sit in on the call and watch the screen.

99: UX Validation with Interviews, Usability tests, Focus groups, Surveys, Beta tests, Demos

Interviews
Interviews are structured one-on-one question and answer sessions. They are investigative in nature so the intent is to gain understanding in areas that are unclear. The majority of interview questions are "open" and conversational, instead of "closed" and quantitative. For example, an interviewer might ask, "What does our competitor do better than we do?" to initiate a discussion, but not "Please rank on a scale of 1 to 5 which of these competitor's features are better than ours."

Interviews are good for learning the customer's pet peeves, the problems they are running into, their likes and dislikes about the software, and what they want to see in future versions. Interviews cannot determine if software is easy to learn, or easy to use. Interviews will not help identify new market opportunities.

Usability tests
Usability tests are used to evaluate a product design by watching the intended users of the product try it (or a prototype of it) for its proposed use, and seeing what problems are found. Usability tests are good for discovering issues with learning, discoverability, error rates, and speed of use. They also uncover issues with incorrect or omitted feedback. Usability tests can uncover missing features that are needed to complete a workflow. Usability tests cannot discover whether a product will fit into the users' work environment since they are normally not conducted at the users' work place, on their hardware and using their files. They cannot verify that a product is solving the right problems for specific users, or if people will actually buy it.

Focus groups
A focus group is a moderated, exploratory discussion with a prepared focus. The participants are users or potential users. Focus groups are good for getting user's opinions, goals, priorities, and seeing how these compare to others in the group. Focus groups cannot determine if users would actually use proposed new software, or what features should be put into a release. They also cannot be used to determine whether software is learnable or usable.

Surveys
Surveys are strict sets of questions that are delivered to a large number of people in order to gather quantitative data. Surveys are good for getting simple factual data, priorities, and confirmation of information that was gathered in an exploratory session. Surveys cannot give an understanding of the “why” behind the facts that are gathered since there is no ability to have a discussion with the participants. Surveys also cannot tell if people will buy a product.

Beta tests
Beta tests are when almost-complete software is sent to customers, and they are asked to report problems. Beta tests are good at finding bugs. They are also good at determining if the software actually solves the customer's problems and if it works in their specific environment. Beta tests cannot convey if the software is easy to learn or easy to use since beta customers will not typically give this feedback. If the software is hard to learn or use, Beta customers will blame themselves and will not report the problem because they do not want to appear stupid.

Demos
A demo is a canned demonstration of new software (or new features) shown to your customers to get their opinions. Demos are good for learning what users think about a proposed feature, if a feature would make them more likely to buy, and if they think you are going in the right direction to solve their problems (although they cannot tell you if you are actually going in the right direction). Demos cannot determine if a feature will work in a real production environment, if it is easy to use and learn, or how much people will like the feature after they start using it for real.

98: UX validation groups = development partners

Cultivate a group for continuous user validation
UX people build up a pool of users they collaborate with to validate design before and after it's built. This pool of users needs to be large enough that the designer doesn't call on the same user repeatedly every week - but rather talks with them every month or two.

97: Informal UX feedback for Agile Development

Narrowing the gap between gathering usability data and acting on it.

From the software developers’ viewpoint, they can no longer manage the slow pace of formal usability testing. Instead the require faster and more iterative informal testing, by asking for customer feedback on features and also having IT developers in other parts of the company test the product to see if they could break it. It's a more agile testing approach.

The toolkit has changed to include faster methods. It now takes a shorter time to get a study going, finished, and analyzed.

All this research, modeling, and high level design often occurs in weeks, not months.

Organizations need a continuous flow of users scheduled to validate design work. Schedule users for remote usability testing or site visits well in advance. The one thing you can depend on in an Agile context is that there will always be something.

UX work is mostly about discovery, agile work mostly about delivery. Two worlds - both concerns are necessary. Discovery never stops. And, discovery without delivery isn't very valuable.

27 October 2011

96: Self-initiated UX feedback

UX Metrix is selling an online self-initiated feedback service. Testing produces customer loyalty and reduces support cost.

Common problems with testing:

Memory
It’s not uncommon to observe people struggling through a website and afterwards they say it was “easy enough.” Surveys are particularly bad at uncovering "memory" issues, because time passed between the user’s actual experience and the survey.
ScreenZest reminds them of what may have been "right" and "wrong".

Attribution
I probably did something wrong.
Many users blame themselves when website problems occur. Issues that make people feel stupid remain under-reported.
ScreenZest helps uncover issues that people would not report by themselves.

Comfort Level
I don’t feel comfortable making suggestions.
People often assume the website they are using is the best that’s possible. Even if a prominent “Contact” option is provided, this may not encourage people to make suggestions.
ScreenZest voting has a lower threshold than originating ideas like with surveys, etc. Voting feedback gives quantitative insights and adding comments gives qualitative insights.

Effort vs. Reward
Should I bother?
Someone who has just spent a lot of time trying to use a site will not be excited to spend even more time trying to provide feedback. People may also wonder whether their feedback will reach the right person and be considered.
Always dignify the customer’s effort with a response (automated or personal), even if you can’t use the suggestion. Follow up for clarification if needed; few people will object to showing interest.

Discouragement 
Don’t make me jump through hoops.
Companies frequently create obstacles to reduce contact volume, by burying the contact options many clicks deep, or requiring registration (people hate it), or forcing extensive categorization of the type of feedback, or asking for details that don’t make sense or are privacy sensitive.

26 October 2011

95: Text justification is UX

http://en.wikipedia.org/wiki/Justification_%28typesetting%29

"Definition" bubbles should be "Flush left, ragged right with a hanging bullet" --and not centered. Centered text is most appropriate on invitations and wedding announcements. Centered justification is hard to read and I should explain why.

The link above is pretty good. But left off one detail:

In English-speaking countries and countries using Latin characters, the eye looks for an invisible edge (at the left) to find the next line down upon returning from the end of a line. This is a readability issue: the pleasure or ease of reading.

Centered text destroys that edge finding capability. There is no straight edge.

Technologists seem to think "Justified (flush left and right)" --where both edges are forced to make invisible edge lines-- therefore must be even better. It was impossible before the computer age so it must be more advanced. Right? It makes for pretty type.

But humans prefer a "ragged-right" edge. It's helpful to maintaining a sense of location on the page for the eye. Thus, again, easier finding of the next line down. Justifying both edges (sameness) ruins our eye's sense of position. It takes more work to read --an unnecessary strain.

Just because you can do something doesn't mean you should. It's all UX in the end.

06 October 2011

94: How users really judge websites

Two studies were published showing an unexpected gap between how people say they judge Web sites and the criteria they actually use:

From Stanford University and Consumer Web Watch: "How Do People Evaluate A Web Site's Credibility? Results from a Large Study."

From Sliced Bread Design, LLC and Consumer Web Watch: PDF download "Experts vs. Online Consumers: A Comparative Credibility Study of Health and Finance Web Sites."

The studies asked Internet users to evaluate the credibility and quality of information they get from various websites. Even though visitors told researchers they looked at many different aspects of a Web site when deciding whether to trust its information, researchers were surprised to discover that visitors were more swayed by a site's design than anything else. Few people (if any) told researchers that they would trust a site more if it "looked good." However, that's exactly what researchers discovered after asking participants to evaluate a number of different websites.

Beau Brendler, director of Consumer Web Watch noted:
"While consumers say they judge on substance, these studies demonstrate that consumers judge on aesthetics, and get distracted by bells and whistles."

Visual design is the second test of a site's credibility. Speed is first.

"I would like to think that when people go on the Web they're very tough integrators of information, they compare sources, they think really hard," says Fogg, "but the truth of the matter--and I didn't want to find this in the research but it's very clear--is that people do judge a Web site by how it looks. That's the first test of the Web site. And if it doesn't look credible or it doesn't look like what they expect it to be, they go elsewhere. It doesn't get a second test. And it's not so different from other things in life. It's the way we judge automobiles and politicians. http://en.wikipedia.org/wiki/Stanford_Web_Credibility_Project

http://en.wikipedia.org/wiki/Persuasive_technology

05 October 2011

93: Improving User Satisfaction and Reducing Site Bounce Rate

I made a big advance in clarifying the barriers or hurdles preventing user satisfaction. The previous blog entry #92 describes some of that brain work. It's a work in progress. When these hurdles are removed or addressed, users have decreased bailout or bad bounce rate metrics.

The first hurdle is
OBSTRUCTION

This is load speed and image optimization. There are tools online for measuring and tweaking this. The benefit is not conscious to the visitor (transparency). No one notices a fast page --only slow ones.

Second hurdle is
DECORATION
Presently, UXers use interviews to evaluate this parameter. This is a body language judgment. It is not logical but emotional reaction and happens in the first 50 milliseconds. Visitors don't even need to use the site before making this judgment. It's purely visual --at-a-glance. If the reaction is negative, people will be tempted to bail out.

Third, web
FRICTION
Attention can be checked with compliance to readability standards (100%E2R) and hierarchy of design elements. But eye tracking tests already exist to assist. Scarcity of attention comes from user impatience and intolerance. There are online "eye tracking tests" that don't even require user feedback. A screengrab is submitted. Contrast and placement are then evaluated by machine based on how a human would react.

I propose each hurdle can be ranked, weighted, and summary score derived for overall site toxicity / quality rating. I've used a similar method for judging the quality of product names. The three hurdles are interactive and synergistic.

92: Prevent Toxic UX Poisonings

Reduce user disappointment, effort, and frustration with UX satisfaction.
UX Hurdles Reduce Web Toxicity

Build a user safe website with improved quality, efficiency, and economic longevity by monitoring three states for successful user experience.

State 1
Obstruction

If a website loads slower than 2 seconds, the speed biases users from that moment towards goodness-or-badness judgments. This is a proven fact called the halo effect. People hate slow websites. Slow site performace is considered rude.


Solutions
Remove usability barriers like browser incompatibility, horizontal scrolling, or slow page load (bloat). Optimize images and code.


State 2
Decoration

In 50 milliseconds, people evaluate if your site is attractive. This is before they click or read anything.

This is attractive use of color, white space and readability. It is the visceral feeling of being invited and seduced. The customer journey is obvious and requires no effort. Visual cues or signage produce a comfortable feeling the user is in the right place.

Solutions
Deliver the desired features and content. Demonstrate attention to details by reducing visual clutter. Promote consistent theme with color, balance, branding, type, and symbols that are harmonious and well designed. Examples include clear links with information scent, no requests for mysterious information, and recognizable calls to action. The positioning strategy is plain. Your users motives for seeking the site are quickly addressed.


State 3
Friction

Search efficiency is skimming or fixating on relevant headlines and subheads. Content is scanned first for value before investing serious reading time. Hotspot and eye tracking tests frequently address this area.


Solutions
Make reading comprehension effortless and convenient. Examples include good headlines and subheads, combining multi-step processes like forms, reduce system slowness, and eliminate or reduce annoyingly strict security requirements. Fast pacing created by removal of visual distractions or annoyances like animation.
Good value analysis reduces waste and streamlines the experience. No difficult language or jargon. No long-forms, broken links, or requests for odd information.



Testing with Cross-device helps you improve user satisfaction, brand affinity, and overall delight. This is described as seamlessness, flow, feeling, and transparency.

Like a canary-in-a-coal-mine, Cross-device is your website test for UX toxicity. 

04 October 2011

91: Responsive letter-spacing

http://pxtoem.com/

According to this link above 0.063em = 1 px.

letter-spacing: -0.063em;


This is good kerning for larger headline text.

"Style sheets become easier to maintain because all text set in EMs scale to the body font-size."

03 October 2011

90: Grayscale testing

Touching colors must have a minimum 30% grayscale differential (contrast) or the human eye struggles to find the edges. This retinal error can cause an optical effect known as popping. This color “secret” is not generally taught in design schools.

There is a so-so online grayscale test site:

http://graybit.com/

Try it. It doesn't always work on every site. I do my tests in Photoshop with screengrabs. No particular reason. Habit?

02 October 2011

89: Mobile Web vs Apps

http://seekingalpha.com/article/227332-mobile-apps-the-wave-of-the-past

QUOTATION / SUMMARY:
"Just like the PC, I expect the rise of a good mobile Web to topple the walled gardens while creating a platform agnostic environment that levels the playing field. In this scenario, the one with the biggest garden has the most to lose – Apple. The diminished importance of apps will reduce switching costs for consumers since they will simply need to log-in to Web sites rather than worrying about losing favorite applications in the transition to a new device. This would put price pressure on Apple and create an opportunity for others to take share."

01 October 2011

88: Placement of mobile UI components

http://en.wikipedia.org/wiki/Rule_of_thirds

http://www.colorzilla.com/gradient-editor/

http://en.wikipedia.org/wiki/Golden_ratio#Aesthetics

http://en.wikipedia.org/wiki/Headroom_%28photographic_framing%29

http://en.wikipedia.org/wiki/Lead_room

http://en.wikipedia.org/wiki/Golden_spiral

http://en.wikipedia.org/wiki/Golden_angle


87: Web typography and PDFs

There are a couple of special characters: the "en dash" and
"apostrophe". Small obsessive typography details I can't let go of. :) I
mention them only because most people never notice those consciously.

http://en.wikipedia.org/wiki/Letter_case

While you have serif links underlined and blue (default), this is unnecessary Spartan design --even primitive. People know what looks like a text link and what doesn't. That doesn't mean the default circumstance doesn't have value or merit. It does. The default is blatant and obvious linking when used. But there are things that are "wrong" with underlining and using colors that don't match the theme. Underlining cuts through character descenders. That reduces legibility. And poor theming is bad for credibility. So I recommend styling with CSS rollovers. Be creative. That's why they made CSS options available.

Watch the reverse type. It is not really "white". It's #dbdbdb on
#1c1c1c. This improves readability drastically onscreen. Try it and
compare to white-on-black for small type. Another subtly. Don't use it
on your navigation. You need pure white contrast there because the
gradient background isn't "solid color".

Serif is a screen default --it was defaulted-in for browsers for the wrong reasons way back decades ago. There was a reason but it proved to be a bad choice with time. It's not nearly as screen-readable as sans serif faces like the ubiquitous Verdana and Arial. Those fonts have interesting stories and histories but I won't go into it now. I'm not anti-serif. It just needs to be used properly and in the right places. Some other day I'll deliberate on all this "web typography". I've used Verdana here, a Humanist font. The fallback stack would be Verdana, Arial, Helvetica, then sans serif. (That is not the ideal stack.) Verdana is on 99% of browsers. Linux not so good but still high 67%. And iOS 100%. Bonus.

http://en.wikipedia.org/wiki/Verdana

There rarely is a benefit from images with baked-in built-type. I've learned that the hard way after spending too much of my work life in Photoshop building headlines.

PDF links need "editorialization". This is good web etiquette. Dropping users into a download without warning or cuing is bad UX. It can lock up their browser. Very irritating. Especially if they are on dialup --like many in our rural area.

PDFs can easily be reduced with a freeware PDF optimizer to a tenth that file size. This is bandwidth politeness most developers don't do for users. Apathy! Screen quality pages print just fine. Google on "freeware PDF optimizer". There's even one available for Ubuntu but I haven't used it. The Mac one is drag-and-drop. Brainless. Nice.

Optimizing PDFs is a subtle way to say, "we care." Host them on your server.