sd3026 kat gp3 blog)

SD3026-Summer Project (2D Flash Animation) Group 3 CHOW Hoi-suen, CHAN Ka-yin, LOO Kam-tong, NG Wing-ting

Issued Date: 11 June, 2010| 1



Contents

1. Reference list 3

2. Aim and objectives of the project 4

3. Target audience and profile characteristics 5

4. Summary of research and review studies 5

CHOW Hoi-suen’s 5

CHAN Ka-yin’s 15

LOO Kam-tong’s 24

Ng Wing-ting’s 30

5. Analysis of context and scope 36

6. Approach and sketches of creative design solution 37

CHOW Hoi-suen’s 37

CHAN Ka-yin’s 42

LOO Kam-tong’s 44

Ng Wing-ting’s 45

7. Work breakdown and implementation process 48

8. Work schedule 49

9. Details of technical approach 50

10 Man-power allocation 51

11. Team members’ profiles 52



Reference list CHOW Hoi-Suen - 馬瑟斯 (Mathers, Douglas.), (1994) .《我們的身體：腦》

- 布賴恩 (Bryan, Jenny.), (2002) .《透視腦的奧秘》

- 邦謝特里 (Benchetrit, Andre.), (2008) .《沒有大腦，會發生什麼事？》

- 曹恩受, (2004) .《大腦夢工廠》

- Barille, Albert, (1993).《指揮管制中樞：腦》

- Afwina, (2009). 2nd Hand Smoker, http://www.youtube.com/watch?v=9hHJpymPkh8.

CHAN Ka-yin - 지코(2009), “Oola Boola Show (Coyote vs. Sheep)”, http://www.youtube.com/watch?v=GYN67cmko7w

- Mark Simon (2003), Producing independent 2D character animation: making and selling a short film

- Sandro Corsaro & Clifford J. Parrott (2004), Hollywood 2D digital animation: the new Flash production

revolution

- Sandro Corsaro (2002), The Flash animator

- Maureen Furniss (2008), The animation bible: a practical guide to the art of animating, from flipbooks to

Flash

LOO Kam-tong - 陳文君, (2001).《到人體去旅行》

- 周孝民, (2003).《超級人腦》

NG Wing-ting - 布賴恩 (Bryan, Jenny.), (2002) .《透視腦的奧秘》

- Albert Barille,(1993).《人體大奇航》

- Mondo Media, (2007).《Happy Tree Friends - Sweet Ride》,

http://www.youtube.com/watch?v=MoBscGq6ajY

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+2-0+open+R_AUTHOR+%B0%A8%B7%E6%B4%B5+(Mathers,+Douglas.)�

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+5-1+open+R_AUTHOR+%A5%AC%BF%E0%AE%A6+(Bryan,+Jenny.)�

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+1-0+open+R_AUTHOR+%A8%B9%C1%C2%AFS%A8%BD+(Benchetrit,+Andre.)�

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+3-0+open+R_AUTHOR+%B1%E4%AE%A6%A8%FC�

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+4-0+open+R_AUTHOR+Barille+Albert�

http://libcat.hkpl.gov.hk/webpac_cjk/wgbroker.exe?201006101746500688556+2+search+-redir+5-1+open+R_AUTHOR+%A5%AC%BF%E0%AE%A6+(Bryan,+Jenny.)�



Aim and objective of the project Group aim

The general aim of the project is to interest the children to learn the biology. For our team, we would like

to produce an interesting, colorful, harmonious feature animation to stimulate the children’s motive of

learning biology.

First, what is interesting? We decide to put the supernatural story and pros to the animation, such as

using personification and miraculous experience. The key role will use his/her amazing experience to grab

the audience’s eyes. Also, the character has his/her unique skills or personality to overcome the

difficulties or finish the task.

Then, what is harmonious? That means the color schemes will not use much complementary color but

analogous.

Finally, what is feature animation? As we said, we will develop an interesting story, not only the

information of brain. We will give the information through the story, not teaching the audience directly.

Individual aim

Director:

Through writing up of the script and storyboard, director will develop a story which is suitable for our

target audience. Director should also concern about how to tell a story effectively, for instance, use of

metaphors, visual pun etc. Moreover, doing storyboard and animatic , director should lead group mates

understand the story flow clean, especially animation director, and ensure the timing is appropriate.

Art Director:

As we know, this animation is for young children, so I will pay more attention on the style and color of

characters, props and background. A good color tone in an animation could enhance the attraction of

audience a lot, so I will tell the story through using more different colors in analogous style, but,

complementary color is also considered if somewhere is in need. On the other hand, I will open my mind

to listen the opinions from my group mates anytime that I could integrate the overall visual style in this

animation.

Character designer:

