Interactive Two

September 1 - December 12, 2022
Monday / Thursday
4:00 PM - 7:00 PM
San Francisco - Grad Center - GC3

Course Overview

Interactive 2 focuses both on continuing to learn the technical foundations of designing for interactivity, while being more critical of how technology impacts our lives. We will focus on the browser as an environment for design and consider how to apply our design skills in that context, focusing on how the browser can be used as a tool for creative expression and communication. We will particularly focus on mastering typography on the web.

Through projects, readings, workshops, and presentations we will explore the relevance of network technologies in the context of contemporary art and graphic design practices.

Students will continue to learn HTML, CSS, and JS programming along with methods for conceptualizing, designing, and developing websites. While outcomes won't necessary be practical, we will give focus to designing conceptually sound and technically proficient outcomes.

This course has a formal emphasis, using what knowledge students have about composition, typography, and hierarchy as a basis for graphic design work in the browser.

Catalog Description

In this course, students extend their ability to create dynamic, interactive design for screen. They explore questions of form: Is it specific? Is it memorable? Does it communicate its idea through its form? And of function: Does it work? Were there unintentional breaks that prohibited its communication? Interactivity is not merely an answer to the question "What happens when I press the button?" It is prompt and feedback. It is design for multiple conditions, design for variable sizes and devices, and design within living, social ecosystems.

To achieve this, students solidify their knowledge in HTML and CSS, the building blocks of websites, and then learn the basics of JavaScript and how to use existing code libraries and APIs to inform their designs.

Material Requirements

• a computer you can do your work on
• a text editor (Sublime Text, etc)
• CCA Fluxus hosting and a FTP client (Cyberduck, etc)
• software for image/media generating, editing, and prototyping, Figma, Adobe XD, Sketch, Photoshop, your choice.
• Zoom for video calls

We will be using Sublime Text and CCA Fluxus hosting for writing and hosting our code this semester, we will get this set up in class together.

Crit Format

Crits will be conducted in class. I will assign a random order for crits, and each student will be asked to begin the discussion of another students project.

Readings

Throughout the duration of the course, groups of readings (and sometimes videos) will be given. For every reading, each student must submit 3 questions or 3 sentences to that week's reading thread before start of class the day of the assigned reading discussion.

Class Activities

Class sessions will generally consist of the following activities.

• Lecture
• Studio work time with check in's with the instructor
• Small group meetings
• Project critique/discussion
• Group discussions

Evaluation

In this class, students will strive to make memorable and 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. Excellent craft in both code and design is important and expected. Taking risks is encouraged.

70% ... Projects
15% ... Exercises and Participation
15% ... Readings

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.

Late Work

• Every week a project is late it goes down one letter grade.
• Late reading questions or observations will not be accepted.

Attendance

Students are expected to complete readings, Code Academy exercises, and lectures by the class period they are posted as being due. Work missed due to any type of absence is the student's responsibility to catch up on. If you absolutely must 'miss' class, email me in advance so we can discuss it.

For more detail about attendance policies, you can refer to the College Handbook.

Plagiarism

Students are expected to follow CCA's plagiarism policy. Further, here's some additional guidance in the context of Interactive II.

Code

Remixing existing code is often an important part of learning, but any code you take from an online resource needs to be commented with the source location where it appears in your project. For example:

For HTML

<!-- source: http://coolthings.biz/cool_thing -->
<div id="coolThing">
    does a cool thing.
    <div id="helpsDoACoolThing">
    </div>
</div>

or for CSS

/* source: http://coolthings.biz/cool_thing */
#doesACoolThing {
    cool: thing;
}

or for Javascript

// source: http://coolthings.biz/cool_thing
function doACoolThing(){
    does a cool thing.
}

Further, when using found code make sure that your use of it is appropriate to your project, and outside code should not dictate the design of your projects as experienced by the user. If the function or style of your site is identical to your source, that is likely a problem. Any snippets of code from a lecture or a glitch of mine you are free to use. If you are unsure if your reuse of code is appropriate, ask!

Design

You may not use graphics, images, video, audio, or any other design elements that you did not create yourself, or that are obvious recreations of others work, with the possible exemption of:

• Graphics such as a Facebook or Twitter icon in reference to those sites, etc, and that only in accordance with those organizations guidelines for such an elements use. In such cases those graphics should be a minor element in your design.
• If an assignment requires you to display found imagery and it is properly attributed.
• Use of imagery in the Creative Commons that is cited and used based on its license.

If you are unsure if the use of a design element is appropriate, ask!

Written Content

Unless stipulated by an assignment, or approved by the instructor, all written content should be written by you. If it is approved by the instructor, make sure to cite the text appropriately.