Interactive Web Design I · DM2280B spring 2013 · Corcoran College of Art + Design
Instructor: David Ramos

Interaction offers a model for design work across the entire range of outcomes, from screens to social events. Students will gain a thorough understanding of interaction design concepts, broadly framed. We examine interaction design methods, including prototyping and user testing. We will consider what it means to design for systems, on the dialogue between designers and users, and how designers might create possibilities rather than fixed artifacts.

Students will test these concepts with several projects that require strong process and independent research. Defining problems is a large part of the interaction field, and students will have leeway in their responses. The projects emphasize design rather than technology-based implementations.

“People think it’s this veneer – that the designers are handed this box and told ‘Make it look good!’ That’s not what we think design is. It’s not just what it looks like and feels like. Design is how it works.” (Steve Jobs in the New York Times, 2003)

This course introduces students to the fundamentals of how computers work. We discuss networks and the uses of data, and we learn how to use code to express information structure and to create machine behavior. The class aims to provide students with hands-on experience with HTML, CSS, and Processing, but only as an introduction to concepts; students can gain a more complete understanding of these tools in other courses.

Last, this course teaches students how to communicate design. In this field, decisions can involve systems that lie far beyond the scope of what a design team can produce. Practitioners need to create documents that explain their intentions, and instruct others on how to implement final products.


Students will:


This class will be a mix of demonstrations, discussion, critiques, and studio working sessions. It requires extensive self-scheduled project work outside of the classroom.


Assignments in this class tend to be open-ended, asking students to provide much of the intention, content, and context. Some projects will result in working artifacts, while others will aim instead to produce documentation.

“Designers take things apart, evaluate them, and put them back together, in a different order. That is how we understand product and process.” (Erik Spiekermann)

Finding neighborhood boundaries

What neighborhood is the Corcoran located in? Some people say “Georgetown,” while others argue for Glover Park. Develop a method for finding out where DC neighborhoods begin and end, according to the opinions of real people. This project explores the ways in which defining a question will shape the answers, and it offers an introduction to testing and design through iteration.

Tools ★

Imagine a way in which an everyday software/hardware tool can help people in their everyday lives. Develop a concept and a design through critiques and usability testing. Produce a poster and a PDF booklet that explain your idea.

Museum observations

While on the field trip, study some feature of the Natural History Museum. Evaluate the design and the way in which people use it. Present your findings, along with recommendations, and give a short talk to the group.

History ★

Research a topic in interaction design, user-centered design, interface, computing, or telecommunications history. Gather source images and quotations. Interpret the information that you have found and arrive a position about your topic. Argue your case in the form of a small website or PDF prototype for a website.

Processing exercises

Introductory exercises in writing programs using Processing.

Election Day ★

How could you improve some aspect of the voting process? Not the political landscape or American democracy, but the mechanics of how people cast their votes? Read news and background information about voting, and on Election Day, observe the workings of a polling place. Imagine a way in which you could improve on the process. Develop and refine your idea – employ user-centered design methods and usability testing. Produce a poster and a PDF booklet that explain your idea.


Design a system that generates compositions of text and images. Define your system as a set of instructions or as software, then let your system go.


Create a weblog that is dedicated to this class. Use the weblog to record your process and work as the class progresses. You may also add links and images that relate to your work, but not as a substitute for process documentation.

OPEN exhibition

The Undergraduate Design Department holds a yearly exhibition of student work – an opportunity to show and share projects. This year’s event takes place on Friday 30 November. It forms part of your participation grade.


 5%	Finding neighborhood boundaries
30%	Tools
10%	History
30%	Election Day
 5%	Chance
10%	Other projects
10%	Participation

Tools + resources


Reading in this course includes assigned articles and two required textbooks.

Kolko, Jon. Thoughts on Interaction Design. Burlington, Mass.: Elsevier, 2011.

Moggridge, Bill. Designing Interactions. Cambridge, Mass.: MIT P., 2010.

Designing Interactions is available in print and as PDF downloads. It will be on reserve in the Corcoran library.

Required software + tools

Backup strategy

Loss of data is not an excuse. Back up your work. An adequate backup plan involves duplicating your work across three different storage devices, kept in two separate locations.



This course seeks to help students to develop their own working processes. Good final projects invariably come as the result of diligent, structured work earlier in the semester. Do not leave work for the last few weeks. You will need to turn in your process work as part of your grade. Keep versions of your files and paper sketches as they progress. Never delete the files for anything you show in a critique.

Presenting work

If you are bringing work on paper for critiques – an excellent idea for sketches, wireframes, and design documentation – remember that other people in the class must be able to see your work. You need not mount any work from this course.

In the interest of efficiency and equity, HTML-based projects will be evaluated using a current build of Safari on the Mac.

Submitting work

Follow these steps to submit files. If your instructor cannot readily identify or review your projects, you will not receive a grade.

  1. Put the files into a folder.
  2. Name the folder with your first and last names and the project title.
  3. ZIP compress the folder.
  4. Make sure that the name of the ZIP file contains your first and last names, and the project title.

You may send the following file formats: .pde, PDF, HTML/CSS/JS, JPG, PNG, MOV, MP4, MP3, AAC, and plain text. Your instructor will not grade InDesign, Illustrator, or Word files.



Students are expected to attend scheduled class sessions and course-related activities. Two unexcused absences will reduce a student’s semester grade by one letter grade. A third unexcused absence is cause for failure of the course. Grounds for excused absences are illness, family emergencies, jury or military service, and religious obligations.

Grading scale

A	Outstanding 
B	Good
C	Adequate 	
D	Poor 	
F	Unacceptable 	

Resubmitting work

Students may revise and resubmit projects for a new grade before the end of the semester. Late work will be marked down.

Classroom rules

Intellectual honesty

The Corcoran Honor Code applies in this course. Please cite the work of others. Do not borrow projects from other students or reuse work from other classes without permission. Plagiarism or cheating are grounds for failure on an assignment; repeated plagiarism or cheating results in failure of the course. If in doubt about how and when to cite, please ask the instructor or a librarian.

Code citations: If you use any code from a source outside of the textbook and class demonstrations, insert a comment describing the material that you used, along with a URL for the original code.

College policies

Please review the Corcoran Honor Code and Attendance Policy, as published in the Student Handbook.


Published 2012-09-09.