GollaGolla ProcessBook

Winter 2011

Process Book of 3-D Graphic Studio

GDRS 730 | 3-D Graphics StudioProfessor Jason Fox

Course DescriptionStudents explore theoretical and practical applications of experience and interaction design through projects addressing form, physical space and tactile response. Course content consists of readings, lectures and assignments, which interpret, involve and transform hu-man engagement with the 3-D realm. Projects evolve from conceptual origins and progress to constructed physical objects.

Project Description

Research

Proposal

Inspirations

Brand Identity

Prototype ||ı

Prototype ¤

Prototype 3

Final Product

Applications

4

6

14

19

19

34

41

61

74

96

CONTENTS

“The turning point in the process of growing up is when you discover the core of strength within

you that survives all hurt.”

—MaxLerner

4

“Creativity is a state of mind in which all of our intelligences are working together. It

involves seeing, thinking and innovating...[creative people] make unique connection often

unseen by others”

—Craft,Jeffrey&Libeling

Learning Objecticves

• to propose a 3D design problem• to interact with multiple problem solving

methodologies• to document and user interaction as a

component of problem of problem solving• to interact with an related industry

professional in a collaborative manner in the prblem solving process

• to document (in an organized manner) the complete journey-from start to finish-of a design problem

Brief

Find a problem and solve it using a systematic approach to understanding the changenge and its need to be resolevd.The challenge over the ten weeks course is to

Project Description

seek out, research, investigate, discuss, write about, collaborate and resolve a three-dimen-sional design problem. The task is to “package” the solution and create a trade show experence that inform (or “sells”) the solution.

5

The Problem

6

Research

What Cause Computer Disease?

7

Existing Solution

Eye problem

Physical pain/ache

8

Tips

Ergnomics product

Physical exercise

9

My Direction

Increase fun

Color Consideration(good for eyes)

Media Consideration

Exercise tutorial

10

Ergnomics Product Price ResearchCauses & Disease Match

Expensive

11

Survey

Product Research

13

Naming

Go Gorilla

GOrilla

GGG

GolaGola

(reminds people of

Cocacola?)

GollaGolla

Proposal

If you…

love computer gameshave knots in your back

are a social media person have a design related major

feel back popping when you stretchthink your body is flexible enough to challenge all the pose in this kit

are addicted to Facebook and check every single status that your friend postput you hand on at the top of your shoulder blade, press hard with your fingers, and you feel sore

You might need GollaGolla!

“Don’t mend the sheepfold after a sheep is lost; don’t take precaution after suffering a loss.”

-AncientChineseProverb

The Problem

Working with computer for whole day is not rare nowadays. Personally, I am a frequent computer user. I spend more than 4 hours play with my computer or surf the Internet everyday. At some busy day I might spend more than 8 hours continuously using computer. I didn’t real-ize that prolonged computer use could damage my physical health until two years ago, I suffered from Wrist Resting Syndrome/WRS (disorders caused by mouse overuse). Aware of it happens again, I consciously wear wristband while using mouse (mostly I used table-let instead) and start

to pay attention to various computer diseases.However, how does computer using relate to disease? Here are some voices from the world.

• “In the recent all-computer based lifestyle and the substantial growth of computer use, requires people to excessively looking at the computer screen has contributed the percentage increase to 65 of vision impair-ment problems such as Computer vision syndrome (CVS) and longsightedness among teens aged 15 and above….”(World Eye Health Day)

• People who work on computers are more

15

than doubling their risk of heart disease and increasing their chances of premature death. (UK News)

• “… two or more hours of screen time each day may place someone at greater risk for a cardiac event.” (Dr. Emmanuel Statements from University College London’s ¬public health department)

So what causes computer disease?

