DMST 3211

Tangible Interactivity - Fall 08

Catalog Description:

Explores methods and devices for human-computer interaction beyond the mouse and keyboard. Students learn to create and hack electronic input and output devices and explore multi-touch, augmented reality, and other forms of sensor-based technologies. Prerequisite: DMST 2100 or permission of instructor.

Return to Top

Contact information

Assistant Professor Chris Coleman

Office: Room 216A Sturm Hall

Office Hours: Tuesdays and Thursdays 2pm-3pm or by appointment


Return to Top

Course Overview

Interaction has been heralded as the next phase in information and entertainment consumption. Technophiles claim that no longer will print, radio and television pipe one way flows of information to us; instead we will have control over what we see, hear and learn. The Web2.0 revolution has provided more opportunities than ever to participate and create online. But to what extent is an end user really able to have any control? Does a proliferation of choices mean increased knowledge and power? As critical creators of this content, do you give up control so the user may also become the author, or do you use the myth of interaction to subversively imbed your message into their headspace?

The focus of the course will be on developing new physical and visual interfaces. Each student will learn to work with an Arduino board and basic electronics, allowing easy connection of buttons and sensors with the software running on the computer. We will also explore the proliferation of open source tools allowing for interaction using input from video and audio sources. After years of fitful starts and stops, we are finally seeing innovative interfaces begin to be accepted in the mainstream populace; the Nintendo Wii, the iphone, and the Microsoft Surface to name a few. We will lay the groundwork for understanding and creating such things, while looking at the practicality and history of interfaces that have since died or gone into hibernation.

Return to Top

Course Objectives

By the end of this course you will:

  • Think critically about interaction and interactivity
  • Have knowledge of the history and future of interaction
  • Consider all facets of HCI in developing your work
  • Have working knowledge of cutting edge tools for interactive media creation
  • Understand the process of planning and executing interactive work
  • Develop new ways to provide input for a computer
  • Understand how the computer can have output beyond sound and video
  • Create meaningful content laden interactive experiences
  • Be able to understand how and when to work interactively without a computer

Return to Top


  • The required text for this course is "Processing: A handbook for Visual Designers and Artists" By Casey Reas and Ben Fry. It is available in the University Bookstore
  • You will need at least 1GB of portable storage (flash or thumb drives, ipod, portable hard drive, etc.)
  • You must have or purchase a sketchbook approx. 8.5"x11"
  • Email address and web space through the school or other server

Return to Top


This class will combine individual work in the lab with individual and group instruction. Students must come to class prepared to work. Showing up without necessary files or equipment is the same as not attending. Although students may also use their home computers to work on projects, this is not a valid reason to not attend. It will be necessary to work outside of class to complete all projects and assignments. A minimum of eight hours per week of work outside of class is suggested to get an average grade of a C. Computer failure, equipment malfunction, and file corruption are not accepted as excuses for late or unfinished work so BACK UP YOUR WORK. The computer labs are used by many students, so the labs are in high demand. Budget time accordingly as "unavailable computer time" will also not be accepted as an excuse. Participation in all class discussions and critiques as well as constructive use of lab time is considered in the final grade for each project. At any time in the creation process students should be able to produce notes, drawings,charts etc from their sketchbooks, as well as discuss and articulate the nature of their work to their peers as well as to the instructor.

Attendance is mandatory. Attending class is the responsibility of the student. Lectures and demonstrations may be given or changed without notice and every class will start with professional examples of relevant work so punctuality is essential. An individual who is absent, late or sleeps during class will be responsible for getting the information missed. Students will be allowed two (2) absences without penalty. Any absence in excess of two will result in a 10% grade reduction of the final grade for the course per absence. All absences will be counted. A student who misses 15 minutes or more of a class (late or leave early) is considered absent. A student who sleeps will be considered absent. A student who will acquire absences due to a University sponsored activities must provide necessary documentation from the appropriate office prior to the absence to make any special arrangements for missed work.

For any absence due to religious beliefs, written notification should be provided in the first two weeks of the quarter; the student is responsible for any missed work. Any special medical or personal problems that occur, where absenteeism will exceed the allowed two, will require verification by a physician or emergency medical association (a letter from Student Affairs merely explains an absence, and will not qualify as an excuse). These situations may require course withdrawal or "Incomplete" status on the final grade. Six absences mandate an automatic grade of "F." Three late arrivals (less than 15 min.) will equal one absence.

Return to Top


Grades will consist of the following:

  • Assignments @ 30%
  • Reading Responses @ 10%
  • Project 1 @ 15%
  • Project 2 @ 15%
  • Project 3 @ 20%
  • Participation @ 10%

Projects and assignments will be graded on the following basis, listed in order of importance.

  • Development, creativity and originality of concept or problem solution
  • Technical development and demonstration of skills
  • Craftsmanship and presentation of work
  • Participation in classroom discussions and critiques in connection with the work