Through sketching, concept art work, and color scheming, character designer will create the unique

character that is full of personality and characteristic. The character will match with the story, for instance,

if director want an old man who is greed, wicked. I would draw a malicious smile to him. Also, I would

listen to my group mates when they are giving comments.

Animator:

My aim is creating and helping to do an animated, lively and perfect movement of the animation by using

the principle of animation, such as squash and stretches, overlapping. I hope that I can use my experience

of 2D animation and flash skills to do my best on it. Surely, I must listen the comment of my group mates

and do the best together.



Target audience and profile characteristics

Age: Hong Kong primary students (8 - 12 years old)

Who: students who like watching cartoon and animation in their leisure time

What do they like / what appeals to them: visual cartoon and animation (2D Flash)

What are the effective ways to communicate to them: telling the story with colorful pictures,

exaggerated motion, attractive sound and music.

Summary of research and review studies

CHOW Hoi-Suen Story and script

The video I have watched is ‘Anti Smoking Flash Animation’.

Study of existing works

In this video, there are many different kinds of scenes, locations and roles to present the main idea. For

example, there are lots of scenes telling a message of the outcome of smoking, which advocates smoking

ban. The target audience is for teenagers, especially for the school children since the clothes style in the

animation is school uniform and the character is a young girl.

Story elements

The animation is told through the first experience of the young girl, and also telling the story is told

through the song (background music).

Different genres (or kinds) of story appeal to the target audience

In order to tell the story well, the designer used a lot of exaggerated visual spots and motion, for example,

the arms and legs are full with body hair, the hurt by the hazardous substances.

Some narrative device



Overall art direction

In this animation, there are many different visual styles appealing to the target audience. At the beginning,

the pictures are in a quiet environment, everything is in a logical style. But in the middle of the story, the

Different visual styles appeal to the target audience

style changes, many colorful scenes and lovely characters appeal in the screen.



There is a big contrast between the girl and the other characters. The girl is in a joyful mood; on the other

hand, the characters are in a worried mood.

In recent years, the graphic style is getting popular in animation; more and more animation has included

the graphic elements into the action films. For this animation, there are also some graphic movements

within the spots; it gives the whole animation a lighthearted atmosphere that it can increase attraction

for audience.

What are the existing visual styles that are popular



In the ordinary animations, they tell the story with simile and straight forward method. But, in this

animation, there is quite a breakthrough in storytelling, the designer tried to tell the story with the result

and consequence of smoking instead of only telling the bad effects of smoking. So that, it can have a

better infectious for audience.

Breakthrough

There are lots of different color schemes in this animation:

Color schemes

The main characters in this animation are using border lines to emphasize; many of them are thin line but

not regular width, all of the border lines are in black color. But not border lines are used in the

subordinate roles.

Borders



Details in backgrounds

washroom rainbow, hills grass, trees trees, sky trunk, grass teeth, tongue, throat

purple BG room, mirror roof, sky floor drape, chair bench, grass, trees

table-lamp, wall picture sick bed hospital bed dining table TV, sofa



Graveyard round-table forest, mountains, sky toilet cubicle

Key props

cigarettes mirror hair removal tape crown pearl string handkerchief lung

Characters

girl(main) boy(main) baby baby teacher dinosaur octopus rabbits hazardous

Character design

Character Who Proportions Profile Gestures Expressions

girl(main)

70%

Description: student, long hair

Personality: naughty

Taking cigarettes

No special

expressions

boy(main)

15%

Description: rich man, short hair

Personality: friendly

Standing in 34ft

Laughing



baby

2%

Description: baby, no hair

Personality: naive

Lie still

Relaxed

expressions

baby

7%

Description: little boy, short hair

Personality: foolish

Sit still

Foolish

expressions

teacher

0.5%

Description: teacher, long hair

Personality: serious

Stand Seriously

Serious

expressions

dinosaur

0.5%

Description: huge , sharp teeth

Personality: violent

Stand

violent roar

octopus

0.5%

Description: soft, wear a hat

Personality: joyful

Playing piano

Joyful expressions

rabbits

4%

Description: soft, no hair

Personality: joyful

Dancing

Joyful expressions

hazardous

0.5%

Description: hazardous, no hair

Personality: violent

Attacking

violent laughing

Animation style

This animation is like an educational video clip, there are lots of metaphor and exhortation in the video.

And the actions in this animation are like a leather-silhouette show.

What are the actions like



Transitions & Camera Movements

Pictures Transitions

Camera Movements

Black Image

/

/ Bird-view cam

/ Girl’s POV

Image White

/

Image Black

Zoom in

Cross dissolve in

/

Hills rise Left(A), Rainbow rise

Right(B)

/



/ Zoom in

Image rise from bottom

/

Background rise

/

