1. Community Event:

Usability Review of Indego Africa

Join us this month as we review the Indego Africa website. Indego Africa Project is a partnership between African communities and volunteers committed to alleviating poverty and chronic unemployment in Africa by providing reliable income, developing job skills, and affording access to export markets, with the goal of creating and supporting sustainable businesses.
In this session we will review the usability of non-profit websites including messaging, website strategy as well as tactics for fund-raising online.

• Date: Friday, May 2nd, 2008
• Time: 11:00 AM - 12:30 PM PST
• Venue: Online
• Cost: None. Please Register to attend the meeting

2. New Blog Article

“Forcing functions” - Interaction Design Technique, used but not widely understood.

Forcing functions help streamline, simplify or minimize how a user interacts with a design.
“Making a user do something an elegant way is far better than making a user do something a mediocre way and then offering them support as they fail and recover from the error.”

Best Wishes,
Frank Spillers, MS
Principal and Co-CEO
Experience Dynamics

ShareThis

1. Invite: Live Usability Review: Reputation Management online, April 9th Web Conference
2. Upcoming Seminars: Topics include Web Apps, Personas, AJAX
3. In the News: AJAX: All sizzle and no substance? Online users expect 24 hr turn-around time
4. New! T-shirts: Fun new t-shirts, add some usability fashion to your workplace (Viva Jakob! and more…)

DETAILS:

Portland UI-SIG: Usability Review of Reputation HQ

Wednesday, April 9th 2008 at 11:00 AM PST.
Open to all. No Charge or membership required.
Join us for this learning experience.

2. Upcoming Seminars:

Designing Usable Web Applications (Part 2)

Web Seminar: Tuesday, April 9th 2008 at 9:00 AM PST AND 4:00 PM PST

Personas Demystified: A 5 Part Series

Web Seminar: Begins Wednesday, April 2nd 2008 at 10:00 AM PST
Part 1: Complimentary

AJAX Usability: Improving User Interface Problems with New Display Techniques

Web Seminar: Tuesday, May 1st 2008 at 11:00 AM PST

3. In the news:

Software Development times: Interviews Frank Spillers on AJAX Usability- is it more trouble then it’s worth?

New Research: 24 hours is the expected response time to online inquires

7 Usability Guidelines for Websites on Mobile Devices

4. New! Usability T-shirts pre-order

• Viva Jakob! t-shirts featuring Jakob Nielsen >>
• Don’t Make me Think t-shirt >>
• Usability defined t-shirt >>

Best Wishes,
Frank Spillers, MS
Principal and Co-CEO
Experience Dynamics

ShareThis

Upcoming Seminars:

Do you make these mistakes in conducting your usability tests?

• Web Seminar: Thursday, March 13th, 2008 at 9:00 AM PST AND 6:00 PM PST

Part 2: How to design winning web applications

• Web Seminar: Thursday, March 13th, 2008 at 11:00 AM PST AND 4:00 PM PST

Part 1: How to design winning web applications

• Web Seminar: Thursday, March 25th, 2008 at 9:00 AM PST AND 4:00 PM PST

In the News…

How to outperform your competitors by a 10-to-1 margin:

A three - year study of more then 40 Fortune 500 companies by the research firm Peer Insight found that companies focused on customer-experience design outperformed the S&P 500 by a 10-to-1 margin from 2000 to 2005. (source: Fast Company, Oct. 2007)

VIEW ARTICLE >>

If one of your demographics is younger, does that make them tech-savvy?

Not by default - a new study shows. Our own studies confirm this.

VIEW ARTICLE >>

Best Wishes,
Frank Spillers, MS
Principal and Co-CEO
Experience Dynamics

ShareThis

Upcoming Seminar

Seminar: Designing Usable Web Applications (Part 2)

Are you translating these software mistakes into your web application? How well do users manage web applications and what confuses them most? The second in the series (follows content in Designing Usable Web Applications Part 1) this seminar focuses on specific Interaction Design techniques that will take you beyond a web or Information Architecture approach to building dashboards, customer log-ins or complex web application layouts.

If you missed Part 1, a recording and notes are available with Part 2 registration.

View the agenda >>

Latest Poster

The Usability of Web Applications poster

Our newest poster is ideal for team building, educating or evangelizing web application usability efforts.

View the Poster >>

Best Wishes,
Frank Spillers, MSPrincipal and Co-CEO
Experience Dynamics

ShareThis

New Seminar - Exclusive

Topic: Usability Testing Skills Refresher

