Users are always RIGHT! Usability and Eyetracking to improve web sites

Similar documents
CUE-10: Moderation Page 1. Comparative Usability Evaluation 10. Moderation. Observing usability test moderators

Eyetracking Study: Kent State University Library. Janie Ralston

Product Development for Medical, Life Sciences, and Consumer Health

Usability Testing Essentials

Foundation Level Syllabus Usability Tester Sample Exam Answers

UX (USER EXPERIENCE) & A/B TESTING. January 2019

GRADY NEWSOURCE KATE DEVLIN, LEAH MOSS, ANDREA SKELLIE & ASHLEY PANTER

Usability Testing Methodology for the 2017 Economic Census Web Instrument

iinview Research First Click Analysis & Other User Metrics

Usability Report for Online Writing Portfolio

Based on the slides available at book.com. Graphical Design

Usability Testing, Cont.

The Science of Data Visualization

Usability Testing. November 14, 2016

The Complete Nonprofit Website Toolkit Fleshing Out an Accessible, Usable, Polished Website July 2013

Usability Testing: A tutorial and Case Study from the NASA Goddard Space Flight Center Library

How to Add Usability Testing to Your Evaluation Toolbox

Accessibility IMPORTANCE AND HOW-TO. Kai Raymer, Web and New Media

D I Y. Usability Testing

Example of Focus Group Discussion Guide (Caregiver)

UX Research. research methods overview. UX Research research methods overview. KP Ludwig John

Please be aware that not every step is necessary for your website, or it may be outside the scope of our agreed-upon deliverables.

SWEN 444 Human Centered Requirements and Design Project Breakdown

Evaluation Museum Eye tracking-study

..in a nutshell. credit: Chris Hundhausen Associate Professor, EECS Director, HELP Lab

Discovering Information through Summon:

VIDEO 1: WHY IS THE USER EXPERIENCE CRITICAL TO CONTEXTUAL MARKETING?

Web Evaluation Report Guidelines

Rapid Research. For 2.0 Development. Presented by Kelly Goto

UX Research. test scenarios. UX Research test scenarios. KP Ludwig John

Intro to User Journey Maps for Building Better Websites. Cornell Drupal Camp 2016

CS 160: Evaluation. Professor John Canny Spring /15/2006 1

Cengage Learning Opposing Viewpoints In Context Usability Test

UX, UI, Product Design

Foundation Level Syllabus Usability Tester Sample Exam

SWEN 444 Human Centered Requirements and Design Project Breakdown

UX Research. research methods overview. UX Research research methods overview. KP Ludwig John

ObservAnt Usability Testing Report

Digital Insight PUSHING YOUR SEO TO ITS LIMITS

Website Usability Study: The American Red Cross. Sarah Barth, Veronica McCoo, Katelyn McLimans, Alyssa Williams. University of Alabama

CPSC 444 Project Milestone III: Prototyping & Experiment Design Feb 6, 2018

NAU IRBNet Application

HCI: THE DESIGN PROCESS. Dr Kami Vaniea

Hyacinth Macaws for Seniors Survey Report

USER RESEARCH Website portfolio prototype

Wireframes for Testing and Design

Launch Store. University

assignment #9: usability study and website design

GETTING TO KNOW THE WEBINAR

Improving Government Websites and Surveys with Usability Testing

MVR 2.0 Quick Start Guide

CLIENT NAME. Origin Eight Optimize Your Digital Impact. Digital Impact Analysis Report

CONVERSION RATE OPTIMIZATION 101

Enter the site Title: Student Name s eportfolio Choose your Website Domain: Use a Subdomain of Weebly.com

CS 160: Evaluation. Outline. Outline. Iterative Design. Preparing for a User Test. User Test

Humanistic Multi-Factor Authentication (MFA) Why We Don't Use MFA

A Summer Reads Guide to Navigating egrants

EVALUATION OF PROTOTYPES USABILITY TESTING

E-COMMERCE HOMEPAGE UX DESIGN TIPS THESE TIPS WILL HELP YOU CREATE A USABLE E-COMMERCE WEBSITE AND TURN YOUR HOMEPAGE INTO A CONVERSION MAGNET

Zornitza Yovcheva Corné van Elzakker Barend Köbben. 3 rd Workshop on Usability of GI Ordnance Survey

Google Docs Tipsheet. ABEL Summer Institute 2009

Knight Quest An interactive map of Clarkson. by Derek Klatt and RB Johnson 11/29/12

Best Practices for. Membership Renewals

Student Guide. Ventura College D2L

Yahoo! Digits: A Design Driven to Provide Instant Data Driven Insights and its Use in User Experience Design

The Website. Teaching Thoughts. Usability Report. By Jon Morris

Choosing the Right Usability Tool (the right technique for the right problem)

Comparing Google Message Security and Leading Messaging Security Solutions

CLIENT ONBOARDING PLAN & SCRIPT

Usability Testing Methods An Overview

PNC.com, Weather.com & SouthWest.com. Usability Analysis. Tyler A. Steinke May 8, 2014 IMS 413

Memorandum Participants Method

CLIENT ONBOARDING PLAN & SCRIPT

Who we tested [Eight] participants, having the following profile characteristics, evaluated [product name].

Service Quotation. School Employees LC Credit Union ATTN: Neil Sommers 340 GRISWOLD ROAD ELYRIA, OHIO USA

USABILITY REPORT A REPORT OF USABILITY FINDINGS FOR OFF THE BEATEN PATH WEBSITE

Search. Smart. Getting. About

Website Questionnaire

10 Step Checklist for Your Next Website Redesign

Offered in Partnership with

CSc 238 Human Computer Interface Design Chapter 5 Designing the Product: Framework and Refinement. ABOUT FACE The Essentials of Interaction Design