Expand dissolve in

/

Rotation

/



Image white Image Zoom out & Zoom in

characters: go left;

Background: go right.

Pan cam

• No shadow

Technical effectiveness and efficiency

• Simple shape

• Straight line

• Plain color

• Real motion test

Need to do some tests

• Timing calculation

• Frame rate calculation



CHAN Ka-yin Story and script

“Coyote And Sheep” include a surprising and suspending story which can appeal to the target audience. In

traditional story, namely, “The Boy Who Cried Wolf”, the wolf eats sheep, no exception. However, in this

story, coyote finds it so difficult to eat sheep because of mother sheep. This story has no narrator and

dialogue, only the animation. Coyote tries so hard to catch the sheep but it failed. The story through the

experience of the main character to tell us what it is happening.

For the story elements, mother sheep is the key element. Because of mother sheep, coyote is afraid to

approach the flock of sheep. To result in, coyote uses the rope to catch sheep in far away instead of

hunting.

However, this story is lack of the narrative device. The story comes little void and not completive because

it is just repeating the simple idea – coyote is a loser. So, it will become boring when we watch the story

for a period because we can simply guess the story.

However, the doctor helps the story to be another climax. (The first climax is coyote frightened by mother

sheep.) The doctor is simply bring out the first aid kit, but gives surprise to audience. The can written

“surgery” and drawn a scalpel, audience may think it is a simply scalpel. However, the outcome is a crab.

Three repeated concepts are okay but it cannot show the coyote is pitiful.




“Coyote And Sheep” has great visual style in its animation. It is good at using gradient color, drawing the

pros, scene environment by vector line. For instance, the desert and stones are colorful and detailed.

Moreover, “Coyote And Sheep” uses the popular visual style to draw its character and scene. It uses the

colorful and appropriated color schemes,

such as: sky blue as sky, green as grass, brown as coyote’s feather, white as cloud. Overall, the color

schemes used the warm and digital color to draw.



This scene we can see it use thick borders for the stone, but no border for the cloud. And, the borders of

stone is not black, but the dark brown. The shadow of cloud is solid color but the stone is gradation color.

Also, the border of stone is not just regular width; it used the Flash pen tool to draw the border, so that it

is irregular shape and width.

In this scene, we can see the front ground’s stone has many detail. The shape, texture, color, shadows of

stone is pretty good. Also, the desert is included sand texture and gradient color. The shape of cloud is

special and cute, full of style.

This scene is the good one because it is included much detail and perspective angle. Also, we can see the

color of shadow not just one but also ten because it uses gradient color.



For the character, they are not much detail and shadow. “Coyote And Sheep” concentrate to draw the

background and pros.

Character design “Coyote And Sheep” uses exaggerated facial expression, great contrast to develop its character. First,

coyote always feels afraid, angry, disappointed. Such facial expressions are exaggerated and coyote has

vivid characteristics. On the other hand, mother sheep and the flock of sheep is lack of facial expression. It

is a great contrast between coyote and sheep as well as distinguishing the winner and loser. Besides,

setting up the contrast of the figure of body also helps audience to distinguish the winner and loser.

Coyote

The main character, he has the nature of coyote but very timid. He is tricky but not clever. He has many

facial expression and gesture, also a vivid personality.

Expressions:



Gestures:

Sheep

The supporting role, they look like naïve but nimble, naughty and innocent. They like eat grass. They are

not the normal sheep because they do not afraid the coyote.

Expression:



Gestures:

Mother Sheep

The supporting role, the mother (Because mother takes care the kids) of the flock of sheep. She is very

strong and lack of facial expression. She always protests her kids.

Expression:

Gestures:



Doctor

The supporting role, he is a wild boar. He uses the insect as the tool of operation. He is lack of facial

expression and has great operation skills.

Expression:

Gestures:

Animation style Camera movement “Coyote And Sheep” used four types of camera movement.

7

00:13(9) Cam: Zoom

Out

Sheep mother

is protecting

her children.

32

01:14(1s) Cam: Zoom in

Rope’s POV

Sheep is

eating the

grass.

10

00:27(8s) Cam: Pans

right

Showing the

environment.



35

01:18(1s) Cam: Tile down

The sheep

mother grabs

the rope.

Transitions “Coyote and Sheep” used little video transition. 66

02:44(2s) Trans: Dip to black

Action

“Coyote and Sheep” has many actions, such as jump, run, fly.

3

00:04(4s) Coyote hides himself

behind the stone and

keep watching the sheep.

5

00:09(1s) Coyote run out of stone

to sheep.

27

01:07(3s) Sheep jump and evade

the catching.



39

01:24(2s) Coyote is pulled by sheep

mother.

Technical effectiveness “Coyote and Sheep” use swish FX (radiation line of comic)on some of the action scenes.

