πŒ†

Course Overview

Knowledge is of two kinds: we know a subject ourselves or we know where we can find information upon it.

~Samuel Johnson

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?
  • How can we best use our knowledge of code’s relationship to the web to communicate the idea?
  • As designers, how can we develop personal voice through content as well as form?
  • 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?

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

Today interaction online focuses on information through living, social platforms. We will go beyond an average user’s perspective to critically examine the web through historical, political, and social lenses. This course encourages students to holistically approach the web and its constituent code as a living kit of parts patiently waiting to be harnessed in novel and innovative ways.

We will explore design principles relating to dynamic media and understand how good design should take advantage of the web both formally and conceptually. We will create accommodating, flexible systems that will change in response to its environment and users.

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 was developed with Chris Hamamoto and Mathew Kneebone and is based on Laurel Schwulst's Interactive 2 Course and Syllabus with additions by Mindy Seu.

Course Requirements

This course is a required course for graphic design majors. It is open to students who have taken (or are taking concurrently) Graphic Design 2 (GRAPH-216), Typography 2 (GRAPH-220), and Interactive I (GRAPH-228-01). Knowledge of HTML and CSS 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.

Learning Outcomes

By the end of this course, students will:


  • Understand the web as its own public space
  • Understand design principles unique to dynamic media
  • Be familiar with a range of contemporary art and design practices online
  • Feel proficient in HTML and CSS
  • Have working knowledge of JavaScript
  • Have complete, well-documented online projects of their very own

Material Requirements

  • Personal Laptop
  • Sublime Text for editing and updating code
  • Github pages for website hosting
  • Adobe CC for image/media generating and editing
  • Phone, digital camera, scanner, screen capture etc.

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 Google doc (viewable in the Schedule section of this website) before 4pm the day of the assigned reading discussion.

Exercises

Class exercises are homework assignments that will teach you the specific skills, usually coding techniques, that you will need to learn in order to build your projects. Class exercises are generally assigned once per week, and they usually correspond to specific parts of your projects.

Class exercises are listed at fall2019.will.graphics.

In-Class Activities

Tuesdays generally consists of any combination of the following:

  • Reading presentation/discussion
  • Topic lecture/discussion
  • Project critique/discussion
  • Group activity

Thursdays generally consists of any combination of the following:

  • Skill based workshop
  • Personal working time
  • One on one meeting

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.

Grading

Your final grade is made up of the following components.

60% ... Projects
20% ... Exercises
20% ... Reading Presentation and Participation

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.

Late Work

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

Attendance

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 arrivals later than 15 minutes after class begins equals an absence. If you absolutely must miss class, email me in advance so we can discuss it.

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 on fall2019.will.graphics 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.

Submitting your work

Any exercise or project that you submit for grading must be uploaded to your class website before each class. Even if you are done with your work on your local computer, it will be considered late work if it is not visible on your class website.

If a project is not uploaded on time, it will be docked one letter grade per class meeting that it is late. You can resubmit your work at the end of the semester with revisions to be regraded so long as it was turned in on time.