VC 241 Interactive Media

Lecture Hours: 2
Lab Hours: 4
Credits: 4

Presents an exploration of creating and implementing interactive experiences to communicate narratives and information on digital devices. Focuses on the principles and application of graphic design, user interaction design, and user feedback methods as they apply to digital experiences on touch devices (tablet and mobile) and desktop devices.

Prerequisite: CIS 133SC and VC 238, each with a grade of C or better; or consent of instructor.
Student Learning Outcomes:

Analyze and synthesize a set of complex interactive requirements to produce project plans, storyboards, and technical requirement documentation.
Compose and express narratives and concepts using text, imagery, motion, and user interaction.
Produce interactive designs that reflect current graphic design aesthetics and principles.
Apply user-centric design and usability principles to interaction design problems.
Describe and evaluate digital methods of delivering interactive content to desktop, tablet, and mobile devices.
Execute interactive design projects using current software, Web standards, and scripting technologies, and test on target devices.
Understand, evaluate, and apply technical requirements of current digital mediums.

Content Outline

Core Steps in the Interactive Design Process
- Background and research
- Project goals, desired user interactivity, and user tasks
- Ideas and creativity (brainstorming)
- Storyboards and wireframes
- Comprehensives
- Design presentation and self- and group-critiques
- Variations and refinement
- Design approval
- Implementation
- User testing and revisions
- Project launch
Interactive Design for Browser-Based Delivery
- Current use of technology
- Planning
  - Best practices in using motion for interactivity
  - Animation concepts
  - Understanding user input and interaction methods
- HTML5
  - Interactive features
  - Canvas element
- CSS3
  - Transitions rules and properties
  - Transformations rules and properties
  - Animating with CSS3
  - CSS3 Keyframes
  - Working with sprites
  - Adding motion to Web pages
- Animation tools
  - Survey of modern CSS3 animation applications
  - Features of CSS3 animations applications
  - Use of animation tools to create CSS3/HTML5/JS animations
- Scripting for interactivity
  - Simple JavaScript for user interactivity
  - External JavaScript libraries for user interactivity and animation
  - Mobile-focused external JavaScript libraries in tablet and mobile projects
  - Online research for solving common scripting problems
  - Script debugging
Interactive Design for Tablet and Mobile Devices
- Design theory and best practices
  - Fitt’s Law
  - Anticipating user actions
  - Consistency across interactive objects
  - Expected behaviour of objects
- Project planning and interactive considerations
- Project layout and design requirements
- Technical requirements
  - Targeting specific devices
  - Sizing and orientation considerations
  - Limitations
Preparing content for digital publications
- Web content
- Still photos
- Audio and video size and compression
- Interactive Content