Prolonged computer use; bad lighting of the surrounding environment; lighting reflection and glare; and incorrect or inappropriate computer screen’s position may cause vision impaired such as red eyes, trouble changing focus, tired eyes; contact lens discomfort due to dry eyes, cyclic momentary blurred near vision, increase glare sensitivity and Computer Dependency Syndrome; sitting on the same position and focusing on the screen for a long time might cause glaucoma; bad posture, high speed typing for prolonged computer use might lead to different level of Repetitive Strain Injury (RSI), which includes Musculoskeletal disorders, neck pain, back pain, Carpal Tunnel Syndrome, Tenosynovitis DeQuervains, Thoracic Outlet Syndrome, Shoulder Impingement Syndrome, and Tennis Elbow; prolonged computer use also might cause stress, headache, varicose vein, high blood pressure, or osteoporosis; radiation from monitor might lead to aging of the skin, or the worst case, cancer. Additional, Over snacking might cause Long-term obesity. Over 4

hours using of the computer will double the risk of heart attack. Incorrectly computer using is like an invisible killer. Most of people know prolonged computer using is bad. But meanwhile, how many people consciously avoid prolonged computer using? Approximate 90 per cent of the people who filled in the survey gave a negative answer. A lack of conscious, which one must take breaks while longtime computer using is common.

Current Solution

The current status of how people improve their computer using environment or circum-stance roughly can be divided into two kinds, usage of ergonomics computer supplies and physical activity. Ergonomics computer supplies are products that are scientifically concerned with designing safe and comfortable computer use, such as ergonomic keyboards, ergonomic mice, trackballs, arm supports, and so on. They provide people with comfort and productivity while helping to reduce repetitive stress injuries. Relatively, the product might cost up to hun-dreds. Physical effort includes regular exercise, dietary supplements that might be beneficial to your heath system (such as Vitamin A, Vitamin C), attention to sustenance (balanced meal). However, people who do regular exercise still need to be conscious of taking breaks during computer use. Especially people who are too lazy to do regular exercise and also lake of con-scious to take a break.

16

Improvement of Physical Activity

Build an ergonomic computer workstation if you can afford the spending. At lease use a support or a mouse and keyboard for your convenience and use a chair that can support the position of your back. Before you use the computer, adjust the position of monitor, adjust the distance between the eyes with the com-puter Glance (at least 60 cm), adjust your seat so that the position of the hand to be parallel to the table when you use the keyboard. Make sure the view between the eyes to the monitor point-ing slightly downwards, make sure the position of hands on the keyboard should form an angle of 90 degrees, as well as leg. During the usage of the computer, rest your eyes with eye blink, eye drops, use adequate lighting, wear glasses, use anti-glare screen. Vitamins (Vitamin A and C), vegetable, fruits, and B-carotenes-rich food are good for eyes. Take frequent breaks. Do not use a computer without interruption (more than 2 hours), stood up, a little sports (stretching) and walk a minute (1 minute) periodically before continuing your work. Additionally, Washing face, blink drips of water on face can help skin. Squeezing tennis ball can do wonders for joints and muscle.

Proposed Solution and usage

To make people aware of computer disease and encourage them to take a break or do some exercise every 30 minus while using computer,

I propose to design a computer gymnastics game kit to fight for a healthier computer using circumstance. The package will encompass the actual product, mobile diveces(smart phont app) and computer wallpaper/screen saver. The actual product might include a timer, a user guide, gymnastics cards that can be set on the desk as well as fit in the pocket. For example, you set the timer at 30 minus. After 30 minus later the timer rings, and you pick a card from the card set on your desk. It says: Eyeball exercise! Look up to down for five times and look left to right 5 times. You follow the instructor and finish the exercise. This exercise can help relief the pressure. If you want to do more exercise, you can pick another one. It might say: Imaging you are a gorilla and there is banana hanging on the ceiling. Try to reach it! (with the illustration of the posture on the card) 10-20 times! This can stretch your arm muscle and decrease the pressure on the neck and shoulder. Moreover, you can just pick several cards and put them into your pocket and do the exercise anytime you want. To enhance participator and increases their activity, I would like to make the exercise fun.

Target Demographic

The Target Demographic is young frequent com-puter user in the age of 18-30, mostly college student centered. These people are more likely neglecting the aware of disease because the youngness. They potentially have more curiosity and tendency of experiencing “silly” thing (such

17

as image themselves as gorilla) than the older. They have limited budget to buy ergonomics computer supplies