If you are new to usability testing or you are familiar through informal learning, perhaps you missed a few crucial distinctions that can improve your facilitation skills and the quality of your tests. It’s time for a refresher!

• Tuesday, February 5th, 2008 at 9:00 AM PST

LEARN MORE >>

Blog Article:

5 Things you Should Never Say or Do to Users (during usability testing)

How you ask a question during usability testing can color your data. READ THE ARTICLE >>

In the News…

Ecommerce Sites with the highest level of satisfaction in 2007:

According to ForeSee and FGI (Dec. 27th, 2007):

• Netflix (86)
• Amazon (82)
• L.L. Bean (80)
• QVC (80)

READ FULL ARTICLE >> Best Wishes,Frank Spillers, MSPrincipal and Co-CEOExperience Dynamics

ShareThis

Navigation is subtle. It’s probably the most challenging aspect of usability design for most designers. For instance, just because you can use dynamic fly-out, pop-out or drop-down menus, does not mean users find them helpful.

Navigation assists at the unconscious level of interaction to help users find their way, mentally map your site, traverse sections and feel in control. Research shows that giving your users the ability to easily navigate your site impacts customer retention, perception of credibility and intention to return to a site.

Navigation provides the scaffolding that helps your users figure out:

• Where to go from the home page
• Where they are in the site if “deep linking” in from another site
• How to get from one area of the site to another
• How to find related information

How do you design intuitive navigation so your users know where to go next? How do you know what works and what doesn’t for your users? What is the best way to display a menu or design a navigation system? What area of the screen is the best, and how do you follow best practices?

To answer these questions we use three key techniques : 1) Previous insights into what has worked for users in our previous 300+ user studies; 2) Solid understanding of academic and industry research into navigation system design (Researcher beware- there is a lot of nonsense out there on this topic for example the idol worship given to “breadcrumb navigation” in the Information Architecture community); 3) Test with users and adhere to the Rules of Cognition on the web.

Our expert usability reviews can help you quickly determine if you are on track or not. Our usability design sessions and training can give you the tools to design usable navigation systems .

Our experience has shown that lack of attention to intuitive navigation is one of the single biggest design mistakes that can snowball out of control. We help you overcome the cognitive obstacles that underlie difficult navigation so that you can focus on what really counts to your users.

Our navigation system design work is results driven. We have seen ease of use in a design jump between 40% and 150% after our expert design consultation and recommendations.

Contact us and find out how we can help you improve your usability today.

ShareThis

The Web is changing fast. New standards are emerging, new approaches to coding such as Scriptaculous, AJAX, Ruby, Flash/Flex, Silverlight and others are creating a leap-frog situation where many new websites, web apps and portals are implementing next year’s User Interface elements.

Yet, when it comes to implementing the new interface techniques AJAX offers, we need to be mindful of how AJAX can improve the specifics of the user experience.

Two simple guidelines for AJAX Usability:

1) If the user has to ”play” with the interface control too much it is probably used inappropriately.

2) If the interface control does not follow the user’s task, it is probably used gratuitously.

1. When and where to use AJAX

a) When presenting complex features or functionality

b) When building a data set for the user

c) When presenting depth of information

d) To correct or intelligently help the user

a) When presenting complex features or functionality

EXAMPLE : Bluenile.com offers a complex ring configurator with advanced filtering and sorting functionality.

An AJAX interface allows users to hover over ring specifications.

Sliders help narrow the selection.

Note: Top to bottom sliders are novel and should be tested since they are less familiar UI elements on the Web.

b) When building a data set for the user…

EXAMPLE: Google Analytics offers Save to Dashboard and hidden report control features to give users more control over the analytics reporting experience.

 

c) When presenting depth of information

EXAMPLE: Finance.google.com offers pull sliders and instant click in their finance application to give users immediate data overlay feedback.

The end result is a quicker, more robust sense of interactivity with the market data.

 

 

d) To correct or intelligently help the user

EXAMPLE: Kayak.com uses a “just in time” help system to walk uses through AJAX filter features. The format is a contextual dynamic help system that utilizes a wizard metaphor (next/back).

This is a best practice and should be modeled.

2. Key Lessons: Google style AJAX; Yahoo! Style AJAX

• Create transparency with complex functionality
• Reinvent old experiences with AJAX elegance
• Leapfrog the competition
• Get known by your user experience
• Improve performance
• Revitalize the presentation layer

