harryfishernz

[harryfishernz]

More expressions of movement

[harryfishernz]

More from Lois Greenfield

[harryfishernz]

I have begun looking into Freeze-Frame photography for my first project of MDDN 241. When researching, I came upon the work of Lois Greenfield. Her work with dance and movement is very interesting especially in the way she captures the motion of materials manipulated by the human body.

[harryfishernz]

I have adjusted the frame that includes the words of the poem, making it longer and have shortened the poem to the necessary part which I drew inspiration from as noted.

[harryfishernz]

Mentioned Reference in Summary

I know this is quite late, however on the hand-in day, I was unable to find the link I had gained the knowledge to scroll across. Instead I had left a note saying this.

I have now found the link: http://jsfiddle.net/arunpjohny/EKVJc/ 

This JS-fiddle helped me to write a drag/scroll function. I had to change quite a bit of the code in order to scroll/drag across rather than scroll/drag down. I apologies for this late note and hope it does not affect my grade.

[harryfishernz]

Summary

EMOTIONS and REFERENCES

At the start of this project, I brainstormed what really brought out emotions. I found that extreme and severe events or journeys can trigger multiple dominant emotions (referring the the 6 universal emotions). I decided to draw inspiration for my Zine, which I later turned into a Web-comic, from the setting of a Zombie Apocalypse and combined that with the personal task of going from Te Aro campus to Kelburn campus everyday.

The main emotions I covered in my Zine were: Anger/Frustration, Terror, Sadness, Happiness along with other emotions such as confusion. All of which might be more common in radical situations such as what I chose.

I knew the style of drawing would also have a major effect on the emotions portrayed. For example, minimalist drawing styles such as Chibi could be seen to portray the emotions of happiness and excitement, however, would struggle to emit harsh emotions such as anger. I needed to take this into consideration when deciding on a style. What I chose, I feel can display a range of recognizable emotions fairly well.

In order to really portray these emotions in my characters, I needed to focus more on what specifically caused these emotions to change.

I also needed the viewer to really connect with these emotions in order to make a good product. A way I thought of doing this in the web-comic stages of this project was to engage with the viewer and allow them to come along on this journey. I aimed to achieve this by creating an interactive experience where by the viewer could click on certain parts of the scene to discover more and to gain a connection with it resulting in a relationship with the characters and their current emotions.

    ·         http://www.ted.com/talks/scott_mccloud_on_comics.html

·         The Walking Dead Comic Series

·         http://www.drewweing.com/pup/13pup.html

·         http://www.nawlz.com/

          http://jsfiddle.net/arunpjohny/EKVJc/ 

[harryfishernz]

Here is the final version of my Web-comic.

I have added a scrolling bar along the top that is very smooth and does not attract the eye too much. In order to separate the additional scenes away from the storyline, I have changed it so that instead of clicking on them, the viewer clicks and holds. Upon release, the additional scene disappears. This also helps the scroll function as the distance from the start to the end does not change any more.

[harryfishernz]

Customizable Scrolling

I have found a Jquery based library that allows for customization in the scrolling feature. I find the default scroll bar does not fit with the colour pallet of my website and sticks out. Using this website, I should be able to create an alternative scroll bar 

http://manos.malihu.gr/jquery-custom-content-scroller/

[harryfishernz]

Website functions incomparable with each other

After attempting multiple ways of trying to apply both a meter system indicating where you are in the comic as well as the expanding paths (increasing the length of the scroll), I have found that they are incomparable with each other. For example, The meter system would function if the story was not expandable, however, when you click on one of the buttons, it expands the length of the comic, therefore taking longer to reach the end. As the meter would be a set length, the marker will go past the end if it is not adjusted.

I have decided the feature that is most important is the interactive experience of expanding the story. This emphasizes the main idea of controlling the story and how the viewer is able to alter the narrative and in doing so eliminating a linear structure to the story. To keep this feature, I will eliminate the scrolling idea.

To indicate the length of the journey, instead I will look into inserting a simple scrolling function. This would also allow the viewer to scroll faster through the story, allowing more freedom to the user.

[harryfishernz]

Here is my final hand-in for this project including titles, references, credits and the animation itself

[harryfishernz]

Here is my final animation alone. 

[harryfishernz]

Final landing scene. I created an additional directionalLight() aimed at the sky to make the cloud more visible. Instead of the die rolling and being loaded, I found the best way to show the same idea of the Angel of fate taking control, would be for the die to pause in mid-air, turn around then slam down. 

CODING: 