Target Research | Survey Analysis (p=people) (20 participators in totally, all stu-dents)

1. Do you consciously avoid using the computer?

Yes No Sometime

2. How long do you use the computer everyday? Less than 2hours

3 to 4 hours 4 to 6 hours 6 to 8 hours more than 8 hours

3. How much will you spend buying ergonomics supplies?

Less than $10 $10- $50 $50 - $100 more than $100

4. How often do you take a break when you are using the computer?

Every 30mins Around an hour Until I feel tired Never

5. Do you have any of the following symptoms after prolonged computer use?

Tried eyes Dry eyesShoulder painBack pain Neck pain Muscle ache Stress Wrist / Joint ache Headache Pain knee Blurry vision

6. What do you do during the break? Watch movie, talk to people, walk, eat, shop, do some exercise, cleaning room, go to bath-room, bike, make tea/coffee, cook, Facebook, yogurt, smoke, drinking water, wonder in house, wish I got one, waste time, dance.

What I’ve noticed from the survey:

1. Most of the people lack of the conscious of taking breaks.

2. Most people spend more than 4hours in front of the computer.

3. Students are likely avoid spending money to improve the incorrectly computer using situation.

4. Eye problem and shoulder/back problem are the two main problems.

5. Most of the people don’t have a regular break time while using computer.

18

6. People don’t really know how to rest during the break.

GollaGolla Items

Actual product:• User guide (go to download gymnastic

graphic from website)• Timer/alarm (to remain people taking breaks)

(not necessary)• Gorilla sticker (to remind people go gorilla)• Gorilla gymnastic/exercise cards• Gorilla advice/suggestion cards(might be the

backside of the card)

In computer:• Website for downloading wallpaper or

screensaver• Screensaver or wallpaper (with gymnastic

instruction)• iPhone/iPad application

Inspiration & Brand Identity

“Creative ideas flourish best in a shop which preserves some spirit of fun. Nobody

is in business for fun, but that does not mean there cannot be fun in business.”

—LeoBurnett

This section includes inspirations and brand identity. Inspirations includes collected images of Logos, typeface treatments, color combinations and char-acter stylizations. The brand identity section includes Logo, different valuations, color pallet and character.

In the early stage of Logo design, I was looking for a friendly, hand drawing combined with digital style, modern and fun appearance. Later on, I was more focused on approaching a pop-looking, energetic and conversational image. As well as typeface, I was looking for a warm, friendly, soft-aged, modern and energetic appearence, which also can make a good combination with the gorillar character in the exer-cise instruction illustrations.

Logo Inspirations

21

Typeface Inspirations

22

Gorilla Studying

23

Logo Sketching

1

32

24

Typeface

Gill Sans

Bryant

ITC American Typewriter

MrsEaves

Museo 700

Clarendon BT

Forte MT

BelloLogotype

body text

warmfriendlypopmodernenergetic

25

Developing

creating bodyline

creating stroke contrast

simplified shapewild animal serious lookingcurvyorganic

approaching harmonious and balance

creating conversation

incoorprated the image into the negative space

26

Disscution & Feed Back

Gorilla from classmates

27

Developing

28

Improvement

Thined Bello Uppercase

90% scaledvisually balanced

balance the weight of bubblecreates positivity alive

adjusted stroke weightavoiding repetitionequaly sized

conversational

raised up

29

Logo Variation

Mark

Minimall use (lower the ½in height)

Logo

30

Color Inspirations

31

Color version

Pantone 7533 U

C 30 M 35Y 60K 80

R 61G 33B 52

R 130G 142B 89

Pantone 7495 U

C 51 M 31Y 76K 9

Pantone 7499 U

C 2M 4Y 31

C 10M 3

M 42Y 81

M 30Y 15

M 11Y 65

C 50Y 15

R 250G 237B 188

Y 75K 11

32

Gorilla Inspirations

33