24

01:02(1s) Coyote try to rope again.

28

01:10(1s) A short animation as a

transition from right to

left.

32

01:14(1s) Cam: Zoom in

Rope’s POV

Sheep is eating the grass.

40

01:25(2s) Coyote is pulled by

sheep mother.

42

01:28(1s) Coyote fall.

43

01:29(4s) A short animation as a

transition from high to

low.



44

01:33(3s) Coyote fall to the ground

and crash.

LOO Kam-tong

I have study one of Mr. Bean animation (Mr. Bean – Scary Movie) as my research and review studies. I

study this animation in four parts, including Story and script, overall art direction, Character design and

Animation style.

Story and script

The target audience of Mr. Bean animation is every generation and nationality. It is because Mr. Bean

animation will not have dialogue in most of time (pantomime). Moreover, the story is most likely to obtain

from normal life with exaggeration.

The story told through the experience of the main character. Moreover, the beginning of the story is coherent to the end (首尾呼應) to create a humor purpose. For instance, Mr. Bean teases the

saleswoman at the beginning. However, after Mr. Bean escape from the horror film cinema, the

saleswoman revenge Mr. Bean with the same action.

Beginning

Ending



The story elements are shown as following.

Location Street and cinema

Time Night

Character Mr. Bean, saleswoman, couple, elder,

monster, victim, Scientist, Assistant

Story flow Mr. Bean goes to cinema watch a

horror film and teases the

saleswoman.

Mr. Bean is scared by the film and

escaped from the cinema.

The saleswoman revenge Mr. Bean.

properties Popcorn, car, nail file, chewing gum,

money, ticket,

Background music, sound effect Car, nail file, monster and victim howl,

talk, laugh, popcorn, cat, machine, horror

film music, relaxed music

Video principles -Dynamic Tension

The conflict between Mr. Bean and the

saleswoman.

- Progression

The emotion of Mr. Bean(relaxed

scared angry)

Narrative device Mr Bean’s hand shake and collapse the

popcorn to show his scare.

Overall art direction Due to the story of Mr. Bean animation is humor and relaxed, the color tone is high brightness. Besides,

there is plane color, without shadow, character with thick black border.

In this animation, the art director used green as the color tone because this story is talking about Mr Bean

goes to watch a horror film. According to the traditional concept, green is suitable for a horror mood.

Moreover, the camera is shooting the moon at the beginning; this shot is also traditional horror style shot.



In this animation, most of the backgrounds are inside the cinema and with a few details only.

Cinema Counter (1) Street

Inside cinema (1) screen Laboratory

Machine city Ground

Inside cinema (2) Counter (2)



Key props

Characters

car

Chewing

Nail file Money Ticket

Popcorn

Saleswoman

Mr. Bean Couple Elder

Monster Assistant

Scientist

Victim



Character design Characters Name Proportions Profile Gestures Expressions

Mr. Bean -Head : body 1:3 -slim leg -big nose and ear -short hair

-Main character -silly -timid -around 40 years old

-brows bends up -head bends up -eyelid drooping

-relaxed -tease -scared -angry

Saleswoman -Head : body 1:3 -fat -short hair

-A madam -have nothing to do -bored -black eyeglasses --around 40 years old

-eat chewing gum -using nail file

-bored -scared -tease

Elder -Head : body 1:3 -slim hand

-around 70years old -brave -greed -sanguine

-keeping handshake -shoulder shake

-relaxed

Couple Man: - Head : body 1:3 -slim Woman - Head : body 1:3 -fat

Man: -around 30years old -dead-pan Woman: -like dress up -timid -rely on her boyfriend -long and winding hair

Man: N/A Woman: -hug her boyfriend -using hand cover her eye

Man: -dead-pan Woman: -scared

Monster - Head : body 1:3 -huge -strong

-fierce -sharp tooth

N/A -fierce



Assistant - Head : body 1:3 -slim

-a lady -sexy -slender figure -long hair -around 20years old

-put the hand on waist -twist the waist

-scared

Scientist

- Head : body 1:3

-around 70years old -no hair -face with scar -crazy on science

N/A -shout

Victim - Head : body 1:3 -fat

-around 40years old -scared

N/A -scared -struggle

Animation Style Due to Mr. Bean is pantomime, therefore this animation applied exaggeration (one of the animation

principles) very much. In order to replace dialogue, the animation director exaggerates the actions of the

characters. For instance, when Mr. Bean is scared to the horror film, he hands shake and make the

popcorn throw away.

Moreover, the characters are expressiveness; therefore, the actor can tell the story effectively and show

their personality without dialogue.

According this animation is pantomime; there are a few transitions, camera movements and using linear

