Project: Sketching with Hardware

A Course for Teaching Interactive Hardware Prototyping to Computer Science Students

Status: ongoing

Runtime: 2012 -

Participants: Andreas Schmid, Raphael Wimmer, Laurin Muth, Felix Riedl

Keywords: tangible interaction, teaching, prototyping

Sketching with Hardware is an undergraduate university course with the goal to teach students how to build prototypes for tangible user interfaces. It is part of the media informatics curriculum at the University of Regensburg as an elective course. Goals of this course are to create awareness for tangible interaction among students and prepare them to implement advanced projects like bachelor’s and master’s theses in this field.

Course History

The course concept for Sketching with Hardware was developed by Alexander Wiethoff and Raphael Wimmer who combined a course concept targeted at interaction designers with one targeted at computer science students at LMU Munich in 2009, where the course has been taught ever since.

Wimmer started teaching the course from 2012 onwards together with Florian Echtler at University of Regensburg with Andreas Schmid joining in 2015.

Course content and structure

Sketching with Hardware is structured as a two week full time block. During the first week, students are taught essential skills needed to work on hardware projects, like electronics basics, soldering, serial communication and low-level programming with the Arduino. During the second week, groups of two students each are formed and they build a tangible prototype together as their assignment for the course. The topic of this final project is developed in an iterative process and follows a general theme of the course.

Following, a detailed overview over the course's content is shown. Depending on the size of the course and the participant's previous knowledge, the time needed for exercises may vary strongly. Make sure to provide additional supervision to weaker groups during the first week to let them catch up with more experienced peers. After each exercise sheet, the results should be presented and discussed shortly. All practical tasks of the course are done in groups of two. During the first week, we randomize those groups each day so participants get to know each other.

Day 1

The first day starts out with an introduction of the course's content, structure and procedure. Also, supervisors and participants introduce themselves briefly to get to know each other as a personal and informal atmosphere is desirable regarding the small size of the group and the numerous tasks that require working together. Basic concepts of tangible interaction and electronics are conveyed with a combination of lectures and exercises and soldering is taught in a hands-on way.

Basics of circuits and soldering are taught on the first day of the course.

Time Topic Description
09:00 - 10:00 Lecture: Introduction
Slides: Introduction
Basics of tangible interaction
Overview over the course's topics
Short introduction of each participant
Overview over the tools and materials provided to participants
10:00 - 10:30 Lecture: Electronics 1
Slides: Electronics 1
“What do you already know about electronics?”
Ohm's Law
Introduction of voltage, current and resistance
Using a Multimeter
10:30 - 12:00 Exercise: Electronics 1
Exercise Sheet 1 (Electricity and the Multimeter)
Using Ohm's Law to calculate voltage, current and resistance
Using a multimeter to measure voltage, current and resistance
Building a simple circuit on a breadboard
12:00 - 13:00 Lunch Break
13:00 - 13:30 Lecture: Soldering
Slides: Soldering
Introduction of tools needed for soldering
Safety instructions
Live demo (using a camera connected to the beamer)
13:30 - 15:00 Exercise: Soldering
Exercise Sheet 2 (Soldering)
Several hands-on exercises to learn soldering
15:00 - 15:30 Lecture: Electronics 2
Slides: Electronics 2
Kirchoff's Circuit Laws (series and parallel circuits, voltage dividers)
Transistors (especially MOSFET)
Integrated circuits (example: 555 timer)
Reading data sheets
15:30 - 17:00 Exercise: Electronics 2
Exercise Sheet 3 (Circuits)
Exercises on voltage dividers, transistors and the 555 timer IC

Day 2

Work in progress!

Arduino-based custom input device for a browser game.

Time Topic Description
09:00 - 09:30 Lecture: Arduino
Slides: Arduino
Introduction of the Arduino Micro
Installation of the Arduino IDE
Every participant should have the “Blink Sample” up and running
09:30 - 11:00 Exercise: Arduino 1
Exercise Sheet 4 (Arduino)
Uploading programs to the Arduino
Altering sample programs
Controlling simple components
11:00 - 13:00 Exercise: Custom Input Device Introduction of simple sensors (tilt sensor, copper tape, photo resistor, distance sensor)
Installation of the HID-Libraries
Each group chooses a simple (!) game and builds a custom input device using the Arduino and provided sensors. Afterwards, each group presents their input device shortly
13:00 - 14:00 Lunch Break
14:00 - 15:00 Lecture: Programming
Slides: Programming
Differences of C/C++ and Java (the programming language our students are familiar with)
Best practices and useful patterns for low-level programming
Debugging hardware projects
15:00 - 17:00 Exercise: Arduino 2
Binary Clock
This exercise combines understanding data sheets, creating a advanced circuit, and programming the Arduino
Provide needed components (shift register, additional LEDs) to each group

