Today we learned about a simple and a complex way of doing usability testing.
Simple: ask a human to perform some tasks on your product, observe them, identify what gives them trouble. You can also ask them some questions along the way.
Complex: you take various measures of usability such as time on task, time performance, efficiency, etc. The slides below remind you of the types of metrics and the overall flow of a usability test. I highly recommend Measuring the User Experience for more-in depth information about why and how to collect each metric, and how to analyze and report data for each one.
We began with an overview of research and evaluation methods:
|Not yet learned
- task analysis
- keystroke level modeling
- usability testing
- comparative usability testing
- A/B testing
- multivariate testing
You haven’t done any formal evaluation yet on your early prototype. It’s time to do that! Here are next steps:
- Conduct a cognitive walkthrough on your existing prototype.
- Improve the prototype, but keep it low fidelity. This is prototype v.2
- Create a plan for user feedback and usability testing.
- Get some informal user feedback on v2
- Improve the prototype based on user feedback, and create a high-fidelity prototype v. 3 in Axure or Sketch.
- Conduct formal usability testing on prototype v. 3
- Provide recommendations for moving on from v.3 to working prototype (v.4)
- Document everything and write it up in the last part of the final project, the evaluation report.
We began class with guests who talked about the importance of Web accessibility and provided some tips for making websites accessible to people with disabilities:
- don’t rely on color alone to communicate meaning
- test your color scheme for contrast
- write meaningful alt text for images
- use structural elements for headings, lists, etc.
- do not turn off keyboard navigation
- use large click targets
- write meaningful link text
I cannot share their slides publicly, but you can find them on the CN under the daily plan for Class 22.
We then brought together various interface languages by understanding the underlying grammar of interface controls. The slides I showed in class are below.
- remember the types and controls and their definitions
- follow accepted patterns (speak the language you choose correctly)
The purpose of this class was to become aware of what we need to consider from a UX perspective when we’re planning a user experience that’s responsive – or even more, cross-channel.
Responsive design for the Web – means creating adaptable sites that serve different layout, navigation, and content hierarchy depending on the user’s device. This is done by querying the device first to get info about screen size, then serving the appropriate version.
Cross-channel UX – means creating integrated user experiences that span several channels (e.g. desktop, mobile, phone, in person).
Second, some strategic considerations:
- mobile first – content is the most important thing and you need to plan a hierarchy starting from mobile and expanding to the larger desktop version. This is done by prioritizing and labeling content.
- navigation – avoid very deep, complex hierarchies that can be hard to use on mobile
- information architecture – try to keep it consistent across channels and enable users to move seamlessly across channels
Here are some slides about what UX needs to consider when planning for responsive, prepared by a former TA:
- we learned about customer journey maps, or experience maps and practiced imagining one for a young family moving to Indianapolis, and how they would interact with various city agencies (water, parks) using a desktop portal, a mobile app, and in-person or physical interaction (e.g. unlocking gates to the park).
For more about cross-channel UX, I recommend the book Pervasive Information Architecture by Andrea Resmini. I have some excerpts from that book on the following slides:
These are huge topics and we barely scratched the surface, but that’s because, at the end of the day, it’s not mobile first, or cross-channel first… it’s users first! As long as you know the techniques of user-centered design and the philosophy, you can apply them to more complex situations such as responsive or cross-channel.
You read and practiced in class with 2 tools for bringing together the elements of visual style and presenting them to clients for feedback:
Please be sure to know the definition of each tool and what elements go into each one.
At the end of class, students will be able to:
- Apply content strategy thinking to specific problems
- Apply principles for writing for the web
- Define excise
- Identify examples of excise and propose solutions for removing excise
We first tried to walk a few minutes in the shoes of a content strategist for Purdue CGT and thought how we would go about it and what it would be like.
Then, we looked at several homepages of similar products (Zotero, Endnote, RefWorks, Papers, Mendeley) and identified the following strategies they use for writing effectively on the Web:
- Video (understandable without audio)
- Short plain description
- Use cases with screenshots
- Clear & visible call to action
- Where do I start? – CLEAR
- Pattern: icon, title, 3 lines of text
- Simple words, short sentences
- Shallow structure – don’t make users click too many times!
- Multiples headings
- Vary layout, background, alignments
- Minimalist color scheme
After you reviewed slides explaining the concept of excise and provided your own examples, you proceeded to think about how you would tell your story in your portfolio – and how you would write for people who don’t read.
At the end of class, students will be able to:
- Explain the purposes a good homepage needs to fulfill
- Analyze homepages and evaluate how they fulfill these purposes
To jog your memory, here are the slides we used in class: