Interactive Design

AR589 — Spring 2018

This course will explore interactive design through web technologies (HTML, CSS, JavaScript). While applying your design skills to this medium, you will develop a basic an understanding of the technology behind the web, understand how to navigate the constraints and opportunities of the medium, and become comfortable executing your ideas in code.

Class Resources

AR589 Starter Slack Syllabus

Week 14

Final Critique

Submit Assignments

Week 13

This week we cover some resources to keep learning and stay inspired.

Reference

Week 12

This week we talk about JavaScript Objects, Events, and the Document Object Model (DOM).

Reference

Resources

Week 11

This week we get started on Assignment 3.

Reference

Assignment 3

A Creative Weather App

Using the provided starter project. Make a working weather web app.

Requirements

  • The user must be able to search by city.
  • Use all the skills you've accrued thus far. Images, animations, etc.
  • Your design must be responsive.
  • Due April 27

Week 10

This week we were joined by guest speaker Ethan Marcotte.

Resources

Week 9

Assignment 2 Critique

Submit Assignment 2

Week 8

We're back from spring break and ready to dive in and start learning JavaScript!

Reference

Resources

Week 7

This week we learn about CSS animation and encounter a tiny bit of JavaScript.

Reference

Resources

Week 6

This week cover user experience and introduce Assignment 2.

Reference

Assignment 2

Movie App Interface

Create a responsive multi-page experience that will guide a user through selecting from a list of movies and purchasing tickets.

Requirements

  • Movie listing page
  • Movie detail page
  • Buy tickets pages
  • Due March 23

Week 5

This week cover launch our first website, dig in to images

Reference

Design Challenge

Make a type specimen webpage for a web-safe font.

Requirements

  • At least 3 different type sizes
  • Display and body copy
  • At least regular bold, and italic styles
  • Special characters
  • Must be responsive

Examples

Week 4

Assignment 1 Critique

Submit Assignment 1

Week 3

This week cover the design process, responsive design, Tachyons, and Git.

Reference

Assignment 1

Find a longform article and create a design using HTML and CSS to enhance the viewer’s understanding of the content.

Requirements

  • At least 3 images
  • At least 1 pull quote
  • At least 750 words
  • Must use Grid for layout
  • Must be responsive
  • Due Feb. 9

Week 2

This week we learn about a couple of new HTML elements and get acquainted with CSS.

Reference

Resources

Week 1

This week we get set up and get our feet wet with HTML.

Reference

Software