timeline to tell the story. I think it can avoid the confusion and misunderstanding for the audience.



NG Wing-ting

The research part is very important because I can know the best way to communicate with children and

provide some complicated information. Also I can know that which animation style is suitable for them. In

this part, I find some relevant existing works to study, such as the website which is telling the working flow

of the brain to young children, the books about brain for young children and some animation for

reference.

I study these works by doing animation breakdown list and asset list, making analysis and summary of this

works.

Animation reference: Happy Tree Friends- Sweet Ride

Story and script

The story is talking about Cuddles was eating the ice-cream and played the skateboard at the same time.

Then the other character, Nutty also wants to eat that ice-cream so he pursued Cuddles by using

skateboard too. But Cuddles felt scary with his appearance so she not stopped it. Next, some obstructer

appeared on their journey. Nutty can’t avoid it so he got hurt and died. Cuddles also can’t avoid the other

obstructer, stair. So she also died at the end.

For our target audience, young children, the story of Happy Tree Friends is not suitable for them. It is

because the content of the story is very violence and bloody. It would affect the thought and concept of

them. They maybe imitate the dangerous act of the characters too. On the other hand, the kinds of

humorous or educated are more suitable for them in the childhood. The humorous animation can let

young children more concentrate and focus on the content of the animation. If the character is humorous,

young children will love it can concentrate on what the character said or did. Beside this, some educated

animation is useful for them to learn more effectively. It is because it provides much information within

the animation. But audience may feel that is boring. So the best way is combining humorous and educated



in the animation.

In the reference animation, it hasn’t narrator to tell the story. It told by the action or the facial expression

of the characters. For example, in scene 1, Cuddles touches the stomach and smile to the ice-cream. It

express that she is hungry now and want to eat the ice-cream. In scene 6, the eyes of Nutty show the

image of Cuddle’s ice-cream. It express that Nutty wants to eat that ice-cream. So the story can told

without narrator also the audience understand what is talking about. In addition, the experience of the

main character also can tell the story. In the other story of Happy Tree Friends, the appearance of Nutty is

also strange. So audiences know that Cuddles must feels scary of him in the story.

The elements of the story:

time Start at Cuddles bought the ice-cream location next to the forest character Cuddles and Nutty event Nutty chase Cuddles due to he wants to eat her

ice-cream


In color of this animation is comfortable and soft. It has different visual styles appeal to the target

audience. Due to the story is a fancy story and not reality, the color also show this feeling. For example,

the tree is not only green and brown, it maybe purple and blue.

In this animation, it uses two different color schemes. For the background, it always uses green, pink and

purple tone to paint it. The background elements such as trees and flowers also use it. Also the colors

aren’t too bright or shine. It uses cool color scheme in the background.



The hue of the color of the characters and the props are higher than the background, such as Nutty and

the trees also are green in color. But the hue is not the same. It can avoid losing focus of the audience. It

always uses warm color too. For example, Cuddles and the ice-cream paint by warm color.

In this picture, the cool color of the background can let the Cuddles more outstanding. Also the color of

the character is yellow which is a warm color.

Although the background is pink, the yellow character hold many space of this scene so the audience can

find the focus easily.



In scene 8, the background is pink and the character and props is purple in color. It is very analogous color.

It is because the animation just want to show the shadow of the character. In addition, it hold half area of

the scene too.

In order to let the scene more clearly, the background elements such as trees haven’t borders. On the

other hand, the characters and the props have borders. The borders are thin. The color of the borders is

analogous of the characters and props.

This picture show that the hue of the borders color of the character and two skateboard are higher than

the image.

The background of the animation is simple and not too details. It just has trees and flowers to decorate. It

just uses the color to outline the shape of the trees. For the characters and the props, it just uses different

colors and borders to outline each part of it. So the visual of the animation is not too complicate.



Character design

It has two characters in this animation which is Cuddles and Nutty. Cuddles is a rabbit which has long ears

and some feather between the ears. Her nose is heart shape and red in color. She is yellow in color. She

likes ice-cream and good at playing skateboard. She always smile when she feel happy. She will feel scary

when meet Nutty, so she will run away to avoid him.

Nutty is a squirrel which has a long and big tail and a heart shape nose. But his left eye has some problem,

so his appearance always let other animals feel scary. He is green in color. He likes something sweets so his

body always appears some sweets. Also he chases Cuddles for the ice-cream in the animation. But he is

not good at playing skateboard. He is a silly squirrel.

Animation style In this animation, the movement of the characters was made by flash. The movement used some principle

of animation, such as squash and stretch, overlap, etc. For example, when Cuddles jumps to avoid the

obstructer, it uses stretch. When she falls down, it uses squash. It can let the animation livelier.