Create transparency with complex functionality Example: Yahoo! expanded the “social web” with a portal social networking approach. Yahoo!’s MyWeb for example, allows users to save search results, as well as share and discover bookmarks and interests. Yahoo! extends the search experience by adding social networking and social browsing with simple AJAX interactions and features.
Reinvent old experiences with AJAX elegance Example: Google Maps redefined the mapping user experience with AJAX. Characteristics included full screen, direct manipulation maps, with the ability to search listing or make a VoIP call from inside a floating dialog.

Leapfrog the competition Example: Google Docs has entered a new category of software as live service competing directly with Microsoft. Zoho.com has taken Google Docs a step further and is offering a full AJAX suite of productivity applications online.

Get known by your user experience Example: Yahoo! assumed industry leadership in photo sharing with its Flickr acquisition and is now a leader in AJAX user interface best practice. Flickr took the lead as a Web 2.0 best practice example (though Bubbleshare.com has a better experience it was not first to market).

Improve performance Example: Google’s Gmail improved the email user experience by creating an AJAX friendly email client. User experience improvements with AJAX included integrated presence (IM), threaded conversations and search among others.

Revitalize the presentation layer Example: Yahoo!’s email client made email and junk mail management easier by introducing desktop-like functionality with its new release of Yahoo! Mail. Yahoo! Travel has also revitalized travel planning with its AJAX powered social networking Trip Planner site.
3. How to design for progressive disclosure * contexts using AJAX.

a) Extend discoverability
b) Provide dynamic “smart” help
c) Give the user less “drill down”, more shallow navigation
d) Show related details or content

* Progressive disclosure is an interaction design technique that sequences information and actions across several screens in order to reduce feelings of overwhelm for the user. By disclosing information progressively, you reveal only the essentials and help the user manage the complexity of feature-rich sites or applications.

a) Extend discoverability >> make it ease for users to find stuff.

EXAMPLE: tripadvisor.com gives users a progressive disclosure of
links contained in a category with an opaque “click to expand” window.
The interface feature appears only once and gives way to an ‘accordion’
menu of the other 4 categories.

This is a novel, but potentially valuable device to orient users to further discover the contents of a page section.

 

 

b) Provide dynamic “smart” help >> give users better contextual help that provides in-line tutorial type information.

EXAMPLE: Kayak.com uses a “just in time” help system to walk users through AJAX filter features. The format is a contextual dynamic help system that utilizes a wizard metaphor (next/back).

This is a best practice and should be modeled.

 

c) Give the user less “drill down”, more shallow navigation >> make it easier to get to and from search results and the home page.

EXAMPLE: Patagonia.com lets users view contents of a product from the search results page in an AJAX dialog.

The move to viewing product details and acting from a pop-up window is not new, it is just back from having disappeared with html pop-ups a few years ago.

Extending the pop-up, AJAX offers more direct features from the page without page load/reload such as favorite, add to cart etc.

d) Show related details or content >> give users “just in time” content, controls and features .

EXAMPLE: CNN.com offers an accordion style menu selection with in-line tabs that users can change views (without page reload).

Note: Page tabs should not require page reloading. For a bad example see priceline.com search results “Sort by” tabs (pages reload and reposition users on the page).

4. Five questions you should ask when considering AJAX Question 1: Will using AJAX greatly improve the user experience with my site or web application?

Do not use AJAX if it does not enhance a strategic aspect of your user experience. AJAX pitfalls (browser incompatibility) can create technical and usability headaches for your JavaScript developers and your users. Be sure to test, refine code and re-test. Just because the AJAX element works on your browser, does not necessarily mean it will work on your users.

Question 2: What is the user experience strategy that compliments the AJAX deployment?

AJAX can be used to add sizzle but you should think of AJAX as a collective strategy used to improve a users ability to complete his or her tasks more effectively. AJAX is not the answer to every design problem and often times is inappropriate or irrelevant.

The excitement in a design is on “how can this improve the user’s task?” not “how can we Ajaxify this page to make it cool?”

Question 3: Will JavaScript gracefully degrade in browsers and is there an alternate if users browsers get stuck?

Support graceful degradation using JavaScript detect scripts and support JavaScript-free and mobile friendly versions. Try to keep AJAX to user interface elements that add value throughout the experience, but do not primarily require the technology to get through a website for example.

Question 4: Is there a real need to use AJAX or is it “just because”?

The technical pitfalls associated with AJAX require a disciplined use of JavaScript and AJAX. Think strategically about how AJAX can help the user on this page or that page. Do not take AJAX for granted as a user interface technique!

Assume users will not be familiar with the interface tricks AJAX offers, instead try to make everything transparent. For example, a plus button that opens up should have a “Details…” link beside it.
Question 5: Are you inventing completely new or reinventing problematic designs and how will you know if they work?

