Single-page schedule

Intro

Monday

• Course intro
• Start Communicating design

Thursday

• Revisit typography and CSS

In-class typographic exercise (Thursday)

Take four or more lines from Robert Frost’s Mending Wall and set them in type, on one page, in a browser. Explore font choice, but also scale and how a reader experiences a web page over time, through scrolling.

Tips: think about making elements big, or surround them with negative space. Play with vw and vh units. Explore some of the known-good FOSS web fonts.

web1-basic (ZIP)

Affordances, signifiers, and feedback

Monday

(No class for Labor Day.)

Thursday

• Affordances, signifiers, and feedback
• Present Communicating design
• Start Travel

Reading

• Liz Stinson, Low-tech Magazine’s Solar-Powered Website is Rewriting the Rules of Web Design
• Don Norman on “The term ‘UX’” (2 min. video)
• Per Jørgensen, What is UX/UI design and what does it stand for?
• Flowcharts, excerpt from Dan M. Brown, Communicating Design (on Canvas)

This reading is for Thursday.

Prototyping / Grids

Monday

• Prototyping workshop
• Grid layout exercise

Reading (for Monday)

• Figma for Beginners tutorial, parts 1 and 2
• We’ll Miss You, MetroCard Machine (on the design and replacement of the NYC subway MetroCard vending machines)

Thursday

• Critique: bring in three concepts for Travel
• IDEO ATM redesign video
• Wireframing at usability.gov

IA intro

Monday

• Usability testing, studio, and small group critiques

Reading

• Everyday Information Architecture, ch. 3 (“Categories and Labels”)
• Figma for Beginners tutorial, part 3

Thursday

• Organizing information exercise
• Final critique for Travel
• Start Publishing systems

Type hierarchy and grids workshop

Monday

• Assess and discuss the GGWash site for Publishing systems
• Grids workshop

Reading

• On Web Typography, ch. 1 (“How We Read”) and ch. 2 (“How Type Works”)
• Figma Guide to Prototyping

Thursday

• Studio/critique
• For Publishing systems, share conceptual direction for your design, and show three proposals for design direction/color/type solutions (as style tiles, moodboards, or type samples and swatches).

Typography/image/layout

Monday

• Type, image, layout exercise

Reading

• On Web Typography, ch. 4 (“Choosing and Pairing typefaces”)
• Jen Simmons, Designing Intrinsic Layouts, An Event Apart DC 2019 (60 min. video)

Thursday

• Studio/critique
• For Publishing systems, show high-fidelity wireframes (comps) for two significantly different design approaches. Show at least two different pages for each. Have well-resolved decisions about type, layout, color, and scale. Make pages taller than one screen high—the web is a scrolling medium. Generate a draft site map.

Site maps

Monday

• Site maps
• Tips for site maps, and examples (completed site maps from class)
• Recap grids

Reading

• Nicole Nguyen, Behind Twitter’s Plan To Get People To Stop Yelling At One Another

Thursday

• Studio/critique

Studio

Reading

• On Web Typography, ch. 5 (“Typographic Systems”)
• Everyday Information Architecture, ch. 1 (“Systems of Organization”)

Microtypography, Mobile, and HTML/CSS

Monday

• Microtypography for screens
• Microtypography in HTML/CSS exercise

Reading

• Everyday Information Architecture, ch. 4 (“Site Structure”)

Thursday

• Mobile/responsive
• Mobile/responsive HTML/CSS exercise
• Mobile HTML/CSS examples (ZIP)

Studio

Monday

• Studio/critique

Reading

• Chappell Ellison, There’s Too Much Damn Content, and Slick UX Design Is Making it Worse

Thursday

• Final critique for Publishing systems
• Start Field guide

Navigation systems

Monday

• Field Guide evaluation
• From class: Field guide evaluation

Reading

• Everyday Information Architecture, ch. 11 (“Navigation and Wayfinding”)
• Kevin Roose, Is Tech Too Easy to Use?

Thursday

• Navigation systems
• From class: Navigation systems slides (PDF)
• Studio/critique

Layout and art direction workshop

Monday

• Layout and art direction workshop

Reading

• On Web Typography, ch. 6 (“Composition”)
• Lauren Barless and Jill Blackmore Evans, Bloomberg Businessweek Designers Explain The Magazine’s New ‘Sober’ Aesthetic
• Optional: Cliff Kuang, How a Band of Design Misfits Brought Anti-aesthetics to Bloomberg Businessweek

Thursday

• Studio/critique
• Layout–art direction demo files (ZIP)
• Share on Miro

Online critique / (Thanksgiving)

Monday’s class meets online.
No class Thursday for Thanksgiving.

Studio

Reading

• Can the Internet Survive Climate Change

Monday

• From class: Mushroom Color Atlas

Thursday

• Studio/critique

Last class

Monday

• Semifinal critique for Field guide