This animation always locked the camera. It also uses track to show Cuddles playing the skateboard and

Nutty chase her. If the animation always uses locked camera, the audience will feel boring. An active



camera can let the animation livelier. For example, if the camera using tracks when the story is talking

about chase, the audience will feel that they also chase the characters to see what happen. Also the

animation uses point of view to show what Cuddles saw in scene 14.

About the technical effectiveness and efficiency of the animation, it can use “frame by frame”, “key frame”

and script. Using “frame by frame” to do animation can create a smooth movement. But it will increase

the file size of the flash because flash will save each frame. If using “key frame” to do animation, the file

size will not too large. Also it is easier to do in flash. If using script to do animation, the animator needs to

know how to use the script. If you want to make a perfect visual style animation, it should use frame by

frame. If want to ensure a efficient workflow, it should uses key frame to make the animation because it

can save time and has more time to improve or develop the animation movement.

In order to make a good movement of the animation, animator needs to make many line tests of the

movement until it is smooth and reality. It doesn’t need a pretty visual style in the test.



Analysis of context and scope

To evaluate our resources, we have regular meeting and working time on each week. Also we already have

a project schedule to follow. For the manpower, two of our teammates also learn biology in the secondary

school. They have knowledge of the brain working. For the animation, two of our teammates also learn

and did 2d animation and they know that how to apply the principle of animation in the better ways.

Beside this, our team also learns and did 2D animation by flash in Multimedia fundamental. We know that

how to make a frame by frame and key frame animation in flash. Our teammate also did leader of the

previous project so we have a good leadership. On the other hand, our team is professional on Photoshop,

illustrator, and flash. When we make the animation, we can use our ability, such as Photoshop to make the

background more reality. The teammates who are make the 2D animation before; can focus on the

movement of the character more.

In addition, we can make the research by internet, library to find the reference of the children animation

and the books for young children. We can know more about the best way to communicate with young

children. For the reference of animation, we can make the scene breakdown and the asset list. We can

know that how to make a complete animation within one minute and it has education information and

not boring.



Approach and sketches of creative design solution

CHOW Hoi-suen

Story

One day, Joe was watching TV at home alone at night, the programmer playing on TV was about brain. Joe

did not like this programmer, he changed to another channel. There was an extraterrestrial playing on

the TV, Joe was frightened and wanted to turn off the TV. At the same time, there was an odd light outside

the window and Joe was caught by the light.

Joe was in a coma, and woke up gradually. He found himself was tied, an extraterrestrial walked in front of

him and wanted to do an experiments about how the human brain operate. The extraterrestrial tested the

reaction of the Joe’s brain by touching his feet with a feather. And the extraterrestrial could understand

the operation of brain by watching the computer above him. As the same method, the extraterrestrial

tested the sense of touch, the vision and the hearing. Joe couldn’t bear the tests anymore; luckily, he

freed oneself from the tie and escaped quickly. At this moment, he saw a TV playing a programmer about

the housing; Joe jumped into the TV and escaped from the extraterrestrials successfully. But, there was

another nightmare, there was a cruel man in the house, he could watch out our mind by his magic

magnifying glass. Joe felt frightened very much, and all of his mind was seen by the cruel man’s magic

magnifying glass. The magic magnifying glass wanted to kill Joe with an electric saw. At this moment, Joe

discovered that there was a TV in the corner, he used his creativity and turned on the TV quickly, and then

jumped into the TV. Luckily, there was Joe’s home beyond the TV. Joe escaped successfully.

At this moment, the clock was 12 o’clock, the programmer of extraterrestrial is finish, everything was right.

Joe thought himself that “What an alarmingly dangerous adventure!”

Descriptions of character profiles

Joe:

He is a 10-year-old boy. He has a big eye and small nose and swarthy hair. But, his mother and father need

to work frequently, so Joe is often watching TV alone at home at night. Luckily, Joe is a vivacious and

adventurous boy. He believes that he could become an adventurer in the future.

Extraterrestrial:

He is interested in human’ brain a lot, so that he will do a lot of experiments about how the human brain

operates in his laboratory.

Saw man:

He is a cruel man, and he can invent some magic tools, for example, the magic magnifying glass, which

could watch out the mind of brain. But, he also likes killing livings with his electric saw, he is bloody very

much.



Sketches



Mood board



CHAN Ka-yin

Story

Ellis looks at his favorite biologic book and shakes his head and sigh. He lies down on the bed and closes

his eye.

Suddenly, he wake up and is appeared in the strange and fantastic place. There are many blue glows light

circulating; some of the nodes appear the red glow light. Ellis feels so odd and do not know why he stay

here. Ellis get up and walks around, suddenly, a blue glow light behind him is approaching. Ellis feels so

