Sarita Chen – Final Project

For my project I made an interactive character that responds to 3 prompts. Because my major interest in animation is 2D animation, I really enjoyed the walking assignment we did with the walking frames and getting the character to walk and follow the mouse. I wanted to base my project on that assignment so I drew the image frames and animated them using code. The character is Lance from Voltron: Legendary Defender which is a Netflix only series that I watched over the summer and really enjoyed :).

sketch

var waveFrames = [];
var laughFrames = [];
var complimentFrames = [];
var currentwaveFrame = 0;
var currentlaughFrame = 0;
var currentcomplimentFrame = 0;
var startIMG;
var waveImages;
var laughImages;
var complimentImages;


function preload(){

	startIMG = loadImage("http://i.imgur.com/mALMPDf.jpg");


	waveImages = [];
	waveImages[0] = ('http://i.imgur.com/oQGI281.jpg');
	waveImages[1] = ('http://i.imgur.com/1NBmtWx.jpg');
	waveImages[2] = ('http://i.imgur.com/EZx2syw.jpg');
	waveImages[3] = ('http://i.imgur.com/nA7ZuKG.jpg');

	for(var i = 0; i<4; i++) {
		waveFrames[i] = loadImage(waveImages[i]);
	}			
	

	laughImages = [];
	laughImages[0] = ('http://i.imgur.com/CWnkxF8.jpg');
	laughImages[1] = ('http://i.imgur.com/0i6DQam.jpg');
	laughImages[2] = ('http://i.imgur.com/CWnkxF8.jpg');

	for (var l = 0; l<3; l++){
		laughFrames[l] = loadImage(laughImages[l]);
	}

	complimentImages = [];
	complimentImages[0] = ('http://i.imgur.com/odBxDz4.jpg');
	complimentImages[1] = ('http://i.imgur.com/9zZDtl2.jpg');
	complimentImages[2] = ('http://i.imgur.com/odBxDz4.jpg');

	for (var h = 0; h<3; h++){
		complimentFrames[h] = loadImage(complimentImages[h]);
	}

}

function setup() {
    createCanvas(600, 600);
    frameRate(8);

    
   
}   

function draw() {

	image(startIMG,0,0,600,600);

	currentwaveFrame = currentwaveFrame + 1;
	if (currentwaveFrame > 3) {
		currentwaveFrame = currentwaveFrame - 3;
	}

	if (keyIsPressed) {
		if ((key == 'h') || (key == "H")) {
			
			image(waveFrames[currentwaveFrame],0,0,600,600);
			
			
		}

	}
	
	currentlaughFrame = currentlaughFrame + 1;
	if (currentlaughFrame > 2) {
		currentlaughFrame = currentlaughFrame - 2;
	}

	if (keyIsPressed) {
		if ((key == 'l') || (key == "L")) {
			
			image(laughFrames[currentlaughFrame],0,0,600,600);
			
			
		}
	}

	currentcomplimentFrame = currentcomplimentFrame + 1;
	if (currentcomplimentFrame > 2) {
		currentcomplimentFrame = currentcomplimentFrame - 2;
	}

	if (keyIsPressed) {
		if ((key == 'c') || (key == "C")) {
			
			image(complimentFrames[currentlaughFrame],0,0,600,600);
			
			
		}
	}


}

Leave a Reply