Fall 2015
Interactive 2, GRAPH-228-01
California College of the Arts
SF Main Campus, [1] Room E1 [2] Room E2
Monday, Wednesday [1] 12–3pm [2] 4–7pm
Instructor: Laurel Schwulst, lschwulst@cca.edu

Course description

This course focuses on interaction design with projects that are based online. Questions asked during the course include:

— Is it specific?
— Is it memorable?
— Does it communicate the idea through its form?

(This course has a formal emphasis, using what knowledge students have about composition, typography, and hierarchy as a basis.)

— What is the web?
— What is code?
— What is code’s relationship to the web?
— How can we best use our knowledge of both to communicate the idea?

(Today interaction online is focused on information flow within living, social ecosystems that students already well know. We will go beyond and average user’s perspective to critically examine the web through historical, political, and social lenses. This course encourages students to holistically approach to the web and its constituent code as a living kit of parts patiently waiting to be harnessed in novel and innovative ways.)

— What are the different conditions in which this can exist?
— How does this change in each of those conditions?
— What happens to this when it expands?

(We will explore design principles relating to dynamic media and understand how good design should take advantage of the web both formally and conceptually. This design should be conditional online, changing in response to its environment and users, so we will create accommodating, flexible systems.)

The course will heavily employ real-world, contemporary examples of design, art, and presences online. These thematic groupings of artwork, portfolios, archives, exhibition platforms, blogs, web apps, etc. will be examined with a critical eye and mind. Additionally, we will discuss what makes a design practice and the importance of discovering each student’s unique approach and methodology.

This course is open to ~15 students. It is a required course for graphic design majors. It is open to students who have taken (or are taking concurrently) Graphic Design 2 and Typography 2 (GRAPH-216 and GRAPH-220). No prior programming knowledge is required to take this class. Preference is given first to graphic design majors who have these prerequisites. Interested students with special circumstances can speak to me directly and, in addition, be sure to thoroughly fill out the intro survey I give during the first week of class.

Class activities

Monday’s class will include any combination of:

Wednesday’s class will include any combination of skill-based workshop with working lab time and/or individual consultation.


Throughout the duration of the course, groups of readings (and sometimes videos) will be given. For each group of readings, each student must prepare three discussion questions and post them to that week’s Google Document (viewable on the Calendar section of the website) by 10am the day of class.

Weekly presentations

Each student will given a number 1 to 5. This number refers to a chapter in Italo Calvino’s Six Memos for the Next Millennium (1985). The chapters 
(1. Lightness, 2. Quickness, 3. Exactitude, 4. Visibility, 5. Multiplicity) refer to qualities that Calvino sought in writing and that he recommends to future writers. Students will read their assigned chapter to figure out its essence. They will then choose and then give a 10–15 minute presentation showing the class five works (design or art — not literature) that pertain to this “memo”. Ideally the chosen pieces will have some connection to the theme of interactivity, even if it's distant. Each presentation (Keynote or PDF) should include the specific “memo” as title, images of each work, and any important metadata (creator, year, link, etc.).


See Projects


In this class, students will strive to make memorable, functional online experiences. Projects should both take a stance (be poetic, critical, and clear) and also be functional (achieve their goals and not break). The invention of useful products is not the focus of this class, but the invention of useful, surprising techniques and approaches might be. Craft (in both code and design) and overall presentation are also important. Taking risks and having fun are encouraged.


20% ... P1
20% ... P2
20% ... P3
20% ... P4
20% ... Reading questions and presentation

At the end of the term, you will be required to send me an archival .zip file to document your projects. Divide your materials into five folders: P1, P2, P3, P4, and Presentation. Within each project (P1, P2, P3, P4) folder, make three new folders: Project, Documentation, Description. Put all of your project materials (code and required assets) into the Project folder. In the Documentation folder, place a video screen capture (made using Quicktime) to concisely document your project. Within the Description folder, place a text file containing a paragraph description of your project. Within the Presentation folder, place a PDF version of your presentation into the folder. When you make the .zip file, send it to me over wetransfer.com. Please keep this in mind as you organize your materials throughout the semester.

Letter grades represent the following: A = excellent; B = good; C = satisfactory; D = unsatisfactory; F = failure. A grade of C- or less is considered a failing grade for required courses within the major, and you will need to retake this course if you achieve a grade lower than a C.

Academic Integrity

Students will become familiar with using pre-existing language, images, and software as raw material while creating entirely new works and how to properly credit their inclusion. While making online projects, we will learn what technologies are good (and important) to appropriate. We will reference the “Fair Use” policy (http://collegeart.org/fair-use), Creative Commons, and software licenses.


Attendance is required. Students are expected to be on time and remain in class for the entire period scheduled. Work missed due to any type of absence is the student’s responsibility. Three or more absences will result in a failing grade. Three late arrivals equals an absence. If you absolutely must miss class, email me in advance.

Late work

Every day a project is late it goes down one letter grade.

Code badges and in-class exercises
Late Codecademy badges and in-class exercises are worth 50% of what they are worth on time.

Reading questions
Late reading questions will not be accepted.


Extensions may be granted, through negotiation and discussion of individual situations, before the work is due. Please email me as far as possible in advance to request an extension.

Project grade adjustment

As long as you turn your projects in on time, you are eligible to increase your project grade. For each project, you have until the end of the semester to change any aspect. Please touch base with me if you would like clarification on what you can improve. Once you make your changes and you would like me to reassess your project for a new grade, please notify me.


Students should bring their own personal laptops to class. They should also be responsible for their own files, making sure to back them up in some way. For editing and updating code, we will use the code editor Sublime Text. For website hosting, we will use Github Pages. For code learning, we will use Codecademy. For image-making and sketching, Adobe Photoshop, Illustrator, and InDesign are standard tools that all CCA students have. Other good digital-image making tools include a phone, digital camera, scanner, screen capture, etc.

Learning Outcomes

By the end of this course, students will:

Updated on December 02, 2015