Your grade will be calculated according to the following standards:

  • A = Excellent (100-90%)- work pushes far beyond the project stipulations and shows clear evidence of extreme time, dedication, care and thought about the project as evidenced in effective execution of original/thoughtful ideas.
  • B = Good (80-89%)- work exceeds the basic criteria, provides creative solutions to the problems and shows technical proficiency. Student has made the project "theirs" in that they do not need to explain project stipulations before showing the work.
  • C = Average (70-79%)- work fulfills all requirements, does not expand on techniques shown in class, ideas are close derivations of popular culture.
  • D = Unsatisfactory (60-69%)- work might meet basic criteria but in a careless and/or thoughtless way. Technical proficiency is rudimentary and no chances were taken.
  • F = Failure (0-59%)- the work does not meet the basic criteria.

Late projects will be penalized a letter grade for every class period they are late. Turning a project in after the beginning of the critique counts as one class day late.

Graduate Student Requirements

All graduate students taking this course for credit will need to produce an additional project in addition to the requirements stated above. The additional project will encapsulate their advanced level of conceptual and technical expertise as acquired through extensive independent research and conversations with the instructor. The student will need to use web and text resources to gain and display techniques in interaction design, digital sensoring, and interface innovation beyond those covered in class. The project should explore ideas related to either their thesis work or more advanced/experimental work that extends and expands on class instruction. Most important will be understanding the role their innovative interfaces play in shaping the information they are unfolding and how this piece fits within a broader media environment. The project will be developed during the entire quarter in consultation with the instructor with a complete proposal, materials and all necessary research completed by week five. The following five weeks will be spent on construction, programming, and troubleshooting.

The grade balance for the Graduate students will decrease the weight of the Assignments as follows:

  • Assignments @ 35%
  • Project 1 @ 15%
  • Project 2 @ 15%
  • Project 3 @ 25%
  • Participation @ 10%

  • Return to Top

    Lab Rules

    It is your responsibility to adhere to all rules regarding the use of the DMS labs and equipment. You will be given a sheet stating all rules. Please see Kate Burns in the DMS office before class if you need a form to access the DMS lab.

    Return to Top


    Solutions to assignments you submit will be your own work. A student who is discovered to have plagiarized another's work will immediately receive a grade of F for the course, and a recommendation for disciplinary action will be forwarded to the Dean of Students.

    Return to Top


    While you are not required to purchase the software that we are using, not having the software is no excuse for failing to complete your projects. It is your responsibility to work out times when you can use the DMS labs or to make other arrangements for doing your work. Please do not download and/or install trial versions of this software or any other onto campus computers. Flash can be purchased at academic pricing from online outlets and the University bookstore. Processing is free open source software and available for all three major operating systems.

    Return to Top

    Course Outline

    (The following schedule is open to revision at any point in the quarter.)

    09/09 - Introduction, history of HCI, reading 1 assigned, Assignment 1

    09/11 - Processing Introduction, Drawing with Code

    09/16 - animating, Interaction, Project 1 description, Assignment 2

    09/18 - Algorithmic Art,Functions, Math at work, Project 1 Idea

    09/23 - Images and text, Reading 1 Discussion

    09/25 - Present Project 1 ideas, Additional Interaction, custom functions

    09/30 - TBA

    10/02 - Pre-Crit

    10/07 - Project 1 Due

    10/09 - Intro to flash, Project 2 description, Assignment 3, Reading 2 Assigned

    10/14 - Layers, Timelines, Movie Clips, Buttons, Assignment 4

    10/16 - Action-script, Assignment 5

    10/21 - Interaction in Flash

    10/23 - Work Day, Reading 2 Discussion

    10/28 - Project 2 discussion

    10/30 - Project 3 description, using images, Actionscript continued

    11/04 - Project 2 Due

    11/06 - Project 3 Ideas, Reading 3 Discussion, Actionscript

    11/11 - Work in Progress

    11/13 - Work in Progress

    11/18 - Final Critique 12:00pm - Project 3 Due

    • Project 1 = More than a screensaver
      Create a processing sketch that can evolve over time in an interesting visual way with and without interaction. Consider all of the artists work we have seen, and how they keep your attention(or not.) Can you make something with more visual interest than a music visualizer or the default screensavers? Look back at Modern artists like Mondrian and how he used abstraction with meaning.
    • Project 2 = Interactive Conversations
    • Project 3 = Storytelling Experience

    Return to Top



    - Lecture One

    - Lecture Two

    - Lecture Three

    - Lecture Four

  • Artist Jared Tarbell
  • Artist Karsten Schmidt
  • Artist Screamy Guy
  • Artist W:Blut
  • New source for processing examples - also a place to upload your projects!

  • - Lecture Five

    - Lecture Six

    - Lecture 10

  • Adobe Video Tutorials
  • Example ActionScript files

  • - Lecture 11

  • Reading #3 - Lev Manovich
  • For loop example with interaction from class

  • - Lecture 12

  • Download examples for Project 2
  • example for loading images
  • example for loading and controlling sound files
  • examples for switching and moving images, as well as a video player

  • Return to Top