Intro to Design and Usability

Overview:
We will cover typical user behavior, we'll talk about eyetracking and what it means, and we will start to look at information presentation. This will be another reading and user's point of view task week. There are three assignments, but all are fairly quick to do. Most of the linked articles are short, easy reading.

May include a short presentation on eyetracking and typical user behavior

User Behavior
There are quite a few short articles at Usability.gov on user behavior and how it should guide designers. It's a very good resource, written fairly accessibly, without ads, not focused on SEO, and not requiring a fee for content. I'm also including a number of links to short "alertbox" articles by Jakob Neilsen. Some of the former reference the latter. You'll notice a lot of repetition in how average user behavior is described. That's because there is a lot of predictability in typical user behavior. it's a good thing, because predictable behavior is easier to design for.

Designing to user behavior can improve the performance of any website⁶,even nonprofits and government sites. It can also increase your credibility⁵ in the eyes of the user, which will keep them on your site instead of going elsewhere for the same type of content.

Eyetracking - what is it? How does it apply to an "average" user? Eyetracking is a type of user behavior analysis that uses various methods for following where the user looks, and how long, on a given site. Typically, the user's eye tracks in an "F" pattern, or a "Z" pattern, depending on the content looked at, or what the user is looking for. The F Pattern actually applies to blocks of text content, not the overall layout, and this should be considered. See reading section 3 "Understanding Eye Tracking"

Assignment 1: read resource 1 (Designing for the Average User) and think of someone you may know, who might fit that general description, who you often help with computer or technology tasks. This person is your equivalent to an average user. What is their typical behavior when interacting with a website or UI? How would you build a site so that they did not need your help to navigate it? Discuss.

Assignment 2: go to http://www.yahoo.com/ and use markup http://markup.io/ to show what parts of the page caught your attention, show how you think you scanned the page, and show what you ignored. Example: http://markup.io/v/pqph6b7kv19e Post a link to your markup in the google group.

Resources:

http://experiencedynamics.blogs.com/site_search_usability/2006/04/designing_for_t.html
Eyetracking and Web Site Design at Usability.gov http://usability.gov/articles/newsletter/pubs/032010news.html
Eyetools: http://eyetools.com Understanding Eye Tracking blog series (all are short)
Impact of Aesthetics on Attitudes Towards Websites at Usability.gov http://usability.gov/articles/062009news.html
User Behavior and the "globalness" of Internet http://jcmc.indiana.edu/vol7/issue2/taiwan.html - dry, scholarly, but informative regarding languange and culture's impact on usability
Credibility at Usability.gov http://usability.gov/articles/102009news.html
ROI on increased usability http://www.useit.com/alertbox/government-nonprofit.html

Information Presentation

Now that we have looked at typical user behaviors, we need to apply that knowledege to how we present information. What we need to consider is how that behavior should guide our designs.

Eyetracking models can guide layouts
- Menus should be where they can be found easily
- links should be formatted in such a way that userd can recognize them and also use them as a navigational reference ("I've been there already, but not there.")
- Text content should have either the most important content at the top or a summary
Users want to get to content quickly without too many clicks or too much scrolling
Search should be easy to locate, and easy to use
Your site's reliability, professionalism and overall credibility in the eyes of your users are influenced by its design and usability
Most users dislike horizontal scrolling - it is considered "artsy" and many people still do not have an easy tool that allows it (this is something that works best in multitouch displays and is quite intutitive there, but is not yet well implemented in touchpads and is difficult in a standard mouse-keyboard-screen setup)
Stability of design and layout across all the pages of a site increase users' comfort level.

Assignment 3: Read the linked articles, and discuss:

Which points seemed most valuable to you?
Which points are things you had not thought of? Do they seem useful? Why or why not?

Resources:

http://www.experiencedynamics.com/science-usability/ui-style-guides Especially notable for mobile and tablet UI style guides (will also be in week 4 resources)
Organizing Content on Websites at Usability.gov http://usability.gov/articles/082009news.html
3 Design Layouts: Gutenberg Diagram, Z pattern and F pattern http://www.vanseodesign.com/web-design/3-design-layouts/
F Pttern Hotspots and Content Placement: http://www.blackartofwebpublishing.com/FPatternHotSpots

Comments

My average user indeed comes

Ms.Receptionitis

Wed, 2011-02-09 20:51

My average user indeed comes to me for help in various computer tasks such as navigating sites or retrieving pictures taken and stored in a digital camera. A new anything can be daunting and I, too, was once new to this, so I don't mind. Though my average user knows how to operate a digital camera, they always succomb to Walgreens or Wal-Mart to retrieve the photos. One reason I know they do this is because it's easier than having to learn how to fully operate something they already have growing doubts and opinions about. This is expected and, in regards to User Advocacy, should be acknowledged. However, their experiences are a bit different when it comes to interacting with a website - they are not intimidated, but rather excited. I remember the first time I attempted my best at explaining how to search for a vehicle on Craigslist. Though my average user had trouble reading the smaller fonts, they performed searches in steps and stuck with it until it became something familiar. Ultimately what I think helped them in getting adjusted was memory of where each link was, no matter what city or state, and the colors associated with them. If I were to build them a site, I think I would incorporate something of the same sort, (links and accompanying colors) but also, perhaps a constant reference/ help menu when they hovered over a new area with their mouse, and a translator, in case their browser didn't have that support.

link to this comment

Can you post this to the

B. Maura Townsend

Wed, 2011-02-09 20:54

Can you post this to the google group as well? The threaded discussion isn't really user-friendly here. Thanks!

Sure thing!

Wed, 2011-02-09 21:02

Intro to Design and Usability

Course Material

Week 3: User behavior week

Comments

My average user indeed comes

Can you post this to the

Sure thing!