Good AJAX usability comes from testing your design with your target audience. Users rarely drink the cool-aid of new “whiz-bang” technologies or interface enhancements.

AJAX should be used in context of a users task and it should help remove the “work” traditionally associated with a browser fetching pages and handshaking with a database.

AJAX usability means that a user can do something on the screen that changes the display without waiting, with minimal effort and with a responsive and “just in time” interface.

Download this AJAX Usability Checklist :

Download ajax_usability_checklist_bonus_guide.pdf

Subscribe to Experience Dynamics usability Research Newsletter to be informed of seminars and research alerts.

Note: This
AJAX Usability Checklist accompanies the AJAX Usability seminar with Frank
Spillers, MS. Please refer to that presentation and recording for additional
examples, guidelines and for more context on designing for AJAX Usability.

Best Wishes,
Frank Spillers

ShareThis

Complimentary Report: AJAX Usability Checklist

• This AJAX Usability Checklist is a bonus guide that
  accompanies my AJAX Usability Seminar. I am offering
  it in the form of this post as a bonus for readers.
  Thanks for your support!

“The Web is changing fast. New standards are
emerging, new approaches to coding such as Scriptaculous, AJAX,
Ruby, Flash/Flex, Silverlight and others are creating a leap-frog
situation where many new websites, web apps and portals are
implementing next years User Interface elements.

Yet, when it comes to implementing the new interface techniques
AJAX offers, we need to be mindful of how AJAX can improve the
specifics of the user experience. . . . ”

Read the Full Post >>

Download the PDF of the report here >>

Happy Holidays & Best Wishes,
Frank Spillers, MS
Principal and Co-CEO
Experience Dynamics

ShareThis

1. Are you making the 3 biggest mistakes with AJAX you should never make? :

AJAX Usability: Improving user interface problems with new display techniques.

• November 7th, 9:00 AM PST (12:00 PM EST)
• Bonus: includes an AJAX Usability Checklist
• ONLY 12 Seats Left! REGISTER NOW

2. New Blog Article: What is Design? (Yes, all 10 definitions!)

When the term design is used it can mean many things, depending on who you are and which conversation you are having. Rarely do people stop to compare ‘mental maps’ and clarify which type of design they are talking about! … Read the full article

Best Wishes,

Frank Spillers,

MSPrincipal and Co-CEO

ShareThis

I believe this has to do with the multiple definitions of design and the lack of awareness of each specific type of design, its function and timing in a process. The other factor being how familiar you are with "design" based on your past experiences with different design roles.

Here are some examples of conversations I have and hear frequently that cause to stop and ask "What type of design are we talking here?":

• "We’ll take care of that when we get to design"
• "That’s something the designer will have to figure out…"
• "We’re starting design now…"
• "We’re bringing in a designer…"
• "Here are some early design concepts…"
• "This will be decided by the designer"
• "Have you started design yet?"
• "Why are these designs in Latin?"
• "The design looks great!"
• "This isn’t the final design, we’ll get to that later…"

Since the word "design" means many things to many people, let’s define design as seen from a usability consultant’s perspective.

Design for the Mind

Design that impacts cognitive processes (fit to the mind) including interpreting and understanding the experience.

#1 User Interface Design: Screen layout and design that focuses on user interactions and screen behaviors. User Interface (UI) design is an important component of user-centered and task-oriented design. The focus of UI Design is to improve the “user experience” or usability of the design. Since the mid 1980’s, UI design has refined an understanding of human behavior and screen design. Also called "GUI" design, often confused for combined design and programming ( see this post ). UI Design is often seen as symbolic of green-screen era interfaces or coding, since developers used to be UI Designers before it was recognized that this was a special skill set…   

#2 Information Architecture: Skeleton mock-ups or "wireframes" of screen interactions, layout, navigation and features. Used to review, concept and test initial functionality.  Information Architecture (IA) is officially unrecognized by academic institutions, because it overlaps too closely with the already existing field of UI Design above. Few realize that IA was invented for commercial purposes originally by Argus Associates in the late 90’s, (Rosenfeld & Morville, yes, the polar bear book guys) to promote consulting and book sales, as revealed by former employee Keith Instone at his ‘alphabet soup’ talk a few years ago in Portland, Oregon.

#3 Interaction Design: Focuses on how the user interacts with a page, application or product. Interaction design follows a task centered design approach ensuring the flow of the interaction as the central goal. Interaction design predates the Web world, and finds its roots in the wider field of Human Computer Interaction. Interaction design is a more general umbrella that many working on Web 2.0 interfaces and web applications prefer, since IA appears stuck in web-page centric paradigms.

