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)


Reflect on how you use some particular digital tool.

Place and the Senses ★

Choose a place that interests you, a place that you can visit and revisit during the course of this project. Produce a tablet publication that shares this place with readers. Aim to convey something about the experience of being there. Have a point of view: present your thoughts and observations about why this place matters.

Build the tablet publication using Adobe DPS, and target the iPad. Your publication should include text, images, and either sound or motion. Add your own navigation system in addition to the navigational features that are built in to DPS. This project involves learning how much technology is enough. Aim for quality and thoughtful design decisions, rather than half-implemented complexity.

Museum observations

On our class field trip, observe the way that people use and experience the exhibits. Report on one exhibit.

History Microsite ★

You will be assigned a topic in interaction design, user-centered design, interface, computing, or telecommunications history. Research the topic, gathering source images and quotations. Arrive a position about your topic, and write 500–800 words.

Publish your writing and images in a website. You can handcode the site, or you can use graphical tools. Choose a straightforward approach that you can build: your grade depends on content and art direction, not your facility with HTML/CSS.

Tools for the Common Good ★

Imagine a way in which an everyday software/hardware tool can advance the common good – deepening our understanding of an issue, perhaps, or connecting people to services that they need. Develop a concept and a design through critiques and usability testing. Produce a simple booklet, in print and PDF form, that explains your idea.


Create a process 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.

OPEN exhibition

The Undergraduate Design Department holds a yearly exhibition of student work – an opportunity to show and share projects. It forms part of your grade. (more)


25%	Place and the Senses
10%	History
40%	Tools for the Common Good
15%	Process weblog and other projects
10%	Participation

Tools + resources


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

Norman, Donald. Emotional Design. New York, N.Y.: Basic Books, 2004.

Krug, Steve. Don’t Make Me Think: A Common Sense Approach to Web Usability. 2nd ed. Berkeley, Calif.: New Riders, 2006.

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 Google Chrome Canary on the Mac. Adobe Digital Publishing Suite (DPS) projects will be evaluated on the iPad.

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.

Class policies


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   4.0  Outstanding work
A-  3.7  

B+  3.3
B   3.0  High-quality work
B-  2.7

C+  2.3
C   2.0  Acceptable work; meets expectations
C-  1.7  

D+  1.3  
D   1.0  Seriously deficient work
D-  0.7  

F   0.0  Failure (no credit)

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.

Honor code

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

Academic accommodations

If you have specific learning, attentional, psychological, or physical disabilities and require accommodations, please let me know early in the semester so that your learning needs can be appropriately met. All discussions will remain confidential.

If you have not already registered with Amanda Kleinman, the Learning Specialist in Student Affairs, you will need to register and provide documentation of your disability. Please contact Amanda to request an appointment at or 202-639-1865. You can also stop by Amanda’s office in Student Affairs, at the downtown campus.

Department policies

OPEN 2013: BFA Design Department Exhibition

Friday, December 6, 2013
Opening: 6:30 pm - 9:00 pm
Set-up: 1:00 - 6:00 pm
De-installation: 9:00 - 10:00 pm

Location: Georgetown campus, rooms 210, 204, 304, 305, 305, 309, 310

Undergraduate Design student participation and attendance at the OPEN 2013 BFA Design Department Exhibition is mandatory. Freshman, Sophomore, Junior, and Senior Undergraduate Design students (BFA) participate and attend the OPEN 2013 BFA Design Department Exhibition. The OPEN exhibition is integrated into core design studio courses and students will receive a grade for this exhibition as a course project in their core design studio courses. BFA student participation includes:

End-of-Semester Reviews, Undergraduate Design Department

Student participation and attendance at End-of-Semester Reviews are mandatory. Freshman, Sophomore, Junior, and Senior Undergraduate Design students participate and attend End of Semester Reviews in both the Fall and Spring semesters. Undergraduate Design Department End of Semester Reviews are scheduled for the last day of each core designs studio course. There are grade penalties for students who do not participate and attend End of Semester Reviews. Students who do not participate and attend End-of-Semester Reviews will receive a full-grade deduction from their overall semester grade in their core design studio course.