Character

Hand drawing juggle lines

+

Too cartoonToo cuteLess gorilla

Too weakLack of wild energy

Too realisticNot flexible

WildFlexibleSerious

Prototype

“The gold of prototyping is to give form to an idea to learn about its strengths

and weakness and to identify new directions for the next generation of more

detailed, more refined prototypes. Creative ideas flourish best in a shop which

preserves some spirit of fun.”

—ChangebyDesign

User Testing

Instruction

Illustration

Package

Feedback

35

Prototype 1

Cards

In the first prototype, 47 cards are created. The exercises are chosen from exercises books and website researches. It is a combination of indoor exercises, office exercises, yoga poses, stretches, tips for correctly computer usages and healthy advises. In 47 cards, there are 8 cards of Head & Neck stretches, 11 cards of Upper body stretches, 9 of Limbs stretches, 9 cards of Lower body section, 5 cards of Take a break section and 5 cards of Yoga Pose section.

39

User Experence

The first prototype is focused on testing weather the exercise and the instruction works or not. It contants 47 cards with instruction on the front and illustration on the back.

Featured User:Position: manager and frequent computer user (more than 6 hours a day)Environment: Limited office spaceStatus: Recently went to healthy center and got some poorly designed instruction of stretches which help to relieve the stress of prolonged computer use.Feedback: helpful in general; lovely size.Favorites cards: Toe stretch, Deltoid muscles, eyeball, banana break, bathroom.Suggestion: Some instructions are confusing; can not do yoga pose at office; no place to attach it on the screen or set on the table.

“Early prototypes should be fast, rough, and cheap.”

—ChangebyDesign

40

Next step:

Correct instruction, choose more practical informations, start doing illustration, start making container and more test!

41

Prototype 2

Card Size

In the second prototype, 44 cards are chosen, 7 cards of Head & Neck stretches, 9 cards of Up-per body stretches, 9 of Limbs stretches, 7 cards of Lower body section, 7 cards of Take a break section and 5 combination card. The Yoga Pose section is removed because the difficulty and the awkwardness to practise in the public space. In the break section, 2 bathroom cards are added because most of the people mentioned that go-ing to the bathroom is the first time of taking a break when they usng on computer.

3.5’ x 5.5’ 3.5’ x 5’ 3.5’ x 3.5’ 2’ x 3.5’ 0.75’ x 1.185’

A common pocket sizeCute shapeComforable holding

Layout

Museo 700 10points spacingClean shapeEasy to readCharacter feature

43

Cards

44

Process:

Information on the card are modified again and agian. While doing user testing, lots of feedback and correction are gave from them.

48

Package

Where to place the product in the environment?How to make it stay on the table?What size should the container be?

Easy access

Stable

Reasonable size

Easy access

Stable

Reasonable size

49

Easy access

Stable

Reasonable size

Easy access

Stable

Reasonable size

Easy access

Stable

Reasonable size

50

Prototype Package

1

51

2

3

52

1

2

3

StableEasy accessEasy to understand how to use the product

54

User Experence

The second prototype is focused on testing the corrected instructions and illustrations.

Featured User:Position: Student (Frequent computer user)Environment: Limited spaceFeedback: Nice box, easy to use, doesn’t occupy so many space, clear and nice illustrations, enjoyed doing the stretch Favorites cards: Finger dance, Toe stretch, eyeball, banana break, look at greenerySuggestion: Several instructions are misspelled

56

Next step:

Correct instruction, full color version, paper choice, texture choice, package design, and, of course, more test!

57

Color Version

Take a Break

Limbs

58

Head & Neck

Lower Body

59

Combination

Upper Body

60

Paper & texture test

Paper:Red river 50plWarm whiteCovered with matte contact paper(water proof)

Paper:Epson 120gBright whiteCovered with glossi contact paper(water proof)

61

Prototype 3