Sanity check: Are the three design disciplines above different? Not really, their goals are all the same.

Design for the Heart

Design that impacts sensory processes (fit to the emotions) including the feelings and emotional or affective qualities of the experience.

#4 Graphic Design: The "eye-candy or look and feel". Graphic design is widely known and it’s similarity to UI Design in what is often called "visual design" by people like Luke W at Yahoo! (Luke is a graphic design by background but does great UI design and visual design today).

In a usability process, once wire-frames are finalized, they are graphically treated to enhance the interaction design with aesthetic flavor. Graphic design focuses on enhancing layout, buttons, colors, icons and branding elements. The focus of graphic design is to improve the “look and feel” or stylistic aspects of the design. Because graphic designers operate from the heart, they are often accused of producing "fluff". If you give a graphic designer user interface specifications, however, their results can be outstanding. I see it every day at Experience Dynamics in Portland .

#5 Interactive Design: This Art college degree type is largely a hybrid discipline that captures a little of everything. An Interactive Designer produces good Flash pieces, animation, graphic design and some database programming or HTML. At the heart an Interactive Designer is great at graphic design and has a sensitivity and sensibility for usability. I taught Interactive Designers at the Art Institute of Portland (Oregon USA) and I kept telling the school the course should be called "Interaction Design" not "Interactive Design" but they wouldn’t listen! My mistake.

#6 Emotion Design: Emotion design comes from the field of usability and product design. Emotion design is concerned with the specific social, environmental, personal and intimate qualities of user experience. Emotion design is a fringe discipline within the usability and user research communities that is gaining an "I told you so" voice with products like Apple’s iPhone creating so many "ooooh, ahhhhs" from customers. Emotion design is an approach that can inform the outcome of any of the design types. e.g. "This user is influenced by this perception, expectation, color, shape, feeling…"

Design for the Body

Design that impacts anthropomorphic processes (fit to the human body) including the social and physical contexts of the experience.

#7 Industrial Design: Physical products that we can all relate to…the most obvious– a mobile device. Like graphic design, industrial design is easy to spot in everyday experience. Physical product design has origins that can be found at any local history museum. Since the dawn of time, human civilization’s has been defined by its tool or artifact creation abilities. Physical products with "good design" are intuitive: they feel, sound, look and work elegantly. Good industrial designers have, for much of the 20th century, mastered physically many of the design types described above, creating an impressive history of design for the human body, senses, environment and mind in a way that transcends, evokes and transforms experiences the user performs with the product.

The final group below are methodologies and approaches encompassing the design techniques above. Let’s take a quick look at some of these approaches or methodologies that cross into the blurry line of "design".

Holistic approaches/ methodologies

#8 User Centered Design: The overall industry and ISO standard methodology and set of techniques that places the user at the center of the design. User-centered design (UCD) involves three key activities: User research; UI prototyping and Usability Testing. UCD is iterative by nature and has the most impact if conducted early on in a software, product or web development process. Its methods and techniques and general approach to design are proven from an ROI perspective and are widely accepted in industry, academia and in government sectors.

#9 User Experience Design: A relatively new term that updates the term and discipline of UCD or "usability engineering". User experience adding a more holistic element to the technique of designing the user experience (on web sites or web applications). User Experience or UX design I consider more an approach or umbrella of techniques or a general approach. It is not a type of design per say, as its practitioners will inevitably conduct UI design, IA or interaction design as the deliverable of the UX design approach.

#10 Experience Design: Experience design is often used as a short hand for User Experience Design, but is largely considered with what I call Environmental Design, or the design of the experience in retail or open space environments. Again, Experience Design is a general umbrella approach or methodology that penetrates all design decisions but with an experiential agenda.

"What will the customer experience as the do X?", must have been what the Starbucks experience designers were thinking…

Retail and public spaces can greatly benefit from improved loyalty (attachment feelings, comfort and personalization) and productivity (learning, exploring, browsing) studies have found. Experience Design makes use of the context, social and environmental phenomenon as well as the feelings, perceptions and intuitions of the user in that context.

In Summary: Perhaps at this point you can understand why understanding "design" can be so ambiguous at times. Now that we’re on the same page, if you hear "design" and you haven’t already had the "what design do you mean?" discussion with the person you are talking to, take a few minutes to level set and get on the same "design page".

Okay, I have to go, there’s an email from my designer that I am giving some designs to, based on our client review of designs that we are redesigning …;-)

Best Wishes,

Frank Spillers, MS

ShareThis