GDES-315 spring 2019 (David Ramos, American University Design) · office hours · interaction design resources

This course explores ways of conveying information, organizing experiences, and creating meaning in interactive systems.

Topics include graphic design for the web, screen typography, documentation and prototyping, user centered design methods, HTML/CSS development, and responsive/mobile design. Students will test these ideas in projects that require strong process and independent research, producing design solutions that respond to project requirements and to their own technical ability.

Interaction design theory provides a foundation for understanding users and their behavior. We discuss the relationship between design, technology, and society, and reflect on the responsibilities that designers and technologists face.

Catalog description

This course prepares students for the world of professional web design. Through creative hands-on projects, exercises, and lectures, students learn to conceptualize, design, and deploy successful web sites for clients. Course topics include intermediate web design concepts such as interface design, usability principles, web typography, information architecture, compliant front-end HTML, CSS, and JavaScript code. Usually Offered: fall and spring. Prerequisite: GDES-200, GDES-210, GDES-220, and COMM-330.

Learning objectives

“We are designing verbs, not nouns.” (Bill Moggridge)

Students will gain fluency in:

Students will also become proficient at:


Class meetings will be a mix of demonstrations, discussion, critiques, and studio working sessions. There will be extensive self-scheduled project work outside of the classroom. The class schedule and assignments are provisional and subject to change.

Contact and office hours

An office hours schedule is published elsewhere on my site. The best way to reach me outside of office hours is through email ( Please allow one weekday for an email response. It is department policy not to do critiques over email.

Projects and grading

Evaluation is based on project work as completed, the process that leads up to the final versions, and participation and attendance.

These percentages will change if assignments and schedules change.

The graphic design program asks that all graphic design majors have an online portfolio by the conclusion of this class. We will discuss portfolios, but the portfolio is not a graded project.

Tools and reading


There are two required textbooks (on reserve in the library).

Santa Maria, Jason. On Web Typography. New York, N.Y.: A Book Apart, 2011. (Available in print and as an ebook.)

Andrew, Rachel. The New CSS Layout. New York, N.Y.: A Book Apart, 2017. (Available in print and as an ebook.)

Additional resources

See a compilation of reference material on the separate Resources for IxD students site.

The AU Library provides access to online tutorials, which are especially useful for technical topics.

Other books that you might find helpful:

Norman, Donald A. The Design of Everyday Things. New York, N.Y.: Basic Books, 2013. ISBN-13: 978-0465067107. (Please obtain the 2013 edition, not the 1988/2002 ones.)

Brown, Dan M. Communicating Design: Developing Web Site Documentation for Design and Planning. Berkeley, Calif.: New Riders P., 2011.

Marcotte, Ethan. Responsive Design: Patterns and Principles. New York, N.Y.: A Book Apart, 2015. (Available in print and as an ebook.)

Required software and supplies

Lab machines are available, but you must not expect to save work on their hard drives. If you work on a laptop for lab/studio time, the computer must be able to run a text editor and Firefox.

Text editor for HTML/CSS

This class’ technical exercises focus on handcoding, which is the best way to understand how the web works. You will have access to a text editor in the Katzen labs. If you are working on your own machine, you will need your own software. Good editors include:

Do not use a visual editor (i.e., no Dreamweaver).

Keep backups and save versions

Back up your work! and save versions of your projects as you make progress. (More advice on backups and versioning.) Loss of data is not an excuse.

Process and submitting work

Projects in this class build through iterations; start early and work consistently. You will need to turn in evidence of your process, so keep versions of your files and paper sketches as they progress. Projects not seen in progress during previous classes will receive a failing grade.

Late work will be marked down.

See instructions for submitting work.

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



Students are expected to attend scheduled class sessions. Grounds for excused absences are illness, family emergencies, jury or military service, and religious obligations. One unjustified absence is allowed for the semester. Each additional absence will lower the course grade by one step (i.e. from A to A-).

Come to class on time and do not leave early. Excessive tardiness, early departures, excessive break time, and lack of participation in assigned class activities will count as equivalent to half an absence (2=1 absence). Tardiness over a half hour will be counted as an absence.

Grading scale

This course is modeled on the rigor of the graphic design curriculum at American University, which is in turn based on the standards of the graphic design industry. As such, students often find this to be a challenging course in which a significant amount of work must take place in the studio outside of class time. Your instructor will use the following grade scale when evaluating projects, with plusses and minuses.

In the classroom

Academic integrity

Standards of academic conduct are set forth in the University’s Academic Integrity Code. Please see me or consult the student handbook if you have questions about academic violations described in the Code or as they relate to particular requirements for this course.

Image and code citations: If you use any (including images and source 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. See class policy on citations and copyright.

Support services

American University offers an array of support services.