This course is an exploration of design for interactive entertainment. Students learn to combine principles of communication design, sequencing, and interactivity to create engaging user-centered experiences.
Weekly Course Outline
Wk 1: Lecture: Introduction and discussion of course content. What is meant by visual communication and interaction design. Platforms for digital entertainment. Genres of web-based entertainment Since this is a class about entertaining the viewer, part of your points will be based on entertainment value.
What is entertaining? What has "stickiness" and what makes you click? We'll explore different ways you can be surprised, entertained, amazed or bored. On which side will your final project end?
Lab: Group critique warm-up exercise. Explore samples of interaction design for entertainment.
Class exercise: without words, describe assigned phrase. Class is divided into two teams. A phrase from http://www.idiomsite.com/ will be given to non-verbally give your message. 10 minutes to plan, 10 minutes to present. This is an exercise in verbal communication.
Create a web page or blog to post assignments. Before end of class, give url to instructor.
Identifying Modes of Online Entertainment. .pdf
Research examples of the following entertainment sites:
Homework: Identifying Modes of Online Entertainment. Create a web page to present your findings.
Sequencing. What is it? Think of a book, a movie, a website. How do they move you through their pages/scenes? Think of your favorite piece of art. How does the artist pull you in and move your mind/view around?When you design into sequences - whether comic strips, illustrations for stage direction, layout for interior design, a book, a web site or a video you've created, you are using sequential imagery to tell your story. By considering how a viewer can best experience a series of designed pages, we can appreciate the nature of sequencing whether in walking through an exhibition or creating storyboards of an animation.We take our viewers on a journey and it all begins with navigation. How much does navigation - moving from one sequence or page to the next - hinder or help the story?
Case studies in Transitions:
Interesting site: (from Spooky): http://www.scifi.com/tinman/oz/
Interesting site: (from Adam):
Wk 3: Extra Credit (3 points): Attend “The Re-Ply Chair and Kickstarter: Crowdfunding Material-Driven Design” by faculty member Dan Goldstein today at 5-7, 10 UN Room 410
Lecture: Principles of sequential design. Transitions. Making transitions as captivating as the content. Are transitions possible in HTML or only in Flash? The THREE (and sometimes only TWO) phases of a transition are 1. conceal, 2. distract (optional), and 3. reveal. What makes a transition truly amazing?
Lab: Discussion on what transitions are and how they can be applied effectively.
Homework: Assignment #3: Transitions .pdf
More useful links: Parallax tutorial from Cody Byrnes: https://docs.google.com/document/d/1WwELtdaEZOxOu76rtbEMFZe4-PnrGU30sLfQZhTP64w/edit
Wk 4: Lecture: Media Rich. Types of media: static artwork, text, sound, video. Conventional uses, and cutting edge applications of these media.
Lab: Students choose an area to strengthen their media skills. Discussion ways to create interactivity.
Homework: Assignment #4
Wk 5: Lecture: Midterm, presentation of "Media Rich".
Lab: Discussion and research of final project in groups of 2-3 Example of final project documentation
Homework: Develop a Final Project proposal. Read chapters 5 & 6 of text. Due next week. Final project can be an interactive portfolio, a flash or coded "project" , a smartphone app, a website or ????.
Wk 6: Lecture: Creating user personas
Lab: Post online two personas useful to your final project. Individual meetings with instructor.
Homework: Research and document final project.
On creating personas: http://www.methodsandtools.com/archive/archive.php?id=117
Homework: Continue working on final project and documenting process. Add two page wireframes to your documentation.
Wk 8: Lecture: Aesthetic bliss: analyzing the visual aspects of your site.
Lab: In class critique of project prototypes. Video: Mobile First!
Homework: Continue work on final project and documentation. Create user testing for technical and user issues and bring to class next week.
Wk 9: Lecture: Usability Testing. Evaluation Tools. Community building
Lab: Usability testing by peers
Homework: Continue work, readings.
Wk 10: Lecture: Final exam.
Lab: General discussion of design and evaluation, communication, and advising systems.
Homework: Complete final project
Wk 11: Lecture: [Final] Formal presentation of Student Projects.
Lab: Critique of student projects.
Summer 2013 - Media rich group project: http://thedarklord193.aisites.com/Carousel/carousel.html
Adam Flores http://www.adamxv2.aisites.com/mm3301/ (blog) } Norcal Canoeing, promoting the art and sport of canoeing
Cindy Astorga http://www.cincity1980.aisites.com/mm3301/mm3301.html } Fashow, a virtual fashion maison
Jorge Portillo http://www.georgeportillo.com/
Jeramee Flemming http://jflem1290.aisites.com/entertainment_design/index.html } Co*lab, a dynamic student social network
Eleanor Encarnacion - http://eleanorninjaa.aisites.com/MM3301/
Bellas,Paul - http://bellaspaul.aisites.com/mm3301/ Hotel de Sejour Parfait | Promotion
Bowen,John - http://jbowen13.aisites.com/interaction/gallery/FullscreenGalleryThumbnailFlip/index.html | Interactive Portfolio | Promotion | promov1
Byrnes,Cody - http://codybyrnes.com/mm3301/
Fuller,William - http://wfuller.aisites.com/ | process
Gomez,Cesar - http://cjgomez.com/im/
Holtze,Reese - http://reez329.aisites.com/parallax/
Hui,Stella - http://wdimblogs.tumblr.com/ | http://stellahui.aisites.com/mm3301ide/
Nodado,Adrienne http://ageiscool.aisites.com/ide/| Back in the Day | process | Promotion
Zerga,Kelley - http://kzerga19.aisites.com/fall2012-entertainment_hwsite/ | Cheese Knowledge | Promo
|Oscar Barajas Promo | Interactive Resume|
|Roman Diaz Promo | Information|
|Rizal Dinglasan Promo | Information|
|Anqi Hong Promo | Information|
|Cynthia Kong Promo | Information | Example Unusual navigation|
|Richard Navarro Promo | Information|
|Adriana Nottestad Promo | fangs | Documentation|
|Ross Patton Promo | Information|
|Melissa Picardo Promo | Information|
|Ian Sayre Promo | Information|
Spring 2010 examples
Homework site - Michael Salvador
Final project: XML tacos
Research link: https://ritdml.rit.edu/handle/1850/6243