In the third prototype, 50 cards are included, 7 cards of Head & Neck stretches, 9 cards of Upper body stretches, 9 of Limbs stretches, 7 cards of Lower body section, 7 cards of Take a break section, 7 combination card, 2 shuffle the deck cards and 2 blank cards. In the blank card, people can make notes or create their own GollaGolla combination. Meanwhile, the actual package design are in the process as well as the copywritering of the product.

62

1

2

63

Back Front

1 2

IT TAKES A

get the monkeyTo

65

BackFront

IT TAKES A

get the monkeyTo

66

Doublesided Printing test

67

Print & Adhering

contact paper

help from friend

68

Cutting & Corner Rounding

70

rounded corner

71

More testing

72

Box...and More Boxes

difficult to make it fluent to flip

difficult to make two piece match

74

Die Cut & Wrap front

75

back

IT TA

KE

S A

get th

e mo

nkey

To

76

Final Cards

TipOpen your mouth at the same time to relieve more tension

Relax your facial muscles

Raise your eyebrow and hold for 3-5 seconds, then r elax

Repeat 3-5 times

Relieves nervous tension on your face

Why

Keep your head facing forward

Look up and down 5 times

Close your eyes for 3-5 seconds

Repeat

Reduces eye pressureWhy

Head & Neck

Upperbody

Lowerbody

Limbs

Take a break

Combination

Shuffle

Blank

77

Gently rotate your neck clockwise 3-5 times

Then rotate counterclockwise 3-5 times

Improves circulation and reduces the muscle tension on your neck

Why

Keep your head facing forward

Look from left to right 5 times

Close your eyes for 3-5 seconds

Repeat

Reduces eye pressureWhy

Stretches neck muscl eWhy

78

With your arms hanging loosely at your sides

Gently tilt your head downwar d

Keep your shoulders relaxed and hold for 5 seconds

Repeat 5-8 times

Stretches the back of your neckWhy

TipThis pose can be done either sitting or standing

Stand with your arms out in front and crossed over

Reach your hands forward as far as possible

Separating the shoulder blades can relieve shoulder str ess

Why

TipFacing downward can stretch neck muscles at the same tim e

Raise one arm until it is perpendicular to your body

Raise the other arm over your head and spin it 5-8 times

Repeat on the other side

Stretches the muscles along the arm and relieves stress

Shoulder Rotation 1

Why


79

Pull your shoulder blades toward each other

Hold the pose for 5-8 seconds, then relax

Relieves the stress of your shoulder, chest and upper back

Why


Bring your shoulders to your ears until you feel a slight tension in your neck and shoulders

Hold for 3-5 seconds, then r elax

Repeat 5-8 times

Relieves the tension in the shoulder and neck a rea

Shoulder Lifts

Why

TipThink: “Shoulder up, shoulder down”

Hold your left a rm above your elbow with your right hand

Look over your left shoulder

Gently pull your elbow towar d the opposite shoulder until a stretch is felt

Hold 8-10 seconds

Repeat 3-5 times on each side

Stretches your deltoid muscles, back of upper a rms and neck

Why

80

Raise your shoulder

Lower the other side downward


Relieves your shoulder muscles and neck

Shoulder Elevation

Why

Stand with your arms hanging loosely at your sides

Raise your shoulders and gently rotate them

Rotate in the opposite dir ection

Repeat 3-5 times

Relieves shoulder stress

Shoulder Rotation 2

Why

Reach and clasp hands behind your back

Raise arms with your back straight until you f eel tension on your back

Hold 3-5 seconds

Relax and repeat 3- 5 times

Stretches muscles along the arm, wrist and upper back

Why

81

Relieves the stress of your shoulder, chest and upper back

Why


With your arms hanging loosely at your sides, rotate your arms clockwise 8-10 times

Repeat counterclockwise

Relieves the stress of your shoulder joint

Shoulder Circulation

Why


Sit on a chair

Hold onto your upper left leg just above and behind the knee

Gently pull your bent leg towa rd your chest

Hold for 5-8 seconds


Stretches hamstrings and lower back muscles

Why


82

Stand with hands on your hips

Gently turn your torso at your waist and look over your shoulder until you feel the stretch



