Art 442B Interactive Design III

442B Syllabus Spring 2019

Kathryn Bondi –

T/TH 6-9 pm • VAC 136

WEEK 1 –

Thursday, January 17:

Introduction: Syllabus, Projects overview. Introduction of first assignment, Assignment 1: Mailchimp—arts e-newsletter.

WEEK 2 –

Tuesday, January 22:

Project check; 7:45 p.m. crit for e-blast newsletter; Introduction of Assignment 2: App development; Adobe XD

Thursday, January 24:

Project 2: Lecture: UX design, problem proposal and creating personas – create 3 total

Persona exercises are hidden in everyday life:

What is a user story?

Create 2 user stories for each persona you create

WEEK 3 – 

Tuesday, January 29

Review ideas and personas. Start site map.

Thursday, January 31:

Card sorting and Style tiles


Tuesday, February 5: QUIZ #1

Begin plotting app screens in Adobe Experience Design (Xd)

UI discussion – resources on shared drive

UI elements in app building:

Thursday, February 7:

App work session/progress check


Tuesday, February 12:

App work session/progress check

Thursday, February 14:

App work session

Short lecture on Sketch vs. XD – benefits and drawbacks


Tuesday, February 19:

App project crit

Project 3: iPad interactive magazine.

Watch this example of an interactive magazine article for inspiration:

Thursday, February 21:

Review magazine outline/topic – Magazine lab

InDesign demo


Tuesday, February 26:

What makes an engaging story/layout?

Video editing, sound editing

Thursday, February 28: NO INSTRUCTOR

Lab – continue working on magazine


Tuesday, March 5

Demo on publishing; Progress check on magazine


Upload magazine to test

Thursday, March 7:

Load magazine to iPad; magazine crit;

Introduction of Adobe Animate Animate; Assignment 4: Animate


Tuesday, March 12: Spring Break

Thursday, March 14: Spring Break

WEEK 10-

Tuesday, March 19:

Animated infographics – storyboarding

Thursday, March 21:

Animation – review storyboards and import into AfterEffects

Basic AfterEffects tutorial


Tuesday, March 26:

Animation/progress check

Adobe AfterEffects tutorial for video editing/effects

Thursday, March 28:

Animation lab time


Tuesday, April 2:

Animation lab time/progress check

Thursday, April 4:

Animation Crit

Intro to Assignment 5a: Wireframes/Assignment 5b: Muse website

Muse Store Front/Small Biz Web site

  • for yourself or a friend that has original products, whether made up by you or actual items you make
  • at least 8 items with a legitimate ability to purchase (paypal, shopping cart, Shopify, etc.). It doesn’t have to function but it would be something that could be set up later.
  • SEO optimized: write meaningful copy, change page titles, use webfonts, alt text images, description and keywords
  • output both to HTML for final submission

Lecture on wireframing advantages, UI elements, and designing for “mobile first”


Tuesday, April 9:

Ecommerce wireframes – sketches on paper

Thursday, April 11:

Ecommerce wireframes transposed into XD

WEEK 14-

Tuesday, April 16:

Quick group crit –  XD wireframes

Begin 5b: Discuss applying wireframes to Muse website design, Muse walkthrough

Resource links:

Best screen size?

Free Muse tutorials on Adobe TV:

Muse tutorials:

Thursday, April 18: Easter break

WEEK 15-

Tuesday, April 23: 

Muse website

Thursday, April 25: QUIZ #2

Muse website, progress check

Week 16

Tuesday, April 30: GUEST SPEAKER

Guest speaker in the web development/design industry! (Posture Interactive)

Professional feedback on Muse site

Thursday, May 2:

Last day of class – Muse website lab

Finals Week:

Tuesday, May 7 (tentatively):

Muse critique/Final