Joy is a well-made object, equaled only to the joy of making it.

- A Haida saying

Video. Welcome to our Physical Computing virtual learning space! In this video, we are using real-time computer vision to track the user’s hand, which is then transmitted to Arduino to control a cardboard-crafted person with a servo motor. The cardboard person and mountain background scene was created in partnership with two of my favorite makers: a kindergartner and preschooler! You can learn how to make this in our HandPose Serial lesson.

Welcome 👋!

We’re so glad you are here. This interactive textbook is a place to learn, to invent, and to have fun exploring physical computing and interaction device design. Join us in exploring, playing, making, iterating, and learning!

Hi 🙋🏽‍♂️, I’m Jon E. Froehlich, a professor in computer science and human-computer interaction at the University of Washington. I originally built this site to help teach my physical computing courses at UW but it’s grown beyond my imagination! The website is designed to help you learn through animations, movies, embedded code, and simulation.

What you’ll learn

By following along with our lessons and guides, you will explore:

  • ⚡Intro to Electronics: The fundamentals of electricity (voltage, current, resistance), circuit schematics, and safely building circuits with LEDs and resistors.
  • 🤖 Intro to Arduino: Programming microcontrollers in C/C++ to read analog/digital inputs, control actuators, and build your first interactive devices.
  • 📡 Sensors & Advanced I/O: Deep dives into how sensors capture the world (force, light, distance, motion) and how to control advanced outputs like OLED displays and haptic vibromotors.
  • 💻 Computer Communication: Bridging hardware and software using Web Serial, p5.js, and ml5.js for browser-based interactions and applied machine learning.
  • ☁️ Internet of Things (IoT) with ESP32: Building wireless, internet-connected projects using the powerful ESP32 microcontroller.
  • 📈 Signals & Data Science: Using Python and Jupyter Notebooks for digital signal processing, frequency analysis, and building machine-learning gesture recognizers.
  • 🕹️ Circuit Playground Express (CPX): An accessible, beginner-friendly introduction to physical computing using Adafruit’s CPX and drag-and-drop visual programming (MakeCode).

Why learn physical computing?

This is a particularly exciting time to explore physical computing, driven by three interrelated trends:

  • The Maker Movement: Low barriers to entry for hardware interfacing and digital fabrication have made it easier than ever to couple physical form with computation.
  • Pervasive IoT & Mobile: Ubiquitous, sensor-rich devices allow us to break away from traditional keyboards and mice, exploring off-the-desktop interaction models.
  • AI & Computer Vision: Maturing toolkits allow us to process complex sensor data for human-computer interaction without needing to be machine learning experts.

Learning prerequisites

We assume the following background:

  • Some coding experience: For the introductory Arduino lessons, we assume familiarity with basic concepts like functions, loops, variables, and conditionals. We use C/C++, but previous experience with it is not required. If you know Java, Python, or JavaScript, you will be fine.
  • No hardware experience: We assume zero previous experience with electronics or microcontrollers.

If you have limited coding experience, explore our Circuit Playground Express (CPX) lessons! We use the visual drag-and-drop language MakeCode, which is excellent for introductory interaction design.

Learning philosophy: learn by doing

Our core pedagogical philosophy is learn by doing. The best way to understand physical computing is through hands-on practice. We expect you to build along with our guides, make mistakes, iterate, and experiment.

A collage of physical computing projects created by university students, featuring custom game controllers, interactive light displays, and accessible hardware interfaces. Example projects from our courses.

Example Hardware Kits

Here are some example hardware kits that we provide students in our classes:

Global Impact & Testimonials

Since our launch in Spring 2020, we have received over 700k views from 209+ countries (via Google Analytics). 🚀

Our materials have been used in university courses and maker workshops across the globe, including at CMU, Stanford, UW ECE, Purdue, OCAD, Wayne State, NYU Shanghai, RPI, Univ. of Victoria, UDIT in Madrid, Sussex, Dundee, and beyond.

“Your site is exactly what I was looking for. My students and I are grateful to your intuitive explanations, animations, and step-by-step problem-solving approaches.” — University Professor

“Insanely useful & highly relevant.”

  • University of Queensland Professor

“I’d highly recommend taking this class; it was one of my favorites at UW. I don’t come from too much of a tinkering, embedded, hardware background. This class helped me think about HCI in a really different way.” — UW Student

Use This Website In Your Courses/Workshops

We ❤️ it when others use and benefit from this material! If you incorporate or use any pieces of this website in your teaching or workshops, please let me know at jonf@cs.uw.edu. I love hearing about the ways our materials help you learn and teach!

For our tutorials, we often link to example code in the following repositories:

Website Code

All code on this website is open source, including the website itself. If you’d like to contribute, please read the web dev setup guide, start coding, and make a pull request!

Acknowledgments

Diagrams, animations, pictures, and videos are by Jon E. Froehlich unless otherwise noted, created using Tinkercad Circuits, Fritzing, Autodesk Eagle, and Microsoft PowerPoint. Fritzing diagrams often use the Adafruit Fritzing Library.

The content here is inspired by a rich set of courses, including NYU’s ITP Physical Computing, UC Berkeley’s Critical Making and Interactive Device Design. See Inspirations and the Resource list for more.

This website is built in Jekyll with the Just the Docs theme.

The Makeability Lab logo which is a large geometric M with an embedded L The DUB logo, which is a stylized D U B with Design Use Build text under it The MHCID logo The Allen School CS logo, which is a larger UW W with Paul G. Allen School of Computer Science and Engineering text.

This website was developed by Professor Jon E. Froehlich and the Makeability Lab using Just the Docs. If you found the website useful or use it in your teaching, we'd love to hear from you: jonf@cs.uw.edu. This website and all code is open source (website GitHub, Arduino GitHub, p5js GitHub). You can find the MakeabilityLab_Arduino_Library here. Found an error? File a GitHub Issue.

Made with ♡ by the The Makeability Lab logo which is a large geometric M with an embedded L