Day 3

Work in progress!

Time Topic Description
09:00 - 09:30 Lecture: Libraries and NeoPixels
Slides: NeoPixels
Introduction of libraries for Arduino
Different ways how to install libraries
Introduction of important/useful libraries
Introduction of WS2812 NeoPixel LED strips
09:30 - 11:00 Exercise: NeoPixels
Exercise Sheet 6 (NeoPixels)
Make sure every participant is able to install the NeoPixel library
11:00 - 11:30 Lecture: Electronics 3
Slides: Electronics 3
Differences between digital and analog signals
Pulse width modulation
Live demo using an oscilloscope (showing how digital signals, analog signals and PWM “look” like)
Communication over serial protocols (I2C, SPI, UART)
In-depth look at the Arduino's pinout to show which pins can be used for serial communication
11:30 - 12:30 Lunch Break
12:30 - 15:00 Exercise: Sensors and Actors Each group is provided with one sensor and one actor component and they have to connect them using the Arduino. Afterwards, each group presents their results.
A list with good combinations of sensors and actors can be found [TODO somewhere]
15:00 - 17:00 Flexible slot This slot can be either used as a buffer if the two exercises turn out to be too extensive, or to teach content related to the final project. Here you can also ask participants if some of the topics are still unclear so they can be repeated on the next day

Day 4

Work in progress!

Participants presenting their ideas to each other.

Time Topic Description
09:00 - 11:00 Flexible Slot This slot can be used to teach content related to the final project
11:00 - 12:00 Wrap-Up Repeat topics still unclear to participants
12:00 - 13:00 Lunch Break
13:00 - 13:30 Lecture: Interaction Design
Slides: Interaction Design
What is interaction design?
Designing Tangible User Interfaces
This slot also serves to shift the participant's focus from a rather technical point of view towards a more creative mindset
13:30 - 14:00 Demos
[TODO] List of Projects
Show and explain pictures and videos of related projects
14:00 - 14:15 Revelation of the Theme Reveal the theme of the final project to the participants. Try to keep it open, but also clearly communicate requirements
14:15 - 14:30 Groups Short break to give participants the opportunity to find a partner for their final project
14:30 - 15:15 Brainstorming Each group creates a poster with at least three ideas for their final project's topic
Create pressure of time by strictly limiting this slot to 45 minutes
Playing upbeat music with a moderate volume in the background is recommended
Technical aspects should be ignored during the brainstorming session
15:15 - 16:00 Feedback Each group gets a spot inside the room where they can present their poster created in the previous session. While one member stays at the poster and explains the ideas to others, the other member visits the other group's posters, asks questions and marks their preferred idea by drawing a symbol on their poster. Afterwards, partners switch roles so every course participant has seen each idea.
16:00 - End Elaboration of the Topic Each group now knows how well each idea is received by their peers. They can now decide which idea they want to realize as their final project. The rest of the day can be used to flesh out the idea, determine features and ask technical questions.

Day 5

Work in progress!

Time Topic Description
09:00 - 09:30 Organizational As the theoretical part of the course is concluded, communicate the procedure of the practical part now.
Participants can now freely work on their projects and supervisors are there to help solving problems.
Opening times of the lab as well as fixed dates for bulk orders or a trip to the hardware store should be communicated now.
Lastly, the evaluation scheme of the course is presented so participants know which aspects of the final project to focus on.
09:30 - 10:00 Lab Tour Participants are told where to find tools and material they can use for their final projects.
Before using power tools for the first time, they have to ask for an introduction by the supervisor
10:00 - End Proof of Concept For the rest of the day, participants work on prototypes for all features of their final project, define milestones, distribute tasks and create a list of needed components.
Homework Concept Video Over the weekend, each group has to create a short (1 minute) video with a low fidelity prototype of their project. Technical details should be omitted from the video and especially interaction with the prototype should be shown.

