Creating a Flipped HCI Course to Encourage Design, Experimentation, and Communication
I am an Assistant Professor of Computer Science at Bucknell University. Please let me know if you end up using some of this material (feel free to!) — I’d love to keep track!
Why do I teach Human-Computer Interaction?
I found myself reflecting on this question after I had developed an HCI course for the first time in Spring 2016. I taught using a common model for an HCI course —there are a lot of lectures, a number of labs/activities, and a semester-long project that runs in parallel with the course material. My students were reasonably happy and I received good teaching evaluations.
But I wasn’t happy. So I tore it down and started from scratch. For a quick overview, check out my website and syllabus.
Why I rebooted something that already worked ‘good enough’:
- My heavily-weighted, semester-long project nudged students to be safe and conservative. They were conservative in the problems they chose and conservative in the solutions they generated. My students are brilliant and creative, but by anchoring so much of my grade on that project, I incentivized them away from risk-taking. Ugh.
- I preached process, but outcomes were based too much on product. Students didn’t receive enough practice in each design stage. They also didn’t learn how to generalize it enough to new contexts. My project meant they had one significant shot at each stage, with little opportunity to learn from their mistakes. Ugh.
- My focus on a big project meant that the design process was constrained to one problem, one modality. Since students began their project early in the semester, many picked mobile — a modality they were familiar with…. but that decision constrained their time to explore other modalities later in the semester. HCI is a diverse and exciting field. I didn’t like that their exposure to that diversity was almost entirely limited to my talking instead of their doing. Ugh.
Goals in my redesign:
- Encouraging ambition + creativity. Students have the rest of their lives to be boring. My course should be where they take a shot at something special.
- Emphasizing process over product. I didn’t like that students’ design experience was so heavily biased by a single run through a single modality. Like any process, design takes deliberate practice in multiple contexts for it to really sink in.
- Highlighting the breadth of HCI. While this was partially accomplished through lecture last time… what fun is it just talking about 3D user interfaces or affective computing?
Structure: From Project to Modules
The first thing I did was throw away the semester long project. Instead, I built 2-week long design sprints — each that focused on a different modality and different design goal.
- It forced students to apply the same human-centered design process to a variety of contexts. (Visual Design, Chat-bots, VR, 3D user interfaces, etc.)
- I anchored each module on a lofty goal (Design for Tension, Design for Wellbeing) that maintained space to explore, but nudged projects towards more ambitious outcomes.
- Many design modules reduced the stakes of any individual project, encouraged risk-taking, and limited the potential for group drama.
For each project, students rapidly moved through the entire human-centered design process — ideation, prototyping, formative user testing, and implementation. Diversity in tech, diversity in process, diversity in application. I’ve included the instructions for each of these modules below, alongside an example of student output.
Design for Others: Visual Design + Sketching with InVision
Design for Understanding: Data Visualization + Communication with Vega and P5js
Design for Tension: Conversational Interfaces (Chat Bots) with Talkbot.io
Design for Fun: 3D UI with Leap Motions
Design for Wellbeing: Affective Computing + Intelligent User Interfaces
- Design for Another World: VR with aFrame and Google Cardboard
What worked: The output was fantastic. The projects were more creative and better reasoned than before. I am more confident in my students’ ability to apply the design process to other contexts than I was in the past. Big win.
What could be better: Unfortunately, I jammed one too many modules into semester. The pacing was frenetic and provided little time for reflection and refinement. The next time around, I’ll remove one of these modules to give the remaining ones a bit more breathing room.
Process over Product
The most important outcome of my course is that students are able to have a positive impact after their time with me.
- Can you apply a design process to new contexts?
- Can you apply known design principles?
- Can you communicate your design decisions to stakeholders?
You may have noticed above that rather than turn in code, my students turned in a design document. That document communicated the process and principles that they applied to their design. At the end of the semester, students also created a design portfolio and manifesto that synthesized their work throughout their design modules.
As you can see from my rubric below, implementation was only one, small component of their overall grade. This reweighing of priorities allowed me to:
- Assess more on process than product. A brilliant app without any design justification could still fail. An ambitious app that flamed out could still receive a high mark.
- Emphasize communication of design — a critical, but often over-looked quality that is necessary if we want to create impactful designers.
- Make sure that students were aligning their design with research-driven design principles (don’t reinvent the wheel!)
What worked: The quality of work jumped dramatically from the previous semester. You can see a larger curated list of my students’ work here:
Since videos/images are likely to last longer than their prototypes, this approach also provided students with a concrete artifact that they can feel proud about sharing more broadly. Take a look at a couple of the design portfolios that were generated by my students. They’re awesome.
What could be better: I’d like to tweak the rubric to better reflect my grading habits. Next time around, I’ll break Reflection Content into two dimensions: Design Process and Design Principles. Students did a very nice job reflecting on their process through the semester, but my rubric didn’t encourage drawing out connections to design principles. This occasionally lead to some grading confusion.
Flipping the Course: Involved in the Process
To tighten the feedback model even more, I flipped nearly my entire class. Rather than lecture about human abilities, input technology, or sketching, class time was used almost entirely to apply them through the aforementioned design sprints. Between classes, I assigned readings/videos for students to consume, and held brief reading in-class quizzes (typically 3 questions, < 5 minutes).
What worked: There is a lot of emerging research on the benefits of flipped classrooms that I won’t repeat here, but suffice to say that in an era in which students can replicate my lectures via YouTube videos, leaving class time for work gives students them the unique opportunity to work alongside their instructor rather than independent of their instructor.
What could be better: More formal interventions.
- I often get comments from students wanting more lecture from me. While education research shows that my monologues aren’t doing them any favors, making sure that we understand how to apply the reading through examples would have help launch the design modules. Next time I’ll add structured 15-minute activities (for example, design critiques) that we could tackle to start new topics.
- I would also have more structured sharing mechanisms for students to get feedback about their progress in each design. I heard from a couple of students that, as time became crunched, they were tempted to reverse-engineer their design process from the final product, rather than letting that process drive the product.
- Reading quizzes are never popular. I am always searching for better ways to keep students individually accountable in a flipped context.
Virtual Visitors: Bringing the Outside In
I reflect about this component quite a bit in the post linked below, but having industry and research experts call in and chat for 20 minutes continues to be one of my favorite ways to expose students to the awesome diversity of HCI. This semester’s visitors are listed at the bottom of our course website.
What I would change: Not much — this is frequently referenced in course evaluations as a highlight of the experience.
Wrapping Up.
I walked into the semester with no shortage of fear and trepidation about overhauling a course formula that has worked well in many elite HCI programs. While there are certainly tweaks to be made, I think the effort was well worth it. From my (small sample size) experience, the design process was deeply embedded in my students by the end of the semester, and I felt confident knowing that they will not only be able to translate their design process to new, emerging contexts, but also communicate and rationalize their designs to their future employers.
Course website: http://eg.bucknell.edu/~emp017/hci/
If you have suggestions or comments, don’t hesitate to contact me via email or Twitter. As always, I’d love to know if you use any portion of this course in your own!
