responsive and user testing
MTM1532
Tiffany Tse
tset@algonquincollege.com
website of the day
What is responsive design?
Ethan Marcotte
Progressive Enhancement
M & M's Peanut
Peanut
HTML
Chocolate
CSS
candy coating
Javascript and Interactivity (CSS3)
Viewport vs. resolution
Viewport
The viewport for web design is defined as the rectangular area (measured in pixels) that is viewable on the screen.
We will often set the viewport to the device width; to ensure our pages are viewed at 100%
http://webdev-il.blogspot.ca/2011/04/mobile-web-design-viewport-size-vs.html
screen resolution
For many desktops/laptops the screen resolution is the same as the viewport; except with retina displays.
Media Queries
usability testing
Test often.
Test early.
Don't stress.
Focus Groups vs. Usability testing
Focus Group
-
Small group (5-8) sit around a table and react to ideas
and designs that are shown to them
-
Group process - much of the value comes from
group interactions/opinions
-
Good for getting a sampling of opinions and feelings
Usability test
-
One user at a time is shown something
-
Could be a web page, prototype, wire-frame or sketches
-
Asked to figure out what it is, or to do a typical task
Testing one person
is better than
Testing none.
It can be effective
Even if it is poorly done.
Because you will always learn something.
do not test to prove
or disprove something
Iterative process
Meaning you must do it over and over.
testing with no budget
Usability testing
3 to 4 users.
Traditional tests call for around 8 users.
Usability testing
1989 Jacob Nielsen wrote a paper
“Usability Engineering at a Discount”
He said you could achieve the same results with fewer users (5)
Problems
First three users are most likely to encounter all major problems.
Because we are testing more than once, we don't have to test as many people each time.
Pick Any Apple
-
Doesn’t much matter who you test
-
You just need people who know how to use the web,
or depending on the site your testing, the mobile web
-
If narrowing down to your target demographic
won’t reduce the number of tests you do, then go for it
Where do we test?
Who Should Test?
Observers?
What to test
"Get It" Testing
vs.
Key Task Testing
What to test
-
Usually you want someone to understand
your site before you ask them questions or tasks about it
-
Start with “Get It? “ Questions
Sample Test Session
Volunteer from the class.
Sample Test Session
-
Start with introductions
-
Make clear that you are testing the site, not them
-
Don’t worry about hurting our (company’s) feelings
-
Take notes (or record, if they’ll allow it)
-
Make sure to tell them that you may not be
able to answer their questions right away
- because of the test - since you are interested
in how people do when they don’t have someone beside them
Sample Test session
Start with background questions:
-
What do you do?
-
How many hours a week do you spend online?
-
How do you spend that time?
Sample Test Session
-
Reactions to the homepage
-
Look at this page, what do you think it is?
-
What strikes you about it?
-
What would you click/tap on first?
Sample Test Session
-
In a normal test, one person might say they love
the colours and another might hate them
-
If the user is not thinking aloud, remind them to do so
-
That way you can record or take notes about what they noticed
Sample Test Session
-
At this point, you might choose to throw
in some of the questions you have prepared
-
What do make of the slide show of images? Is it helpful?
Sample Test Session
Task oriented questions:
-
Can you think of something you
might want to get on a restaurant’s website?
-
Where would you normally be looking this up?
-
How would you get there on this site?
Review
Review your results right away
Triage (reviewing the problems)
Problem Solving (how do we fix them?)
Typical problems
Concept is a bit foggy
The words they are looking for don’t exist, you’ve called it something other than what they want to click on
Too much stuff going on
Typical problems
Ignore ‘kayak’ problems
Try not to fix problems by adding things
Take the little victories ( problems / solutions that were super obvious right away) and ( solutions that require little to no effort to change)
Zurb
Sign up for Solidify.
View Blackboard for further instructions.
Title
Responsive and user testing
By tset
Responsive and user testing
- 1,856