Characters: The Sisters

 

 


 In the first part of the animation, there's a scene that Cinderella's two sisters walking out of the house. I tried to tell that these her sisters looked really beautiful and proud of their self, so that we can say Cinderella want to go to the ball as pretty as her sisters.

I tried several version of drawings, for example for the book Tezuka School of Animation and The Animators Survival Kit. but the 2d walking cycles didn't look quite like a female.

Walking Cycle from The Animators Survival Kit 

 So I accept Felix and Rudy's idea about download a fashion show video from youtube and picked some frame to simulate.

I picked two dresses in this video and selected 1 frame in each 4 frames. Drew them in AI and color with PS. And with the 8 images, I made the animation with the following codes:

class Character {

int xpos, ypos;

int xpos0, ypos0;

float scale;

PImage[] images;

int count;

int increase;

Character(int xpos, int ypos, float scale, PImage[] images, int increase) {

this.xpos = xpos;

this.ypos = ypos;

this.xpos0 = xpos;

this.ypos0 = ypos;

this.scale = scale;

this.images = images;

this.increase = increase;

for(int i =0; i < images.length; i++) {

images[i].resize((int)(images[i].width * scale), (int)(images[i].height * scale));

}

count = 0;

}

void move() {

ypos += increase ;

if(ypos > ypos0 + 200) {

ypos = ypos0 + 200;

return;

}

if(increase != 0)

xpos = xpos0 - (int)(((ypos - ypos0) * (ypos - ypos0) / 400));

count += 1;

}

void draw() {

image(images[count % images.length], xpos, ypos);

}

}

Reference:

1. The animator's survival kit(Williams, Richard, 2001)

2. Tezuka School of Animation, 1: Learning the Basics(Tezuka Productions, 2003)

3. 2009 Love collection by Enzoani Runway Video(http://www.youtube.com/watch?v=UXPxEnKR0AU

Characters: the Magical Button

The button is used in the animation part to get access to the next section. Also in the magic mirror part to finish the test choices.

The design is an animation flower which can cause attention and fill with magic. The coding was inspired by a sakura in OpenProcessing, which use offset to simulate a flower.

for (float a = 0; a <= 360; a += 45){

  for(int i = 0; i < 8; i++){

  float f = radians (a+offset+i * 4f);

  float h = radians (b+i * 0.2f);

  noStroke();

    

  float alf = 255f/8f * (float)i;

  fill(c1,c2,c3, alf);

  float x = posX - 30 + cos (f) * (15 + sin (b+i * 0.2f)*20);

  float y = posY - 20 + sin (f) * (15 + sin (b+i * 0.2f)*20);

  ellipse (x, y, abs(sin (b+i * 0.2f)*10), abs(sin (b+i * 0.2f)*10));

  //fill(231-(cos(b)*60), 131, 109);

  }

  }

  b += 0.2;

  offset += 4;

Reference:

1. Openprocessing,桜 byAnastasis Chasandras http://www.openprocessing.org/sketch/10413

Apple Shape Compare

Dresses for Apples Shape with Colors

 

 

 

 

 

 

Basic Body Shapes By AI

 

 

 

Thanks to Ines's help, I managed to simplify the hand drawing of the 12 body shapes last semester with Adobe Illustrator. And as Ines suggested, I added some underwear based on the rules on look-fabulous.com.

Ines's Design of the smooth body shapes

Reference:
1. Figure drawing for fashion design(Drudi, Elisabetta, 2001);
2. Fashion in costume 1200-2000(Nunn, Joan, 2000);
3. Technical drawing for fashion(Szkutnicka, Basia, 2010);
4. Contemporary lingerie design(Dominy, Katie, 2010);