Category Archives: Interactive Design

Interactive Design – week 11

Classroom

  1. Presentation: Marina
  2. Look at  any final animations for The Secret History of Halloween project
  3. Tutorials – drawing with vector and pattern brushesadding sound
  4. Discuss new project: Restaurant Ad
    1. Create an HTML 5 ad that advertises a restaurant
    2. Make it interactive, in that the user can click on different things to learn about menus, location, pricing, decor, and other amenities
    3. Use audio and video, if appropriate
    4. Use Code Snippets for interactive behaviors (demo)
    5. Create a storyboard for the Restaurant Ad Project for next class

Assignments

  1. Do Chapter 9 in book
  2. Create a storyboard for the Restaurant Ad Project

Interactive Design – Week 10

Classroom

  1. Presentation: Rik
  2. Look at  animations for The Secret History of Halloween project – make your final changes and turn this project in by next class
  3. Tutorial
  4. Here’s a sneak peek at the new project we’ll be starting next week: Restaurant Ad
    1. Create an HTML 5 ad that advertises a restaurant
    2. Make it interactive, in that the user can click on different things to learn about menus, location, pricing, decor, and other amenities
    3. Use audio and video, if appropriate
    4. Use Code Snippets for interactive behaviors

Assignments

  1. Do Chapter 8 in book
  2. Create a storyboard for the Restaurant Ad Project

Interactive Design – week 8

Classroom

  1. Presentation: Aaron
  2. Look at partial animations for The Secret History of Halloween project
  3. Talk about Chapter 5
  4. Work on project

Assignments

  1. Do Chapter 6 in book
  2. Work on Halloween Project

 

  1. Work on Self-promo tutorial.  Please note the image and video we are using are different than those in the tutorial. Download the video above and the still image to the right.

Interactive Design – week 7

Classroom

  1. Presentation: Anthony
  2. Look at any final tweaks that have been done to ads
  3. Look at storyboards for The Secret History of Halloween project
  4. Talk about Chapter 4
  5. Work on project

Assignments

  1. Do Chapter 5 in book
  2. Work on Halloween Project
 

 

Classroom

  1. Presentation by Carlos, Joseph – make comments in forum
  2. Look at any Rodeo Projects we haven’t seen yet
  3. Discuss Interactive Bunny Card Project

Beginning

  1. Continue work on Self-promo tutorial.  Please note the image and video we are using are different than those in the tutorial. Download the video above and the still image to the right.

Assignment

  1. Work on Interactive Bunny Card Project – draft due next week
  2. Do chapter 6 and turn your work in to your Google Drive folder

Advanced

  1. Continue work on this tutorial. Download these exercise files

Interactive Design – week 6

Classroom

  1. Presentation: Liz
  2. Look at first draft of animations for Project 1
  3. Assign new project: The Secret History of Halloween
    1. Do a project where you relate a story (real or imagined) about the Halloween holiday. Use any combination of text, video, music, audio, sound effects, animation, and images to create your project. Create a storyboard for your project for next week.
  4. Begin talking about Chapter 3

Assignments

  1. Do Chapter 4
  2. Do any final tweaks to your ads and turn them in
  3. Work on Halloween Project

Beginning

  1. Begin work on Self-promo tutorial.  Please note the image and video we are using are different than those in the tutorial. Download the video above and the still image to the right.

Advanced

  1. Look at Rodeo Project
  2. Begin work on this tutorial download these exercise files

Interactive Design – week 5

Classroom

  1. Presentation: Carlos
  2. Look at partial animations for Project 1
  3. Discuss Chapter 2
  4. Discuss Multimedia Formats & Funding Options:
    1. Presentation
    2. Web apps
    3. Mobile platforms, Mobile apps, Proprietary
    4. Crowdfunding: Kickstarter, IndieGoGo, Patreon (Jason Brubaker), TLC

Assignments

  1. Do Chapter 3
  2. Work on final animation for your ad
  1. Presentation by Botond – make comments in forum
  2. Discuss these aspects of sound

Beginning

  1. Look at first draft of Rodeo Project

