Archive | Lecture Summary RSS feed for this section

Spring’15 Class notes – Class 25: Reporting Usability Data

4 May

This class was focused on how to structure the usability report and how to report usability data.

First and foremost, figure out who your audience is for the report, what they would be looking for, and how to make it easy for them to find what they need in the report.

Other tips worth remembering:

  • present absolute numbers, not percentages, when you are dealing with small numbers of participants
  • pick the correct graph or chart to represent your data (we did an exercise in class where we discovered the stack bar graph)
  • enable quick and easy comparisons across tasks, but also present data for each task
  • remember to present and rank-order usability issues in a way that helps developers prioritize their work

Spring’15 Class notes: Class 24 – Usability testing

9 Apr

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.

Spring’15 Class notes: Class 23 – Evaluation part 1

7 Apr

We began with an overview of research and evaluation methods:


Experts Users
Learned heuristic evaluation

competitive analysis

contextual inquiry



focus groups


Not yet learned cognitive walkthrough
  • 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:

  1. Conduct a cognitive walkthrough on your existing prototype.
  2. Improve the prototype, but keep it low fidelity. This is prototype v.2
  3. Create a plan for user feedback and usability testing.
  4. Get some informal user feedback on v2
  5. Improve the prototype based on user feedback, and create a high-fidelity prototype v. 3 in Axure or Sketch.
  6. Conduct formal usability testing on prototype v. 3
  7. Provide recommendations for moving on from v.3 to working prototype (v.4)
  8. Document everything and write it up in the last part of the final project, the evaluation report.

Spring’15 Class notes: Class 22 – Web accessibility, Interface controls

2 Apr

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)

Spring’15 class notes: Class 21 – Responsive design & Cross-channel UX

31 Mar

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.

First, definitions:

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:

Third, tools:

  • 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.

Spring’15 class notes: Class 20 – Visual style & branding

31 Mar

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.

Spring’15 Class notes: Day 19 – Content & Writing; Excise

24 Mar

Learning Objectives:

At the end of class, students will be able to:

  1. Apply content strategy thinking to specific problems
  2. Apply principles for writing for the web
  3. Define excise
  4. 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.