INFO24857 Computational MediaFall 2018 / Bachelor of Interaction Design

First draft

project 2 / worth 30% of your course grade / due week commencing 5th November

Overview

By the end of this course students will have demonstrated the ability to write simple computer programs and modify complex source code in order to implement their interactive design concepts.

To achieve this, project 1 will contain short and simple exams to ensure you have the base knowledge to work from. The reason for not making this project based is because if you already know some code, you are likely  to stick with what you know and being forced to learn some wider aspects will give you a better breadth and platform to work from in the future. Being able to recall this  information will better your scope of projects.

A crib sheet will be allowed in the exam to help you answer the questions.

The Playful Experience

You are to identify a simple series of information and present it to the user in an animated/ interactive 3D format. It is suggested that you use information from 350.org. Information can be found here on the Climate Impact Fact Sheets:

https://350.org/science/

Under point 4 you will find 5 categories:

1. Extreme Heat

2. Ocean Warming + Acidifcation

3. Storms

4. Sea Level Rise + Melting Ice

5. Habitat

Choose one of these areas. Using information from these fact sheets you must present it to the user in an interesting and interactive way using WebGL in the browser. How can you make people care about this cause? Choose  a target audience – how do you make it relevant?

Past Projects

Kevin Chinbuah

– http://phoenix.sheridanc.on.ca/~ixd1953/w ebwork5/index.html

Jakob Peters

– http://phoenix.sheridanc.on.ca/~ixd2028/35 0_final/

Luca Scarce – http://phoenix.sheridanc.on.ca/~ixd2517/proj

ect1_prototype/#

Gianfranco MacCagnan –

http://phoenix.sheridanc.on.ca/~ixd2815/Cora lBleachingFixed/

Alexandra Thompson – http://phoenix.sheridanc.on.ca/~ixd2774/stor mbox_thompson/

JJ Bastida – http://phoenix.sheridanc.on.ca/~ixd2822/shor eline_mayhem/index.html

Deliverables

• Identify the theme of your project

Choose your climate change area and how that will work for the user, flowcharting the user flow of the experience from start to finish

• Graphic mock up

Graphically show the finished design of your project, including logo’s, buttons, 3D models/ illustrations, you will work from this to create your design in code

• Create a rough draft, working code prototype

Showing the basic functionality, this can be with placeholder cubes rather than finished models

Policy on Use of Sourced Materials

Use original images, icons, logos. Use text from 350.org. Code must NOT be taken from finished websites. You may however use code snippets, cite using comments in the code, HTML comments:

<!--Start of code from xxxx --!>
<!--End of code from xxxx --!>

In CSS + JS:
/* Start of code from xxxx */
/* End of code from xxxx */

Delivery Format & InstructionsThe theme and userflow should be a single PDF file with a list of citations of any work that is not your own on the last page. PDF submitted to the Assignment Folder in Slate. PDF must be named:LastName_FirstName_IXD1_Project2.pdfThe HTML/CSS pages will be uploaded to your hosting on the Firebird Server with a link posted in the Assignment Folder in Slate. Zip files of code submitted to Slate will not be accepted.

Schedule

week 8 commenicng October 29: Tween a texture on click Timing in JS – in class exercise

week 9 commenicng November 5: Hand project in at the beginning of class, Controlling a model from a slider, Clouds and Smoke

Project Learning Outcomes

Add the course learning outcomes that will be demonstrated through this project.

• Incorporate the basic terminology and methodologies of Object Oriented Programming in

• the creation of simple visual compositions.

• 2. Integrate knowledge of the application development environment into design solutions.

• 3. Write original computer scripts to create simple visual compositions.

• 4. Modify existing source code to create interactive design sketches and prototypes.

• 5. Assess the relevance of different computer languages as applied to interactive design problems.

• 6. Integrate knowledge of industry roles in programming and design processes.

• 7. Exhibit professional attitudes and behaviours

Evaluation Criteria

• Planning of appropriate information, 25% of project grade Demonstration of a logical user journey and/or presentation of information to the user, to achieve the optimal user experience. Think about the experience from the start screen through to what you present to the user as they finish the experience, as well as the stages along the way. You could demonstrate this through a storyboard or screen flow. (LO 1, 2, 5, 6)

• Graphical development, 25% of project grade

A realistic design based on what will be achievable through the code libraries you select, UI fully designed, graphics fully designed. This will be an image depicting the finished design approach (LO 2, 5, 6, 7)

• A working draft, 25% of project grade

Using code to demonstrate a very simple user journey through, perhaps with placeholder graphical primitives until final media  is in place (LO 1, 2, 3, 4, 5, 6 & 7)

• Relationship between user journey and draft, 25% of project grade

Can a resemblance of the user journey be seen in the draft (LO 1, 2)