IML 400 Spring 2014

Assignment 5: Interactive Storytelling, Javascript and JQuery

Individual assignment.

Redo the same story from your previous assignment (it is ok to change it if you want) using simple animated interface effects and transitions. Sketch out your design on paper.

Assignment Due Date

Web page: Tuesday, February 18th, 9:00am.

Please upload your page to your storm site and provide a link for it from your index page.

Resources

Eloquent Javascript
Javascript History
JQuery
JQuery UI

Sample Code (more to come)

• Array Shuffle - Basic JS Animation example (Covers arrays, functions and timers)
• A sortable grid - based on this demo
• An accordion template - based on this demo
• A fading slideshow template - based on this demo
• A swiping slideshow template - based on the previous template and this demo
• A background slideshow using animated gifs

Readings

• 4chan and /b/: An Analysis of Anonymity and Ephemerality in a Large Online Community
• Basic JavaScript: values, variables, and control flow
• Functions
• Web programming: A crash course

Upload a reading report on the 4chan paper. The next three readings do not require a report and are meant to serve as support for your assignment. We will discuss them in class.

Reading Due Date

Web page: Tuesday, February 18th.

Reference Links (Optional)

Apple OS X Human Interface Guidelines - UI/UX Design
Iutopi - Parallax effect example
Jess and Russ - Parallax effect example
Bloom.io - Parallax effect example
oGFx - Effects: Integrated Fade and Accordion Example
Widget Customizer - Effects: Slidebar Example