Week 2

Work in progress!

Time Topic Description
Monday, 09:00 Concept Videos Show the concept videos participants created over the weekend, followed by a short discussion about each video.
Thursday, 15:00 Presentation Each group presents their prototype.
You might want to invite colleagues and other external people to this presentation to create awareness for the course.
Friday Bugfixing and Polishing Main features of the projects should be done by now, so participants can focus on polishing their prototypes and fixing remaining bugs.
Homework Project Video and Documentation Each group has to hand in a high-fidelity video showcasing their prototype and a written documentation as additional assignments for the course. We recommend providing five days to finish those assignments.

Work in progress!

Information on how to organize and conduct the course goes here.

Needed Material and Infrastructure

Work in progress!

Material for Participants

Each group of participants gets a shared box containing all tools and materials necessary to work on exercises during the first week. We intentionally only provide one box to each group to encourage participants to work together.

Content of the participant's boxes.

Amount Name Price per piece Link (example)
1 Cutter - -
1 Soldering Iron - -
1 Soldering Iron Stand - -
1 Soldering Tip Cleaner - -
1 Solder Pump - -
about 1 m Solder - -
1 Solder Flux - -
1 Third Hand (optionally with magnifying glass) - -
1 Safety Goggles - -
1 Toolkit - -
1 Multimeter - -
1 set Jumper Wires (male-male, male-female, female-female, about 20 each) - -
1 Arduino Micro + Cable - -
about 50 Pin Headers (male and female) - -
1 Servo Motor - -
1 Potentiometer (linear, 10k Ohm) - -
1 555 Timer IC - -
1 Shift Register (e.g. 74HC595) - -
1 Mosfet - -
1 set Resistors (220 Ohm, 10k Ohm, 10 each) - -
1 set Capacitors (100 pF, 47 uF, 5 each) - -
1 set LEDs (3 colors, 6 each) - -
about 5 Buttons and Switches - -
1 Breadboard (at least 10×60 rows, with power supply rails) - -
1 NeoPixel Strip (10 LEDs, e.g. WS2812, with pin headers) - -
5 m Wire - -
1 USB Hub (preferrably active) - -
1 Power Supply (adjustable, 3-9 V) - -
1 Soldering Mat (wood or silicone) - -
1 Magnifying Glass - -
1 Desk Lamp - -

Tools for shared use

Some useful tools that can be shared by all participants. Before students use powertools, they have to get a safety instruction.

Amount Name Price per piece Link (example)
1 Oscilloscope - -
2 Lab Power Supply - -
1 Cordless Screwdriver + Drills - -
1 Jigsaw - -
1 Vacuum Cleaner - -
1 Hot Glue Gun - -
1 Handsaw - -
1 set Screwdrivers - -
1 Measuring Tape - -
1 Wire Cutter - -
1 Pliers - -
4 Clamps - -

Materials and Consumables

A collection of components and material is provided to participants so they can use them for their project and do not have to acquire everything by themselves. Amounts may vary vastly depending on the size of the course and the type of prototypes being built.

Amount Name Price per piece Link (example)
30 Alligator Clips - -
several rolls Wire (thin, different colors) - -
assortment Screws - -
some sheets Plywood - -
some sheets Acrylic Glass - -
1 roll Copper Tape - -
assortment Metal Fittings - -
3 rolls Duct Tape - -
several rolls Electrical Tape - -
assortment Shrinking Tube - -
1 set Resistors (50 to 100k Ohm) - -
1 set Capacitors (100 pF to 1 mF) - -
20 Perfboards - -
5 m WS2812 LED Strips (e.g. Adafruit NeoPixel) - -
assortment Paint (e.g. Acrylics) - -
assortment Sand Paper (80 to 400 grain) - -
assortment Cardboard (for paper prototypes, different colors) - -


Work in progress!


Work in progress!

Hardware Prototype

Work in progress!


Work in progress!

Concept Video

Work in progress!

Project Video

Work in progress!

Impressions of former courses

Project videos of former course iterations

Andreas Schmid, Raphael Wimmer

Proceedings of the Mensch und Computer 2019 Workshop "Be-greifbare Interaktion"

Experiences of teaching the course "Sketching with Hardware" (Tweet this with link)