Info & Interaction Design

Mick McQuaid



How to Start?

Read the syllabus?

(eventually we’ll hafta, but it’s a boring way to start)

Go around the room saying our names?

(eventually we’ll hafta, but better if we’re energized)

Get the juices flowing!


I think it’s better to start with an exercise that reminds us of what we do, no matter how proficient we are at it.

I need to know something about you and this is a very revealing exercise.


  • Empathize
  • Define
  • Ideate
  • Prototype
  • Test

‹watch video›

Now do what they did!


  • three pages
  • some index cards (about 6)
  • some colored sharpies (at least 3)
  • a pen or pencil

Form Groups

  • first form a pair with someone like you
  • then form a group of four with a pair that identifies differently from you (gender, ethnicity, or other identity factors)
  • this gives you support (pair) and diversity (group of four)


  • Empathize (interview)
  • Define (list of needs)
  • Ideate (storyboard sheet)
  • Prototype (cards)


  • break into pairs so everyone gets a chance to be interviewer and interviewee
  • interview is about supporting new year’s resolutions
  • if you’re a trio go 2-on-1 or 1-on-2 either way

‹make a list of needs›

  • analyze the interview
  • be sure to think about what they meant, not just what they said
  • think about how you could have gotten more from the interview


  • draw four panels of cartoons on the ideate page
  • show a successful interaction with an app
  • don’t worry about the app details
  • concentrate on the user experience — what did the user feel?


  • now use the index cards
  • draw a few main app screens
  • focus on making it easy for the user
  • think about the circumstances of use


  • we’re skipping the test phase due to time constraints
  • but keep your cards so you can test later
  • it’s never too early to test
  • but testing is the focus of a different course

our focus: design

iterative cycle: design, prototype, evaluate

what did we learn?

  • give me your insights about each phase and write them in your sketchbook
  • phases were
    • empathize (interview)
    • define (list)
    • ideate (storyboard)
    • prototype (cards)





Cooper, Alan, Robert Reimann, David Cronin, and Christopher Noessel. 2014. About Face 4.0: The Essentials of Interaction Design. Indianapolis, IN: Wiley.
Dodson, Bert. 2006. Keys to Drawing with Imagination. Cincinnati, OH: North Light.
Holtzblatt, Karen, Jessamyn Burns Wendell, and Shelley Wood. 2005. Rapid Contextual Design: A How-to Guide to Key Techniques for User-Centered Design. San Francisco, CA: Morgan Kaufmann.
Pink, Daniel E. 2005. A Whole New Mind: Moving from the Information Age to the Conceptual Age. New York, NY: Riverhead Books.
Rogers, Yvonne, Helen Sharp, and Jennifer Preece. 2023. Interaction Design: Beyond Human-Computer Interaction. 6th ed. Hoboken, NJ: John Wiley & Sons.
Rosenfeld, Louis, Peter Morville, and Jorge Arango. 2015. Information Architecture: For the Web and Beyond. 4th ed. Sebastopol, CA: O’Reilly Media.



This slideshow was produced using quarto

Fonts are League Gothic and Lato