Calendar

Upcoming Project Deadlines

  • Project 3 testing script, site plan, and A/V release posted to Basecamp by Thursday, 4/19 11:59pm CT

Course Overview; Valid, Semantic HTML

Week One

  1. Monday, January 8 Video

    1. Welcome & introductions
    2. Course policies & calendar
    3. Course technologies

  2. Wednesday, January 10 Video Board

    1. Valid, semantic HTML
    2. MDN HTML reference
    3. Forbidden tags/patterns
    4. ARIA roles and attributes in HTML
    5. HTML linting

Unobtrusive JavaScript; Form Elements, Data, and Events

Week Three

  1. Monday, January 22 Video

    1. Introduce Project One: Onboarding
    2. Form elements: accessible HTML structures

  2. Wednesday, January 24 Video

    1. MDN JavaScript and DOM references
    2. Unobtrusive JavaScript
    3. Form elements: data and events
    4. Events and the event loop
    5. The pattern attribute and JavaScript regular expressions
    6. JavaScript hinting and linting

Typography: Content, User Interface

Week Four

  1. Monday, January 29 Video

    1. Type classification and anatomy
    2. Resources at fonts.com

  2. Wednesday, January 31 Video

    1. Working with web fonts
    2. Using the Web Font Loader
    3. Typekit reference on OpenType features in CSS
    4. Setting type for content readability (vs. legibility)
    5. Form elements: CSS styling and the road to hell
    6. The form portion of Normalize.css

The New CSS Layout

Week Five

  1. Monday, February 5 Video

    1. Grid theory
    2. Prototyping and experimenting with grids

  2. Wednesday, February 7 Video

    1. Layouts, site contruction

Color and Material Design Systems

Week Six

  1. Monday, February 12 Video

    1. Color interaction
    2. Developing palettes
    3. CSS color models

  2. Wednesday, February 14 Video

    1. Taking colors from palette to designs

Git in Team Settings; Catching Up

Week Seven

  1. Monday, February 19 Video

    1. Introduce Project Two
    2. Git and GitHub in team settings

  2. Wednesday, February 21 Video

    1. Catch up and Q&A over any material covered so far
    2. Material design systems: Google, Apple (color)
    3. Developing custom style guides and systems

Designing for Touch; Motion and Effects

Week Eight

  1. Monday, February 26 Video

    1. Fingers and screens
    2. Gestures
    3. Discoverability and the geography of screens

  2. Wednesday, February 28 Video

    1. Keeping motion accessible
    2. CSS3 transition and animation properties
    3. JavaScript’s limited role
    4. Working with time

Activity Theory

Week Nine

  1. Monday, March 5 Video

    1. Activity theory and HCI

  2. Wednesday, March 7 Video

    1. Analyzing and designing for tasks within an AT/HCI framework
    2. Improving native form elements for user tasks

Spring Break; No Class

Week Ten

Review and Refresh; Prototyping Data-Driven Interfaces with JavaScript

Week Eleven

  1. Monday, March 19

    1. No class

  2. Wednesday, March 21 Video

    1. Enhancing user interactions with API data
    2. Accessing data APIs from the browser; CORS restrictions
    3. Understanding and parsing JSON API responses
    4. Assisting users without getting in their way

Usability: Guiding Principles, HCI Guidelines

Week Twelve

  1. Monday, March 26 Video

    1. HCI guidelines
    2. Scoping and planning a full-scale site
    3. Connecting steps in a process to URLs
    4. Loading HTML resources with AJAX to progressively enhance multi-page steps, using jQuery’s load()
    5. Serializing form data to DRY up your JavaScript, using jQuery’s serializeArray()

  2. Wednesday, March 28 Video

    1. Designing usable interfaces: seat selection (by request)

Ethics and Dark Patterns

Week Thirteen

  1. Monday, April 2 Video

    1. Ethics and users
    2. The role of emotions in design
    3. Improving the seating demo: parity with the input and chart; sanitizing user data

  2. Wednesday, April 4 Video

    1. Finishing the seating demo to make it responsive
    2. Form elements within responsive layouts
    3. The trouble with common RWD patterns
    4. Revisiting the grid

JavaScript-Backed Prototyping

Week Fourteen

  1. Monday, April 9

    1. No Class

  2. Wednesday, April 11 Video

    1. Prototyping interfaces with JavaScript (no back end)
    2. Writing, reading, and destroying cookies

Traditional Usability Testing Methods; Remote Testing, Experimental Builds

Week Fifteen

  1. Monday, April 16 Video

    1. Introduce Project 3
    2. Usability: testing your project, not users
    3. Fundamental testing methods

  2. Wednesday, April 18 Video

    1. Testing at a distance
    2. Experimental builds
    3. A/B testing

Parting Material: Assessing Front-End Libraries and Frameworks

Week Sixteen

  1. Monday, April 23 Video

    1. ITM survey distribution about 362 (first ten mins)
    2. Assessing front-end libraries and frameworks

  2. Wednesday, April 25

    1. NO CLASS MEETING. Stolley available electronically to provide help on final projects.