Interaction Design History Spring 2026 | Week 2 | March 16, 2026

Agenda

• Reading Discussion: "The Computer for the 21st Century"
• Review: How Teachable Machine Works
• Lecture: Fiducial Markers & AprilTags
• Group Analysis: Clement Zheng Projects
• Activity: ArUco Web Tracking

Reading Discussion

• Break into small groups to discuss Mark Weiser's "The Computer for the 21st Century".
• Class-wide share out on key takeaways and possible modern applications.

From Fuzzy Logic to Discrete Tracking

• Review: How Teachable Machine translates webcam input using fuzzy ML logic.
• Lecture: The history of fiducial markers and discrete tracking.
• Deep Dive: Walkthrough of the AprilTag detection algorithm (AprilTag 2) and how a camera tracks an AprilTag in 3D space.

---

15 minute break

---

Case Studies: Tangible Interfaces

• Group analysis and presentation on Clement Zheng's Printed Paper Markers.
• Discuss how manipulating paper can act as a physical UI component.
• • Group 1: Elucidate
  • Group 2: HEXBOX
  • Group 3: TILT
  • Group 4: TRACK
  • Group 5: AruControls

Digital Activity: ArUco Tracking

In groups, we will take a premade ArUco tracking web script and modify the HTML in response to the presence, position, or tilt of the markers.

• Download the base script: ArUco Web Starter Kit
• Challenge: Map specific digital actions (e.g., color changes, DOM element toggles) to different tag IDs or spatial movements.

Homework

• Reading: Case studies of Clement Zheng's Printed Paper Markers.
• Assignment: Build a functional "Paper Controller", follow this tutorial, with at least two states (e.g., a toggle or slider) that triggers a digital action (like playing a sound or changing a screen color) using a basic webcam script. Investigate your own tracking script or modify the one provided in class.