Assignment

  1. Complete Rodeo project
  2. Do chapter 4 and turn your work in to your Google Drive folder

Advanced

  1. Look at first draft of Rodeo Project
  2. Download this video and discuss strategies for importing video and audio into projects, including ActionScript for stopping sounds

Assignment

  1. Complete  Rodeo project
  2. Do chapter 10 in the book and turn in your work to Google Drive

Interactive Design – week 4

Classroom

    1. Look at ad mock ups you made. Make suggestions for changes
    2. Adobe Audition tutorial – download this file
    3. Look at Chapter 1
    4. Discuss Multimedia Formats & Funding Options:
      1. Presentation
      2. Web apps
      3. Mobile platforms, Mobile apps, Proprietary
      4. Crowdfunding: Kickstarter, IndieGoGo, Patreon (Jason Brubaker), TLC

Assignments

  • Make suggested changes to your mock ups and do partial animation
  • Turn in Chapter 1 to your Google Drive and work on Chapter 2

Beginning

  1. Look at final animations for ads
  2. Adobe Audition tutorial – download this file.
  3. Download this file and demo how to create a simple Motion Path
  4. Look at masks, importing music and/or sound fx, motion presets, ActionScript (download and work on this file)
  5. Assign Rodeo Project:
    1. Create an ActionScript 3 project that will be presented on a video kiosk in a mall. Make it an advertisement for a Rodeo-related product or service, such as: cowboy hats, rodeo clown makeup, pony rides, etc.
    2. Make your stage 960px wide x 600px high
    3. Use motion paths, motion tweens, music and/or sound effects
    4. Don’t forget a call to action

Assignment

  1. Work on Rodeo project
  2. Do Chapters 3 and turn your work in to your Google Drive folder

Advanced

  1. Look at final animations for ads
  2. Download this video and discuss strategies for importing video and audio into projects, including ActionScript for stopping sounds
  3. Assign Rodeo Project:
    1. Create an ActionScript 3 project that will be presented on a video kiosk in a mall. Make it an advertisement for a Rodeo-related product or service, such as: cowboy hats, rodeo clown makeup, pony rides, etc.
    2. Make your stage 960px wide x 600px high
    3. Use motion paths, motion tweens, music and/or sound effects
    4. Your project should have a “homepage” and three additional tabs (or buttons) users can click on to go to other “pages” of the ad. You should use video on one page and music on another.
    5. Don’t forget a call to action

Assignment

  1. Work on Rodeo project
  2. Do chapter 9 in the book and turn in your work to Google Drive

Interactive Design – week 2

Classroom

  1. Attendance, introductions and review syllabus. Turn in  syllabus acknowledgement form
  2. Create an account for the Dreamco website. Create a Google Drive folder called “DAR252 your name” and share with me (gjloumeau@pima.edu). Talk about reports and presentations. Show schedule.
  3. Check out Bannersnack
  4. HTML 5 banner ad examples
  5. Article about creating banner ads in 2018
  6. 50 tips for designing the perfect web banner ad
  7. No class next week – Labor Day

Discussion (we’ll talk about some of this in two weeks)

  1. Presentation
  2. Discuss Multimedia Formats & Funding Options (we may discuss these topics next week, if we run out of time today)
    A. Web apps
    B. Mobile platforms, Mobile apps, Proprietary
    C. Crowdfunding: Kickstarter, IndieGoGo, Patreon (Jason Brubaker), TLC

Assignments

  • Buy the book, read the introductory pages and do the first chapter – turn in any work to your Google Drive folder
  • Make a mock up for an ad that will eventually be animated for a website (create some elements that can be animated like text and object and think about how you want to animate them). Here are some examples:
    1. Non-animated, use for reference – example ads
    2. Non-animated, use for reference – I made these for you to download and they are at the proper sizes – sample ads. Use Photoshop and format your ad for 3 different sizes:
      1. 728 x 90 px (desktop)
      2. 468 x60 px (tablet)
      3. 234 x 60 px (mobile)
    1.  

Lecture

Lecture video