afraid and runs. However, the blue light is very fast. Light is approaching Ellis and Ellis wants to escape so

he jumps.

Ellis lands on the blue light, he cannot control the speed and the strength, but he can ride the light! He do

not know what is it happening? So, he takes out his biologic book from his school bag, start reading the

book.

He learnt the blue light is the nerve pulse, which can carry him to the muscle, brain and the entire parts of

human. He feels so interesting. He thinks he like the biology through the venture is starting.


Ellis, a ten year-old primary school student, hates reciting and learning the biologic knowledge. He does

not want to study the difficult knowledge such as the human body or how the brain is working. He is brave

but does not want to face the biology. He is full of curiosity but he thinks biology is too boring.

Sketches



Concept art work

Mood board



LOO Kam-tong

Story

At the beginning, the main character is doing exercise in the playground such as playing football, and can

see that he is very tired. After that, the background change to his house, he opens the door and walk in

the house. At the same time, an odor is filling the house. Then, we will see the cross-section of the

character, and it will show how the brain work (eg. the pulse and the cell). Using the highlight or different

color to show that which part of brain is responsible to the sense of smell.

After that, the view will change to the character’s POV, the camera will pan left and right, it is present the

character finding the food. When the food appear, we will see the cross-section of the character again, as

the same concept of the sense of smell, it will show how the brain work and which part of the brain is

responsible to the sense of sight. Moreover, the animation will also show the sense of taste and touch.

Sketches



Mood board

NG Wing-ting

Story

The animation will explain the working flow of the brain. It combined with humorous and educated. So it

will provide some information to young children. Also the animation is humorous at the same time to

balance the boring information. The story happens in the funfair. One day, two children, Ruby and Manson

went to funfair together. Their brain will shine when it is working. The animation will show the flow from

the fragrance of the food enter Manson’s nose to call the brain. Then the shining attracts a rat and the rat

start to chase them. Then Ruby also felt the sweet of the food. The flow of calling brain will be show too.

Next, Ruby and Mason also hear the music of the merry-go-round. And then, Ruby feels Manson grasp her

hands but it just the rat tail touch her hand. Finally, Ruby saw the rat stands on Manson’s body and she

felt very shocked.


Ruby is an 8 years old girl. She has a big eyes, small nose and round face. Her mother always braids her

hair to two braids. She likes to wear pink dress. She always plays with Manson who is her neighborhood.

But she is very afraid of rat.

Manson is an 8 years old boy. He has a big eyes, small nose and round face too. He likes color blue and

makes people happy. He is also afraid of rat too.



Sketches

Concept art work



Mood board



Work breakdown and implementation process

Detailed work breakdown Name Key Role Supporting Role

CHOW Hoi-suen Art director Director

CHAN Ka-yin Character designer Art director

LOO Kam-tong Director Animation director

NG Wing-ting Animation director Character designer

File sharing We try to share the information and data by the network of W-driver in campus, we put the information

into the files which called “Katgp3”, and so here is the Student ID for going into the shared files.

-

Blog and YouTube account

We will upload the assignment, important information and message into a blog frequently; here is the link

of blog: http://katgp3.blogspot.com. Moreover, we will put the animation or video into YouTube for

others watching. Here is the account of YouTube: [email protected].

CHOW Hoi-suen (09343546D)

CHAN Ka-yin (09178939D)

LOO Kam-tong (09098048D)

NG Wing-ting (09051258D)

http://katgp3.blogspot.com/�

mailto:[email protected]�



Work schedule Project schedule WEEK DATE EVENT DETAIL

Week 0 4 June Tutorial 1 (1pm, P505) \

5 June 1st Meeting (2pm, P505) Proposal & Breakdown

Week 1 7 June 2nd Meeting (10am, P505) Proposal & work division

8 June Hand in “Breakdown” \

10 June 3rd Meeting (11am, P505) Brief conclusion of Proposal

11 June Hand in “Proposal” \

Week 2 14 June 4th Meeting (2pm, P505) 3 styles per person

16 June Hand in “Flash Exercise” \

17 June 5th Meeting (11am, P505) Preparation for Presentation

18 June Attend the meeting in Disney

Land(10:30-12:00am)

\

Week 3 21 June 6th Meeting (2pm, P505) Rehearsal for Presentation

22 June Tutorial 2 (2:30pm, P505)

Presentation(15 mins)

\

24 June 7th Meeting (11am, P505) Animation production

Week 4 28 June 8th Meeting (2pm, P505) Animation production

1 July 9th Meeting (11am, P505) Animation production

Week 5 5 July 10th Meeting (2pm, P505) Animation production



Week 6 12 July 13th Meeting (11am, P505) Animation production

14 July 14th Meeting (11am, P505) Preparation & Rehearsal for

Presentation