Stretches back and sideWhy

Tip

Stand with feet shoulder-width apart

Keep body upright and bend to the left


Repeat on the other side

Stretches abdomen muscl eWhy

Tip

Sit on a chair with your f eet on the ground

Place your right hand on the back of the chair and your left hand on right knee

Gently rotate spine to the right



Stretches back muscle and abdomen

Why

TipDo not over-twist the spine

83

Sit on a chair

Lean forward to stretch

Keep your head down and your neck relaxed


Use you hands to push yourself upright

Stretches and reduces muscle tension on the bac k

Why

TipDo not push yourself too ha rd to touch the ground

Stand with your arms hanging loosely at your sides

Gently and slowly bend your body back and forth 8-10 times

Stretches and reduces the muscle tension on the back and abdominen

Why

TipKeep your legs relaxed

Put your hands on your hips and stand with your f eet shoulder-width apart

Gently twist your waist to the left until feeling tension

Back to the middle and twist to the right

Repeat 5-8 times

Why

84

Place your right hand on right shoulder and your left hand on left shoulder

Circle the elbows

Ten circles in each direction

Relieves shoulder tension and stress

Why


Stretches the leg muscles and relieves joint ach e

Why

Sit on a chair with one f oot on the ground and the other one 90 degrees to your body

Push your toe back and forth 5-8 times


Improves leg circulationWhy

85

Place your palms together in front of you

Move your hands downward, keeping palms together


Rotate hands back and forth around 5-8 times

Relieves wrist, forearm and hand stress

Why

Crumple a piece of paper or cloth into a small ball

Hold it tight in one hand f or 3-5 seconds

Repeat 3-5 times

Why

TipYou can use the same paper over and over again

Why

86

Stretches wrists and lower a rmsWhy

Head up, back straight, feet 6 inches apart

Step forward as shown

Return to standing position

Keep your back leg str aight

Repeat on the other leg

Stretches legs muscles

Front Lunge

Why

Finger Dance

Why

87

Take A Break Take A Break

Eat A Banana

TipIf you don’t have a banana with you, eat an apple or other fr uit

Take A Break

88

Take A Break

Tip

Pick one NECK ca rd

Pick one SHOULDERS card

Why

+

89

Pick one FINGERS ca rd


Pick one LOWER BACK card

A combination for graphic artists

Why

+

+ +

Pick one FINGERS ca rd

Pick one WRISTS card

A combination for keyboard operators

Why

+

Pick one WRISTS card

Pick one NECK ca rd


Why

+

+ +

90

Pick one card from each stretching category

A combination for when you feel stressed-out

Why

+

+

++

TipCreate your own GollaGolla combination!

91

Final Product

96

Applications

“Good things come in small packages”

—Unknown

To enhance the user interaction with GollaGolla Gymnastics, applications for smart phone and com-puter were created. In this section, the illustrated application user interface is based on iPhone app. It includes the full set of GollaGolla cards and timer, which helps to remind people to use GollaGolla while using computer. The computer wallpaper is designed to be an additional support for those who are already using GollaGolla cards. Each wallpaper contains a combination of three to five exercises.

97

iPhone app

98

Loading page Main Menu Catalog

Favorite

TimerStory Board

99

Click shows menu Click shows menu

Double click to illustration

Swipe to get another card

Shake to get a random card

100

Apple app store

101

iPhone app

shake

shake to get a random card

102

Wallpaper

The wallpaper is designed to support GollaGolla cards. User can follow the information on GollaGolla package and download the wallpaper from GollaGolla website. The purpose of wallpaper is to remind computer users. User can set wallpaper as well as screen saver changing automatically every 30 minuets to get a different combination of 2 to 5 GollaGolla exercises.

103

Front Lunge

105

Further Considerations

For the further development of GollaGolla product, pocket size product such as a mini set of GollaGolla cards might be conceded. Also, more options of different exercises as well as exercises for other pur-pose might be added into Golgotha brand.

GollaGolla ProcessBook

Documents

Transcript of GollaGolla ProcessBook