Focus: Themes within Introduction and Context

Human-Computer Interaction IS4300

OUR SERVICES & PRICING SHEET

Usability Test Plan for Blogger Mobile Application

Baltimore Health and Mental Health Study Training Manual Page II - 1

Based on the slides available at book.com. Graphical Design

Usability Testing Report of College of Liberal Arts & Sciences (CLAS) Website

New user introduction to Attend

Usability Testing Report. Kate Meizner Kristen Droesch Alex Hagenah Jo Polanco. Pratt Institute

Consumers Energy Usability Testing Report

DRAFT. Approach 1: Emphasize evaluation/feedback with target users

The Ultimate YouTube SEO Guide: Tips & Tricks on How to Increase Views and Rankings for your Online Videos

Invisible environments: How to conduct qualitative research within digital spaces

Google My Business The Free Listing

Online Evaluation Tool: Dashboards and Reports

A short introduction to. designing user-friendly interfaces

Scientist: Andrew Storer

Are You Too Busy? Practical Tips For Better Time Management

In this white paper we want to look at seven basic principles that can help make your website be the best it can be.

Transcription:

Users are always RIGHT! Usability and Eyetracking to improve web sites Laura Ruel, Hugh Morton Distinguished Associate Professor School of Media and Journalism University of North Carolina at Chapel Hill

GoodWebDesign!=art

GoodWebDesign==usability

Usability is what really matters.

The most important thing about the web is that it is intended to be used.

Usability testing You can find 80 percent of the problems with 5 interviews.

Usability testing Step one: Design your study Obviously you cannot analyze your entire site, nor can you study all the actions that all types of users might perform.

Usability testing Step one: Design your study Decide on a category of users, define some tasks that they would do frequently, and choose four to five benchmark tasks to evaluate.

Usability testing Step one: Design your study Carefully select tasks to simulate what actual users of the site would do.

Usability testing Step one: Design your study Once you have your tasks, design the experiment. Consider questions such as: What types of demographic information relevant? What quantitative questions do you want to ask? What types of qualitative questions do you want to ask? When will you want users to think aloud? When do you want them explore silently? Will your record? Will you use a screen capture program?

Usability testing Step two: Create and finalize testing instrument: Script Informed consent Pre-experiment questionnaire Free observation checklist Tasks Post experiment questionnaire Post experiment interview questions Files for reference here.

Usability testing Step three: Gather data Carefully observe each session and take notes about the participants' interactions with the site.

Usability testing Step three: Gather data You should recruit at least five test subjects, but even three can provide some insight.

Usability testing Step three: Gather data Participants will need to read and sign an informed consent.

Usability testing Step three: Gather data A good outline to follow: Welcome, demographic/presurvey questions (5 min.)

Usability testing Step three: Gather data A good outline to follow: Free observation time (5-10 min.)

Usability testing Step three: Gather data A good outline to follow: Assigned tasks with and/or without think aloud protocol (5-10 min.)

Usability testing Step three: Gather data Ask yourself. Which tasks were performed successfully? How long did they take? Did participants make errors? What problems occurred? Did the participants have a conceptual model of the site? Was it correct?

Usability testing Step three: Post-task questionnaire One of your post-test questionnaires should gather subjective data, and should contain quantifiable inquiries.

Usability testing Step three: Gather data Post test discussion (5-10 min.) Take some time to talk with participants about the site in a more relaxed way. plan a few open-format These should elicit more overall, qualitative impressions of the site or app.

Usability testing Remember to be prepared Clearly, you should interact with the site yourself ahead of time to become familiar with its functionality, including functionality outside of what your tasks include. Understand recording tools you will use (Screencast-o-matic or Quicktime). Checklist of supplies needed,

Usability testing Step four: Analyze your data and make conclusions Inspect your data and determine what you ve learned. Compare survey data with task successes or failures. What does the posttest survey tell you?

Usability testing Step four: Analyze your data and make conclusions Look at descriptive statistics primarily; if you are able to, you should also look at appropriate inferential statistics (e.g., t- test).

Usability testing Step four: Analyze your data and apply other research findings. http://shouldiuseacarousel.com/

Use sliders or carousels? Only 1% of the people actually click on a slide, which almost always was the first slide; People simply ignore your slider, because it triggers banner blindness; They slow down your site, negatively impacting your SEO and conversion rate(!!); They don t always work well on mobile devices, They push your content down, which Google recently mentioned yet again is not smart; It dilutes your message, because suddenly there are multiple messages on your homepage.

But Ask the right questions: What value will a slider will add to your site? If you want a slider, you re now in a position to make it work better for you. Don t rely on your slider to produce conversions on their own. The fact that nearly every client finds sliders attractive suggests that people visiting your site also find sliders attractive. There is no simple yes/no answer to the question Should I have a slider on my site? http://makeyourselfvisible.com/internet-marketing/should-i-use-websiteslider/

design, usability and eyetracking

What is eyetracking?

Eyetracking equipment

Eyegaze video

Gaze plots

Hot spots or heatmaps 100 50 0

Why do this? Usability & design working together TASK: Find the calendar of things to do.

Why do this? Usability & design working together The calendar today. Eyetreacking and usability testing helped!

Editing and eyetracking editing, tightening

Editing and eyetracking

Editing and eyetracking

Editing and eyetracking

Editing and eyetracking

Choosing photos and eyetracking Online images get fixations if they: Relate to surrounding content Are clear Feature faces Feature real people Models denote ads, and are avoided Nielsen/Norman Study

Choosing photos and eyetracking

Choosing photos and eyetracking

Choosing photos and eyetracking

Choosing photos and eyetracking Finding trends. What do they tell us?

Choosing photos and eyetracking Finding trends. What do they tell us?

Thank you! Laura Ruel, lruel@unc.edu