import saito.objloader.*; int numsides = 2; PImage[] side = new PImage[numsides]; float i = 0; float fall =-600; float y = 0; PImage stars; PImage clouds; PImage boardgame; PShape terrain; PShape backdrop; void setup() {   size(1280, 720, P3D);   noStroke();   smooth();   clouds = loadImage("clouds.png");   stars = loadImage("stars.png");   terrain = loadShape("terrrain.obj");   side [0] = loadImage("dicetexturelive.png");   side [1] = loadImage("dicetexturedie.png");   backdrop = loadShape("backdrop.obj");   boardgame = loadImage("boardgame.png");   textureMode(NORMAL); } void draw() {   saveFrame("frames2.0/####.jpg");   background(0);   directionalLight(150, 150, 150, 0, 0, -2);   directionalLight(204, 204, 204, width/2, 400, 200);   directionalLight(204, 204, 204, width/2, -500, -1);   camera(width/2.0, 400, (height/2.0) / tan(PI*50.0 / 180.0), width/2.0, height/4.0*y-10, 0, 0, 1, 0);   pushMatrix();   translate(2290, height, 1100);   terrain();   popMatrix();   pushMatrix();   translate(600, height, 100);   boardgame();   popMatrix();   pushMatrix();   translate(1200, 400, -500);   rotateX(-.2);   backdrop();   popMatrix();   pushMatrix();   translate(width/2, height/2);   scale(2000);   beginShape(QUADS);   texture(stars);   // -Z "back" face   vertex( 2, -1, -1, 0, 0);   vertex(-2, -1, -1, 1, 0);   vertex(-4, 3.6, -4, 1, 1);   vertex( 4, 3.6, -4, 0, 1);   endShape();   beginShape(QUADS);   texture(clouds);   // -Y "top" face   vertex(-1.5, -1, -1, 0, 0);   vertex( 1.5, -1, -1, 1, 0);   vertex( 1.5, -1, 1, 1, 1);   vertex(-1.5, -1, 1, 0, 1);   endShape();   popMatrix();   if (fall<400) {     fall+=35;     i+=.09;   }   if (fall>400) {     i-=.019;      fall+=.019;   }      if (i<=0) {    fall+=35;    }      if(fall>=550){     i+=0.019;    fall-=35.019;    }      if (y<=2.5) {     y+=.085;   }   translate(width/2, fall, -100);   rotateX(-i/1.4);   rotateY(i/5);   scale(90);   TexturedCube(side); } void TexturedCube(PImage[] side) {   beginShape(QUADS);   texture(side[0]);   // +Z "front" face   vertex(-1, -1, 1, 0, 0);   vertex( 1, -1, 1, 1, 0);   vertex( 1, 1, 1, 1, 1);   vertex(-1, 1, 1, 0, 1);   endShape();   beginShape(QUADS);   texture(side[1]);   // -Z "back" face   vertex( 1, -1, -1, 0, 0);   vertex(-1, -1, -1, 1, 0);   vertex(-1, 1, -1, 1, 1);   vertex( 1, 1, -1, 0, 1);   endShape();   beginShape(QUADS);   texture(side[0]);   // +Y "bottom" face   vertex(-1, 1, 1, 0, 0);   vertex( 1, 1, 1, 1, 0);   vertex( 1, 1, -1, 1, 1);   vertex(-1, 1, -1, 0, 1);   endShape();   beginShape(QUADS);   texture(side[1]);   // -Y "top" face   vertex(-1, -1, -1, 0, 0);   vertex( 1, -1, -1, 1, 0);   vertex( 1, -1, 1, 1, 1);   vertex(-1, -1, 1, 0, 1);   endShape();   beginShape(QUADS);   texture(side[0]);   // +X "right" face   vertex( 1, -1, 1, 0, 0);   vertex( 1, -1, -1, 1, 0);   vertex( 1, 1, -1, 1, 1);   vertex( 1, 1, 1, 0, 1);   endShape();   beginShape(QUADS);   texture(side[1]);   // -X "left" face   vertex(-1, -1, -1, 0, 0);   vertex(-1, -1, 1, 1, 0);   vertex(-1, 1, 1, 1, 1);   vertex(-1, 1, -1, 0, 1);   endShape(); } void terrain() {   scale(50);   scale(1, -1);   textureWrap(REPEAT);   shape(terrain); } void boardgame() {   scale(40);   beginShape(QUADS);   fill(255);   beginShape(QUADS);   fill(0);   vertex(-24, -1, 24, 0, 0);   vertex( 24, -1, 24, 1, 0);   vertex( 24, .05, 24, 1, 0);   vertex(-24, .05, 24, 0, 0);   endShape();   beginShape(QUADS);   vertex( 24, -1, -24, 0, 0);   vertex(-24, -1, -24, 1, 0);   vertex(-24, .05, -24, 1, 1);   vertex( 24, .05, -24, 0, 1);   endShape();   beginShape(QUADS);   fill(160);   vertex(-24, .05, 24, 0, 0);   vertex( 24, .05, 24, 1, 0);   vertex( 24, .05, -24, 1, 1);   vertex(-24, .05, -24, 0, 1);   endShape();   beginShape(QUADS);   texture(boardgame);   vertex(-24, -1, -24, 0, 0);   vertex( 24, -1, -24, 1, 0);   vertex( 24, -1, 24, 1, 1);   vertex(-24, -1, 24, 0, 1);   endShape();   beginShape(QUADS);   fill(0);   vertex( 24, -1, 24, 0, 0);   vertex( 24, -1, -24, 1, 0);   vertex( 24, .05, -24, 1, 1);   vertex( 24, .05, 24, 0, 1);   endShape();   beginShape(QUADS);   vertex(-24, -1, -24, 0, 0);   vertex(-24, -1, 24, 1, 0);   vertex(-24, .05, 24, 1, 1);   vertex(-24, .05, -24, 0, 1);   endShape(); } void backdrop() {   scale(90);   scale(1, -1);   textureWrap(REPEAT);   shape(backdrop); }

[harryfishernz]

Here I have compiled the animation with all scenes. I will now address the lighting inconsistency as well as getting the die to hold on the corner for 1 second before falling onto that side (Indicates loaded die cast by Angel of Fate). I should have enough seconds to show this as I have eliminated the top down view I had thought of during Storyboarding.

[harryfishernz]

Developing final scene. I will now piece together all parts to give a sense of how it looks then further develop these later scenes

[harryfishernz]

More development of the landing scene. 

[harryfishernz]

Here is the updated texture in scene. 

[harryfishernz]

An adjustment to this texture making it blend more into the surrounding environment