Schedule
CSCI376: Human-Computer Interaction
Overview
Please see the appropriate sub-pages under Assignments for additional direction about Readings, Projects, and Assignments.
All course readings can also be found on Google Drive, accessible to Williams College accounts
Schedule (Readings, Assignments, Projects)
Papers not available in your Course Reading Packets are marked with an *asterisk. More instruction on what should be included in reading responses is on the Readings page. All readings, assignments, and projects are generally due the night before the class under which they are listed.
Week 1
Th 9/5 | Welcome! [slides]
HANDOUT: Honor Code Roleplay Scenarios
USEFUL: Sign-up for the Course Slack Group.
Week 2
Mo 9/9 | User-Centered Design + HCI History [slides]
QUIZ on Glow on the Syllabus by 11:59pm Sunday night.
READ “The Psychopathology of Everyday Things”, Ch.01, pp.1-36, in The Design of Everyday Things, by Norman.
SKIM “The Psychology of Everyday Actions”, Ch.02, pp.37-73, in The Design of Everyday Things, by Norman.
POST your response to both of the above Norman readings to the appropriate Slack channel (w02-ucd) by 11:59pm Sunday night and respond to at least one classmate's comment by class on Monday.
READ *"Learning to See" by iA Inc. https://ia.net/know-how/learning-to-see
DUE: Individual Good Design/Bad Design Assignment
Th 9/12| Brainstorming & Teamwork [slides]
HANDOUT: UCD Charette
READ Amy Ko "How to be Creative." http://faculty.washington.edu/ajko/books/design-methods/how-to-be-creative.html
READ Pausch. "Tips for Working Successfully in a Group." https://www.cs.cmu.edu/~pausch/Randy/tipoForGroups.html
POST to the appropriate Slack channel by the night before class: Think back to your previous experiences working in groups, particularly an experience that could have been improved.
Briefly describe the project and the group - don't use names! (e.g., two sentences).
What went poorly in this group (e.g., two sentences)?
From concepts discussed in these readings, what could have been done differently to improve the group experience (e.g., up to two paragraphs)?
Week 3
Mo 9/16 | Affordances, Controls, Interface Metaphors
NOTE: Class is at WCMA on this day.
HANDOUT: Fly on the Wall Observations
READ “Applying Affordances, Signifiers, and Constraints to Everyday Objects”, in Ch.04, pp.132-141, in The Design of Everyday Things, by Norman
READ “Controls” and “Non-Traditional Inputs”, Ch.07, pp.158-167, in Designing for Interaction, by Saffer
POST your response to both of the above Affordance, Controls, Interface Metaphors readings to the appropriate Slack channel by Sunday 11:59pm and respond to at least one classmate's comment by 11am on Monday.
Th 9/19 | Contextual Inquiry + Pitches [slides]
READ "Ch. 3 Principles of Contextual Inquiry", pp.41-66 in Contextual Design by Beyer and Holtzblatt.
POST to the appropriate Slack channel by the night before class: After completing the readings, consider how you might apply this approach to the project you've proposed.
Briefly, what is your proposal (e.g., two sentences).
Who and what might you propose to observe in a contextual inquiry (e.g., two sentences).
What focus might you bring to your CI observation, and why? (e.g., two or three sentences).
Identify a pitfall that seems likely during a CI (e.g., getting caught in abstractions) (e.g., two or three sentences).
Describe how you might avoid or attempt to correct for this pitfall in your contextual inquiry (e.g., two or three sentences).
Week 4
Mo 9/23| How To Critique [slides]
Bring laptops today! (at least half the class)
HANDOUT: Contextual Interview Feedback
HANDOUT: Brainstorm & Team Contracts
READ Karen Cheng. 2012. “How to Survive Critique: A Guide to Giving and Receiving Feedback” in ARCADE 30(3). http://arcadenw.org/article/how-to-survive-critique
READ Jon Kolko. 2011. “Endless Nights—Learning from Design Studio Critique.” In interactions 18(2), 80-81. http://dl.acm.org/citation.cfm?id=1925838
POST your response to both of the above Critique readings to the appropriate Slack channel by 11:59pm Sunday and respond to at least one classmate's comment by 11am on Monday. What makes a good critique? How do we avoid creating a bad critique?
DUE: Complete the Project Preferences Survey on Glow by 11:59pm on Sunday.
Th 9/26|Interviews [slides]
HANDOUT: Logo Critique Feedback
HANDOUT: I Like, I Wish, What If
READ “Interviews” (includes focus groups), Ch.7.4, pp.228-238, in Interaction Design, by Rogers, Sharpe, & Preece
READ Carter McNamara. “Basics of Conducting Interviews.” http://managementhelp.org/businessresearch/interviews.htm
Optional Jakob Nielsen. 1997. “The Use and Misuse of Focus Groups.” http://www.nngroup.com/articles/focus-groups/
Optional Bill Gaver, Tony Dunne, and Elena Pacenti. 1999. “Design: Cultural probes.” In interactions 6(1), 21-29.
POST your response to the above readings on methods to the appropriate Slack channel by 11:59pm Wednesday and respond to at least one classmate's comment by 11am on Thursday. How do interviews differ from contextual inquiries? What are 3 tips you would give to someone about to do a UX Research interview?
Week 5
Mo 9/30| Affinity Diagramming [slides]
BRING post-it notes to class!
HANDOUT: Name That Design Research Method
READ Affinity Diagram content from Contextual Design, by Beyer & Holtzblatt:
READ “The Affinity Diagram”, Ch.09, pp.154-163, in Contextual Design, by Beyer & Holtzblatt
READ “Walking the Affinity”, Ch.10, pp.201-202, in Contextual Design, by Beyer & Holtzblatt
READ “Walking the Data”, Ch.13, pp.275-276, in Contextual Design, by Beyer & Holtzblatt
POST your response to the above readings on affinity diagramming to the appropriate Slack channel by 10am day of class. How might this method be useful in your project? What can this method reveal for your project, what can it not help with?
DUE: Contextual Inquiry Check-In (i.e., one CI + reflection)
Th 10/3 | User Personas & Scenarios [slides]
HANDOUT: Contextual Inquiry POINT Critique
READ Defining the Problem content from Interaction Design, by Rogers, Sharpe, & Preece:
READ “Establishing Requirements”, Ch.10.1-10.3, pp.352-363, in Interaction Design, by Rogers, Sharpe, & Preece
READ “Task Description”, Ch.10.6, pp.373-383, in Interaction Design, by Rogers, Sharpe, & Preece
READ “Using Scenarios in Design” & “Generating Storyboards from Scenarios”, Ch.11.5-11.6, pp.415-420, in Interaction Design, by Rogers, Sharpe, & Preece
READ John Pruitt and Jonathan Grudin. 2003. “Personas: practice and theory.” In Proceedings of the 2003 conference on Designing for user experiences. ACM, New York, NY, USA, 1-15.
POST your response to the above readings on user personas and scenarios to the appropriate Slack channel by10am day of class. (1) Why do you think personas are contentious in UXR? (2) How can you tell if a scenario is too specific, or not specific enough?
DUE: Team Check-in 1
Week 6
Mo 10/7 | Storyboarding & Video Sketches [slides]
READ Colville-Hyde (2016). UX Comics: Visually Communicating User Experiences. (original link might be easier to read).
READ “Snapshots in Time: The Visual Narrative”, Ch.04 in Sketching User Experiences: The Workbook, by Greenberg et al.
Optional: *Truong et al (2006). "Storyboarding: An Empirical Determination of Best Practices and Effective Guidelines," in ACM SIGCHI Conference on Designing Interactive Systems (DIS).
WATCH at least one video sketch from each of the following groupings (i.e., 10 videos at a minimum):
Technique: Mackay-StopAction (and then watch a tiny bit of Mackay-Result to see what the final version looks like!)
Low-level Techniques (timing): MS Surface document interaction, MS Surface Context Lens
Using Projectors and Simple Props: Buddy Map
Pace and Scene Relevance: Consumester
Split Presentation, Simple Effects: PickUp
Still-Frame, More Effects: Graffiti Karma
Scenario with a Contrast: ParkSmart
Playful while Keeping Pace: Plantr
High-level Visions: StarFire (1994), KnowledgeNavigator (1987), A Day Made of Glass (2011)
POST After viewing and considering these video examples, think about what approaches were more or less effective.
In one paragraph, describe a technique you saw in these examples that was highly effective (i.e., in either storyboarding or video prototyping, in the readings or the videos), which you might therefore want to apply in your storyboarding or video prototyping. Be specific, such that it is clear you considered the examples. Discuss why it was effective.
In another paragraph, describe a technique you saw that was ineffective (i.e., in either storyboarding or video prototyping, in the readings or the videos), which you might therefore want to be mindful of in your storyboarding or video prototyping. Be specific, such that it is clear you considered the examples. Discuss why it was ineffective.
These examples thus support your reflection on how to effectively convey a design. Techniques in these and other examples will also directly apply as you prepare your storyboards and video prototypes. How do storyboards and video sketches provide different insights?
DUE: Project Task Review
Th 10/10 | Information Architecture, Wireframing: Techniques and Tools [slides]
HANDOUT: Mid-Semester Evaluations
HANDOUT: Design Check-in Critique
READ “Conceptual Design: Moving from Requirements to First Design” & “Physical Design: Getting Concrete”, Ch.11.3-11.4, pp.400-415, in Interaction Design, by Rogers, Sharpe, & Preece
READ “Task Flows”, “Use Cases”, “Mood Boards”, and “Wireframes”, Ch.07, pp.147-155, in Designing for Interaction, by Saffer.
READ Elaine McVicar. 2012. “Designing for Mobile, Part I: Information Architecture.” In UX Booth. http://www.uxbooth.com/articles/designing-for-mobile-part-1-information-architecture/ (Part 2 and Part 3 are optional and may be relevant to some of your projects)
POST your response to the above readings on information architectures, etc. on the appropriate Slack channel by 10am day of class. List three concepts that will be useful in your project design and describe why you chose them.
Week 7
Mo 10/14 | Reading Period - No Class!
Th 10/17 | Low-Fidelity Prototyping, Paper Prototyping [slides]
HANDOUT: Design Review Critique
READ Marc Rettig. 1994. “Prototyping for Tiny Fingers.” Commun. ACM 37, 4 (April 1994), 21-27.
READ Carolyn Snyder, "Making a Paper Prototype", Ch. 4, pp. 69-95, in Paper Prototyping.
POST your response to the above readings on paper prototyping, etc. on the appropriate Slack channel by 10am day of class. Provide a description of a specific idea or thought you might be able to apply in your paper prototyping:
Describe why this idea is non-obvious or how it will help ensure good results for your paper prototyping.
Describe what in the readings gave you this idea.
Your thoughts here should be specific. You are already required to do a paper prototype with usability testing, so that is obviously too high-level for this reading. Convey a specific idea that indicates you did the reading and thought about how to apply it in the context of your project.
This reading thus serves to get you thinking about these methods in the context of your project. What actual techniques your team applies will depend on your larger decisions as a team. This reading is not intended to require that you actually apply the ideas you individually develop here.
Week 8
Mo 10/21 | Graphic Design | Iris is at the IEEE INFO VIS Conference - No class! [slides]
Open Project Time!
READ “Layout and Color on Small Screens”, Ch.08, pp.140-156, in Designing for Small Screens, by Studio 7.5
READ “Getting Started”, pp.9-20, in Layout Essentials : 100 Design Principles for Using Grids, by Tondreau
Optional *“Color”, pp.71-83, in Graphic Design: The New Basics, by Lupton & Philips (this reading is in your packet, but it's printed in black & white :'(
READ vanseo design. "4 Types of Grids And When Each Works Best." http://vanseodesign.com/web-design/grid-types/
Optional: Tuck. 2010. “Gestalt Principles Applied to Design.” In Six Revisions.
Optional: Chapman. 2010. “Color Theory for Designers: Part 1: The Meaning of Color.” In Smashing Magazine.
Optional: Rye. 2012. “Color Code: What Color is ‘Brave’?” In AIGA.
Optional: Dean. 2008. “A Guide to Web Typography”. In I Love Typography.
Optional: Dean. 2008. “On Choosing Type”. In I Love Typography.
Optional: Dean. 2008. “eXtreme Type Terminology: Part 3: The ‘Black Art’”. In I Love Typography.
POST your response to the above readings on graphic design for user interfaces on the appropriate Slack channel by 10am day of class. What are two surprising concepts you learned in the above readings? How might you apply them to your group project?
DUE QUIZ on Glow (on the below readings+above slides). Open notes, no collaborating. Low stakes.
Th 10/24 | HCI Research | Iris is at the IEEE INFO VIS Conference - No class!
Open Project Time!
READ: You'll need to find & read a paper for your research paper report!
Week 9
Mo 10/28 | UX Research Presentations [slides][presentations]
READ: Review your notes on low-fidelity prototyping
WATCH Only the first 10 minutes of Nielsen Norman Group. Paper Prototyping: A How-To Video.
POST what's your number one take-away from the paper prototyping video? How does this differ from your thoughts about the paper prototyping readings from 10/17?
DUE: User Experience Research Project Overview + Presentations
Th 10/31 | Heuristic Evaluation [slides]
BRING your paper prototypes to class!
HANDOUT: Heuristic Evaluation Forms
READING: There are 10 Usability Heuristics. Assign each member of your team to read (and be experts in) 2-4 of the heuristics. Assign one group member to be an expert in heuristics from sections 5.1 & 5.2 (14 pages); another team member to sections 5.3, 5.4, 5.5, 5.6, & 5.7 (15 pages); and the last teammate to sections 5.8, 5.9, 5.10 (14 pages). The Heuristics are split by sub-section in Chapter 5 of: Jakob Nielsen "Usability Heuristics" Ch. 5, pp. 115-164, in Usability Engineering
READING: Everyone should read 5.11 "Heuristic Evaluation" from the above usability heuristics reading.
POST to the appropriate Slack channel by 10am day of class: Name each of your assigned heuristics, and provide a one line summary of each. For 2 of your heuristics provide a link to a website that does this heuristic well or poorly, and explain.
Week 10
Mo 11/4 | Usability Testing [slides]
BRING your paper prototypes to class!
HANDOUT: Cognitive Walk-through
READ Carolyn Snyder, Ch. 8 "Introduction to Usability Test Facilitation", pp. 171-195, in Paper Prototyping.
READ Kathleen Gomoll (1990). "Some techniques for observing users." pp. 85-90, The Art of Human-Computer Interface Design.
WATCH from 9:55 onward of Nielsen Norman Group. Paper Prototyping: A How-To Video.
POST to the appropriate Slack channel by 10am day of class: what challenges do you anticipate encountering during usability testing of your paper prototype? How might you reduce/avoid those obstacles?
DUE Heuristic Evaluation (mostly done in class, 10/31)
Th 11/7 | Accessibility [slides]
BRING laptops to class! (at least half the class)
READ Theofanos & Redish. 2003. "Guidelines for accessible and usable web sites: Observing users who work with screen readers." Interactions, 10(6). http://redish.net/images/stories/PDF/InteractionsPaperAuthorsVer.pdf
READ Smyk. 2017. "Design With Accessibility in Mind: The POUR Methodology" on Adobe. https://theblog.adobe.com/design-with-accessibility-in-mind-the-pour-methodology/
READ Pun. 2016. "Dos and don'ts of designing for accessibility" on Gov.uk.
Optional *"The Principles of Universal Design."
POST to the appropriate Slack channel by 10am day of class: First, identify one way in which your group could make your project accessible to a wider audience of users. Second, identify one way in which you could make your project website accessible to a wider audience of users. Be sure to include explicit references to the readings.
Week 11
Mo 11/11 | High-Fidelity Prototyping, Techniques, and Tools [slides]
BRING laptops to class! (one per group)
READ “Design, Prototyping, and Construction”, Ch.11.1-11.2, pp.389-400, in Interaction Design, by Rogers, Sharpe, & Preece
Optional Lyndon Cerejo. 2010. “Design Better and Faster with Interactive Prototyping.” In Smashing Magazine. http://www.smashingmagazine.com/2010/06/design-better-faster-with-rapid-prototyping/
WATCH Balsamiq. "Balsamiq Mockups 3 Application Overview." Video.
Optional Balsamiq. "Balsamiq Mockups 3 Application Overview."
WATCH InVision. "How to create an interactive prototype with InVision." Video.
WATCH InVision. "Welcome to InVision Studio." Video.
Optional InVision. "Getting Started with InVision." (in-depth tutorial!)
POST to the appropriate Slack channel by 10am day of class: How might click-through wireframing tools like Balsamiq & InVision assist in the high-fidelity prototyping phase? Which software would you prefer to use and why? Be sure to include explicit references to the readings/videos.
Th 11/14 | UX Research Methods [slides]
READ Rohrer. 2014. "When to Use Which User-Experience Research Methods," in Nielsen Norman Group.
READ Hanington & Martin. 2012. Universal Methods of Design: 100 Ways to Research Complex Problems, Develop Innovative Ideas, and Design Effective Solutions:: *01 A/B Testing and *10 Card Sorting.
SKIM these design methods from *Universal Methods of Design: 100 Ways to Research Complex Problems, Develop Innovative Ideas, and Design Effective Solutions (available via e-access or physical copy at the Schow Library).
POST to the appropriate Slack channel by 10am day of class about how/why two new methods you haven't yet used may have been (or could still be) informative in your project research and design. Pick two methods we haven't mentioned in class/readings yet! (i.e., 2 methods other than {participatory design, A/B testing, card sorting, and methods we used in our projects} - find new methods you'd be interested in trying!)
Week 12
Mo 11/18 | Design Patterns & UXD Project Presentations [slides] [presentations]
READ *Vlahovic. 2018. "Becoming a UX researcher: my experience and things I’ve learned along the way." Medium.
SKIM these design patterns, starting with *Chapter 2: Jenifer Tidwell. 2011. "Designing Interfaces."
POST to the appropriate Slack channel by 10am day of class about how one of these patterns, or a pattern you find elsewhere, may be relevant in your project design, by the night before class. Specifically:
Briefly, what pattern did you identify as relevant (e.g., by name and page number from Designing Interfaces, by URL).
Describe why this pattern is relevant in your design.
Describe how you might modify your design or your design process based on insights on perspective surfaced by the pattern. (e.g., describes changes in text, before / after images).
Th 11/21 | Computer Ethics [slides]
HANDOUT: Therac-25 Analysis
DUE: work on your TWO deliverables (website + video) due Monday!!
POST to the appropriate Slack channel by 10am day of class: Imagine you are an in-house AECL software developer at the time AECL submitted its first corrective action plan (CAP). Does implementing the CAP solve the problem? Propose a solution that works for AECL and its customers and that can be “sold” inside AECL as a feasible approach. What additional information would be helpful to have?
READ *Huff & Brown. 2004. "A Case Study of the Therac-25," in Using History to Teach Computer Science and Related Disciplines.
READ *Section 1: General Ethical Principles of the Association for Computing Machinery (ACM).
Optional (1992-2018 Code of Ethics): *"General Moral Imperatives" and "More Specific Professional Responsibilities" from the ACM Code of Ethics and Professional Conduct.
Optional additional readings on Computer Ethics topics.
Optional *AirInter Flight 148 Mode Awareness Design Flaw: FAA Accident Overview.
Optional *Ariane 5 Rocket Explosion: Gleick. 1996. "A Bug and a Crash: Sometimes a Bug is More Than a Nuisance," in The New York Times or Official Accident Report.
Optional *Arnold. 2000. "The Patriot Missile Failure." or GAO Official Report.
Week 13
Mo 11/25 | HCI Ethics [slides]
* None of the HCI Ethics Readings are included in your Reading Packets! *
If you cannot gain access to any of the following articles, PDFs are posted to GLOW and Google Drive (readings > ethics > ethics-....pdf).
READ any one of the following articles on Deception:
Angwin et al. 2016. "Machine Bias: There’s software used across the country to predict future criminals. And it’s biased against blacks" in ProPublica.
Dwoskin & Romm. 2018. "Facebook’s rules for accessing user data lured more than just Cambridge Analytica," in The Washington Post.
Goel. 2014. "Facebook Tinkers With Users’ Emotions in News Feed Experiment, Stirring Outcry" in The New York Times.
Rudder. 2014. "We Experiment on Human Beings (and so does everybody else)" on Medium.
Shane & Wakabayashi. 2018. "'The Business of War': Google Employees Protest Work for the Pentagon" in The New York Times.
Isaac. 2017. "How Uber Deceives the Authorities Worldwide" in The New York Times.
Lecher. 2018. "What Happens When an Algorithm Cuts Your Health Care" in The Verge.
READ any one of the following articles on Publicizing Personally Identifiable Information:
READ any one of the following articles on Workers in the Gig Economy:
READ any one of the following articles on Casualties of the Sharing Economy:
Peck & Maldonado. 2017. "How Airbnb is Pushing Locals Out of New Orleans' Coolest Neighborhoods," in HuffPost.
Siddiqui & Laris. 2018. "Self-driving Uber Vehicle Strikes and Kills Pedestrian," in The Washington Post.
Theibault-Spiker et al. 2018. "Towards a Geographic Understanding of the Sharing Economy: Systemic Biases in UberX and TaskRabbit" in ACM Transactions in Computer-Human Interaction.
READ Harvard Humanitarian Initiative. The Signal Code: A Human Rights Approach to Information During Crisis, pp. 10-19.
POST to the appropriate Slack channel by 10am day of class: List which 5 articles you chose to read and provide a brief ~2 sentence summary for each. Then, provide a higher-level reflection: Why were these ethics violations allowed to occur? Who's responsible? How can a computer scientist, such as yourself, prevent this from continuing or happening again?
Be prepared to summarize & discuss your selected readings in class.
Optional additional readings on a variety of Computing Ethics topics:
Optional Makinen. 2015. "China Prepares to Rank Its Citizens on Social Credit," in the LA Times.
Optional Angwin & Parris. 2016. "Facebook Lets Advertisers Exclude Users by Race," in ProPublica.
Optional Gross. 2013. "Snapchat: Sexting Tool, or the Next Instagram?" on CNN.
Optional Grossman. 2016. "Inside Apple CEO Tim Cook's Fight with the FBI," on Time.
Optional Sanders. 2017. "How The Media Are Using Encryption Tools To Collect Anonymous Tips," on NPR.
Optional O'Neil. 2016. Weapons of Math Destruction: How Big Data Increases Inequality and Threatens Democracy.
Optional Eubanks. 2018. Automating Inequality: How High-Tech Tools Profile, Police, and Punish the Poor.
Optional Fiveash. 2016. "Why Google's Monopoly Abuse Case in Europe Will Run and Run," in arsTechnica.
Optional 2002. "Supreme Court Strikes Down Ban on 'Virtual Child Porn,'" on CNN.
Thanksgiving Break
Week 14: Project Week
Mo 12/2 | Design Manifestos / Project Critiques [slides]
BRING: A laptop or smart phone for SCS Evaluations
One day to get a critique on any part of your project you feel could use more feedback.
READ "How to Write for Medium" by Lantz
Browse some examples of Medium posts:
"What Makes Software Good?" by Bostock
"What Makes an Article Popular on Medium?" from Medium
"How to Pitch a Project" by Monteiro
"Why most redesigns fail" by Rawat
"Participatory Design: What it is, and what makes it so great" by Anic
"What Prevents Good Cybersecurity and Privacy Behaviors?" by Das
"Value Sensitive Algorithm Design: Method, Case Study and Lessons" by Zhu
"Tenured Professor Rogers Talks About: Imposter Syndrome" by Fiesler
"Best HCI graduate programs in the US" by Xiao
"The Jobs I Didn't See" by Peck
Th 12/5| Final Project Pitches [slides]
Disclaimer
This schedule is subject to change at the discretion of the faculty. Students will be notified of such changes ahead of time via email.