Tuesday/Friday

Tu 30 Aug #01

Topics

• Introduction to design for interaction

Projects

• Start Communicating design ★

Hey!

There’s reading due for next class! It’s listed under next class’ entry.

F 2 Sep #02

Topics

• Capturing meaning with HTML/CSS typography

📎 First site: Basic site, Text Fixer

Reading

• Frank Chimero, Designers vs Coding
• HTML & CSS, ch. 1 (available for download)

Projects

• Start Recipe ★

Tu 6 Sep #03

Topics

• The box model

Reading

• Don't Fear the Internet:
  Not a Series of Tubes and HTML (video)
• HTML & CSS, ch. 2, 3

Projects

• Present Communicating design ★

F 9 Sep #04

Topics

• HTML/CSS box model (more on white space and DIVs)
• Classes and IDs
• Type

📎 Layout/typography demo (ZIP), complete (ZIP)

Tu 13 Sep #05

Topics

• File structure
• Images

📎 Positioning and image demo: Example vector images (ZIP); Complete image demo (ZIP)

Reading

• HTML & CSS, ch. 12
• How to Survive a Critique: A Guide to Giving and Receiving Feedback

Projects

• Complete all HTML and some design/CSS for Recipe; some studio work in class

F 16 Sep #06

Topics

• Watch Objectified
• DIVs and boxes

Reading

• UX Sketching
• The Lost Art of Thumbnail Sketches

Projects

• Start Content and form ★
• Some studio work on Recipe

Tu 20 Sep #07

Topics

• Positioning
• Links

📎 Links demo: Links files (ZIP)

Reading

• HTML & CSS, ch. 5

Projects

• Turn in Recipe ★
• Choose two or three possible articles for Content and form

F 23 Sep #08

Topics

• Multicolumn pages
• Grids and visual relationships

📎 Multicolumn layout demo: start (ZIP), complete (ZIP). Grid slides (PDF)

Reading

• HTML & CSS ch. 16 (layout)

F 30 Sep #10

Topics

• Sketching and process
• Color models

Projects

• Content and form: present three options for design concept as style tiles

Tu 4 Oct #11

Topics

•  Studio
• Building layouts

📎 Layout exercise: start (ZIP)

Projects

• Content and form: present refined version of one design concept

Reading

• Frank Chimero, What Screens Want

F 7 Oct #12

Topics

• Information architecture, navigation, naming, and site maps

Projects

• Content and form: show working template for one page

Reading

• HTML & CSS ch. 18

Tu 11 Oct #13

Topics

• HTML/CSS menus

📎 Navigation demo: start (ZIP), complete (ZIP)

Projects

• Have refined design for front page and inside page

Reading

• Don’t Make Me Think ch. 6

Tu 18 Oct #14

Topics

• Background images
• Selectors; reviewing floats

📎 Float demo: start (ZIP)
📎 Selector/background demo (ZIP), complete (ZIP)

Projects

• Content and form: show working templates for all pages

Reading

• Don’t Make Me Think ch. 2, 3

F 21 Oct #15

Topics

•  Studio

Reading

• Don’t Make Me Think ch. 4, 5
• Optional: Descendant selectors (see also enormous list of selectors on MDN.)

Tu 25 Oct #16

Topics

• CSS selectors
• Backgrounds, shadows, and details
• 📎 CSS details, complete (ZIP)

Projects

• Content and form: add content

F 28 Oct #17

Plan

•  Studio

Projects

• Content and form: add remaining content

Tu 1 Nov #18

Topics

• Mobile/multidevice

📎 Responsive demo: start (ZIP), complete (ZIP)

Projects

• Optional critiques for Content and form

F 4 Nov #19

Topics

•  Studio

Projects

• Turn in Content and form ★
• Start Conference ★

F 11 Nov #21

Topics

•  Studio

Tu 15 Nov #22

Topics

•  Studio

F 18 Nov #23

Topics

• Intro to JavaScript

📎 JavaScript intro: jQuery documentation,
Basic JavaScript + jQuery demo (ZIP),
Basic JavaScript + jQuery demo, complete (ZIP),
JavaScript scene demo (ZIP),
JavaScript slides (PDF)

Projects

• Conference: critique final style tile and rough sketches for page layout

Tu 22 Nov #24

Topics

• JavaScript: evaluating and using an existing script
• CSS transforms and transitions

📎 Script: Unslider demo (ZIP),
Unslider demo, complete (ZIP)

Projects

• Conference: critique refined sketches for every page type

Tu 29 Nov #25

Topics

• Coding accessibile sites
• Design for accessibility
• Website hosting and CMS concepts

📎 Accessibility example (ZIP), 🌄 Hosting slides (PDF), 🌄 CMS slides (PDF)

Projects

• Conference: critique HTML/CSS work (finished typographic system, navigation system, and one page layout)

F 2 Dec #26

Topics

• Speaker: B Cordelia Yu
•  Studio

Tu 6 Dec #27

Topics

•  Studio

F 9 Dec #28

Topics

• Intellectual property for designers
• Future
• Group critique semifinal project

Reading

• Optional: look at AIGA Standard Contract