15-16 July Preparation \

Week 7 19-20 July 15th , 16th Meeting (11am, P505) Production for Final Report

21 July Final Report Submission \

Group work time Our group will work together in campus at least 3 times a week that it will take 10-12 hours per week.

Group meeting time Our group will have 2 meetings every week that it will take 4 hours per week.



Details of technical approach Software applications Software Applications

Pre-

Prod

uctio

n

Microsoft Word 2007 Documentation

Microsoft PowerPoint 2007 Presentation

Adobe Acrobat 9 Pro Extended Create PDF, platform compatibility

Adobe Illustrator CS4 &

Adobe Photoshop CS4 Extended

Overall concept art, color scheme, key

background/locations, key props, character visual outlook

Adobe Flash CS4 Professional Animatic, motion tests, timing

Prod

uctio

n

Microsoft Word 2007 Documentation


Adobe Flash CS4 Professional Animation

GarageBand &

Adobe Premiere Pro CS4

Sound design

Adobe Illustrator CS4 &

Adobe Photoshop CS4 Extended

Backgrounds, props, character

Adm

in

Microsoft Word 2007 Documentation, Production scheduling, Secretary


Resolutions/frame rate HD – 1280 X 720; 25fps

SD – 720 X 576; 25fps

File/image formats File/image Formats

Final animation .mov

Document .doc ; .docx ; .pdf

Presentation .ppt

Animatic .mov

Character design .ai ; .png ; .psd

Background music, sound effect Any audio formats (eg: .mid ; .mp3 ; .wav)

File naming conventions wk1(stands for week 1)_gp3(group3)_FullName_StudentID_content of entry



Man-power allocation Responsibility chart

LooK

amTo

ng

(Dire

ctor

) Ch

owH

oiSu

en

(Art

Dire

ctor

) Ch

anKa

Yin

(Cha

ract

er D

esig

ner)

N

gWin

gTin

g (A

nim

atio

n D

irect

or)

Pre-

pro

Story and script Storyboard ● ○ ○ ○

Animatic ● ○ ○ ◎

Art direction

Overall concept art ○ ● ○ ○

Color scheme ○ ● ○ ○

Key backgrounds/locations ○ ● ○ ○

Key props ○ ● ○ ○

Character design

Character profile (write up) ○ ○ ● ○

Character visual outlook ○ ◎ ● ○

Character gestures and expressions ○ ○ ● ◎

Animation style Different motion tests ○ ○ ○ ●

timing ○ ○ ○ ●

Sound design Music style ● ○ ○ ◎

Sound effect ● ○ ○ ◎

Prod

uctio

n

design

Backgrounds ◎ ● ◎ ◎

Props ◎ ● ◎ ◎

Characters ◎ ◎ ● ◎

animation character ◎ ◎ ◎ ●

props ◎ ◎ ◎ ●

Adm

in Production scheduling ● ◎ ◎ ◎

Secretary ◎ ◎ ◎ ◎

Consistency of documentations ◎ ● ◎ ◎

● Decision making

◎ Active participation

○ Advice



Team member’s profiles

-

CHOW Hoi-suen

Strengths:

Color, Graphic (background), Storytelling, Painting.

Roles I have taken up in previous projects:

Graphic design for background (SD2008)

Story (SD2007).

Electives I have taken:

3D animation (SD2031)

Calligraphy & Typography (SD2021)

Skills and knowledge:

I took Visual Art in HKCEE & HKALE.

I can use the software of Adobe Flash, Photoshop, Illustrator, and Maya; Information collecting

(SD2005), Motion design (SD2031).

CHAN Ka-yin

Strengths:

Photoshop, AE, character design, digital drawing


Group Leader

Decision maker


Digital video production

Photographic imagery


Experienced in Photoshop, Flash, Premiere, Indesign, After effect, Illustrator, Maya,

Microsoft Office, Corel Painter, Final Cut Pro, Character drawing



NG Wing-ting

Strengths:

2D animation, storytelling


Art director, director, animator and character designer (SD2014)

Animator, director (SD2008)


SD2014 Computer Animation Fundamental

SD2019 User-Centered Design for WWW


Use the software of Adobe Flash, Photoshop, Illustrator, and Maya.

LOO Kam-tong

Strengths:

Animation, using Flash


SD2014 - Computer Animation Fundamental

SD2028 - Sound, Music and Image


In SD2008 – Multimedia Fundamental project, I mainly responsible to animation

In SD2014 - Computer Animation Fundamental, I mainly responsible to sound mixing


I have taken Biology in HKCEE and HKAL.

sd3026 kat gp3 blog)

Documents

d animation

animation director

d flash animation group

d character animation

animation bible

principle of animation

d digital animation

flash loo kamtong