INTERACTIVE DESIGN FOR GAMES AND WEB APPLICATION

DESIGNING GAMES PROCESS


After finishing the games, we need to create the game using the background in Mantin to create the game. For me I create an Interactive story where I just need to change the backdrop, and glide the character and put some dialogue.

Even though mine is the easiest, because it is the new software and the coding is bit confusing and after I done it right when I open it again the coding is missing and I need to create new coding again.

Below is the screenshot of process of making the story:

REFLECTION

After doing this I think it is fun to learn new things but because it first time we creating game, so we need to understand the coding and how to connect the game so it can be play.

INDIVIDUALS DESIGN PROJECTS

Individual Design Projects

The Topic for Individual Design that I choose after the trip to Mantin.

Topic: Architectures

Focus: Historical Building in Mantin

For this project, I’m going to create an interactive story telling about the history of the historical building in Mantin. I choose this topic because Mantin has many building that been for hundreds years but the non-preservation of this buildings going to make the buildings lacking it history and identity. For example, Hakka Village. When we going there last semester to conduct an installation arts for Hakka village so that everyone has the feeling of the village without going there. The village environment look abandoned and the only people lives there is the older people only and they still use old electricity system.

INDIVIDUAL DESIGN PROJECTS

Individual Design Projects

System

System is a set of principles or procedures according something is done. System also a set of interacting or independent components forming an integrated whole.

In Individual Design Projects, the system is more consists to what I going to do for my projects. For example, I can look from the method that I going to do to solve my problem because it important as a designer to collect on any evidence you could find while you doing and also from the procedures that I going to use in my projects. This finding need to be note down and recorded as an evidence and also my references.

In this projects, I need to conduct a systemically what I need to conduct between the modules that will interacts with this individual projects. For example, principle of marketing is for me to learn a strategy to market my project. I also will learn about my target audiences, how I going to attract the customer through a campaign. Then, in interactive design for web technology, I learn to create my own website to introduce my projects to the target audiences. In color and design in two and three dimension, I will learn how I going to create an attractive design and using color to attracts audiences towards my project. In interactive design for games and web applications, I get to create some interactive activity and this going to help me interacts with my audiences and lastly is 3d character and environment design for animation, is where I going to create my character and the environment that specially for my projects.

REFLECTIONS

In doing this systemically procedures, it will help organize what we going to do for our projects. It also help you what you going to decided so that yours modules can be cooperated together.

INDIVIDUAL DESIGN PROJECTS

Individual Design Projects, Interactive Design for Games and Web Applications

Journey to Mantin Town

For this task, we need to one place to conduct research about the projects we want to do. So in the assignment brief the projects is going to promoting Mantin to our target audiences. We were required to collect the data any information of Mantin that we need for our projects.

We need to take pictures of what we going to found in the Mantin as our evidence and also as references of our projects. Before us going to Mantin, we also need to list what topic that we will pick to help us in conduct the research of the data later.

Topics:

Culture

·        Foods

·        Colors

·        Religions

·        Profession of people in Mantin

·        Transportation System

·        Safety System

·        Education System

·        Architectures

·        Plantation system and etc.

All of the topic above I need to pick one that do to promote Mantin.

REFLECTION

In doing this project, I will learn more system and life in Mantin. Even though, I’m a Malaysian, I didn’t know about Mantin until I came here and I feel attracted with this small, busy and mysterious town.

INTERACTIVE DESIGN PROJECTS

Individual Design Projects

System

System is a set of principles or procedures according something is done. System also a set of interacting or independent components forming an integrated whole.

In Individual Design Projects, the system is more consists to what I going to do for my projects. For example, I can look from the method that I going to do to solve my problem because it important as a designer to collect on any evidence you could find while you doing and also from the procedures that I going to use in my projects. This finding need to be note down and recorded as an evidence and also my references.

In this projects, I need to conduct a systemically what I need to conduct between the modules that will interacts with this individual projects. For example, principle of marketing is for me to learn a strategy to market my project. I also will learn about my target audiences, how I going to attract the customer through a campaign. Then, in interactive design for web technology, I learn to create my own website to introduce my projects to the target audiences. In color and design in two and three dimension, I will learn how I going to create an attractive design and using color to attracts audiences towards my project. In interactive design for games and web applications, I get to create some interactive activity and this going to help me interacts with my audiences and lastly is 3d character and environment design for animation, is where I going to create my character and the environment that specially for my projects.

REFLECTIONS

In doing this systemically procedures, it will help organize what we going to do for our projects. It also help you what you going to decided so that yours modules can be cooperated together.

INDIVIDUAL DESIGN PROJECTS

Task 1

Introduction

In this first blog post, it is about my understanding about what we going to learn in this new semester. We were introduce into a new way of learning where we have one driver module that all of the modules that we take in doing one project. So this module is our conductor to coordinates the other module in making a project that be known as “Promote Mantin”.

In Individual Design Project, this module will introduces me into procedure of developing and complete a detailed research project in graphic design. First when our tutor explain about it I was a bit confused and try to understanding about this module. In this task we will learn one the key skill of a designer that is to be able identify a design problem, analyse the problem and provide the problem solving or alternate solution on the problem.

So, when I read the assignment brief, I understand that this projects will be splits into four phases, which all of it is corresponding or interacts with each other. The first phase is I will need to conduct research and identify the issue that can form in the basis of detailed research project. For example, I need to conduct a research about Mantin Town and identify the issue in it before I conduct the project that I plan. In doing this I would know what I going to do a solution for it.

Second phase is all about how I going to develop this problem into an argument that I can identify the aims and objectives of the project to developed the contemporary design of the projects that I done.

Then, we look into the third phase where you need to coordinate your coherent response that will work with the other module outputs in creating a cohesive complete design solution.

Finally, the important is I need to identify and discuss the responsibility of the designer to implement the creative commons that known as copyright and copyleft solutions in my projects.

REFLECTION

This module is really going to help me in solving the problem of the projects that we going to do, even though it a little bit confusing and I need a second and third explaining to begin understanding it and it will be great that we can learn the key skill to be a great designer.

Principle of Marketing

Principal of Marketing

Blog post 1;

The topic that I choose to promoting Mantin for Legendarian is about Historical Building. First, I want to promote history about Mantin but then I change my scope because of the communication problem between me and the older people of the village for the language gap. So, in this topic I, need to take picture about the old building or abandoned building. So in our journey to Mantin I take this opportunity to find the pictures that I need.

This the example of pictures of building that I take:

Picture 1

Picture 2

Picture 3

Picture 4

Picture 5

Picture 6

Picture 7

Picture 8

Picture 9

Picture 10

Picture 11

Picture 12

But I need to go to Mantin again to research more and take another pictures in another different perspectives s so that the Legendarians can see the different of pictures that take in 1 perspectives. This is the right side of Mantin. Mostly the old building is on the right side.

The historical building that I know in Mantin is Hakk Village age 120 years, Aloysius Church also 120 years and also Gudwara for Sikh people to pray but I didn't has the picture yet.

Contemporary Design Issues

 Contemporary Design Issues

My Argument

Topic: How the Designer change the Perceptions of Children using Packaging.

Why I choose this topic as argument? I choose it because I want the children to eat healthy food and no just attracted to the colorful junk food. It is because, nowadays the population of the obesity in children and adolescent is increasing rapidly and it worries everyone out there. It also the increase the production and consumption of unhealthy food in children especially in Malaysia.

What the cause of this phenomenal acts in children? One cause that we already know is how attractive the junk food compare to the healthy food especially in colors and design.
Below is the image of the comparison between junk food and healthy food design:

Image 1: The color of junk food package taken at http://www.abc.net.au/news/image/377604-3x2-940x627.jpg

Image 2: The design of the sweet cereal taken at http://idsgn.org/images/business-cards-from-cereal-boxes/cereal_boxes.jpg

Image 3: Dull colors of healthy food package taken at http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2013/11/kallomain.jpg

Image 4: Dull colors of healthy food package taken at https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip5Y55bG36pCjh76Fs6Uc9yZfyAgO-nRci8doj92pYxshioAUA2kpflTGqx6pndsIi5XbHVG8ielqh18xpFjAgJQRFedvepU2DRj_oT2xPPY593nAN0958y3xn7pTHPaTxHlffk3aW3Ynb/s1600/38-best-food-packaging-designs-inspiration.jpg

So, we can see the different of junk food and healthy food. As we know children trend to attract to bright thing and they favorite comic, cartoon or story book characters. This is where the problem start especially in manufacture. The manufacture would like to continue their business and if the product they produce rapidly consume by the consumer and this also help to increase their selling.

There is one cause that people doesn't realize especially the parent, it known as "Pester power" or the kid nag their parent to buy the thing that they want.

Contemporary Design Issues

 Contemporary Design Issues

The Argument Introduction

An argument is the stand point or view of the Author. In academic, argument is form of written text but in art practitioners, this could be in form both of written and practice based work. To develop an argument the author must have a debatable claim.

Researching the Argument

To support your argument you conduct research. There are 2 types of research:

• Primary research
• Secondary research

Both will use many sources of evidence. Yours sources must be credible. To ensure their credibility ask yourself the following questions:

• who is the author ?
• how recent is the source ?
• what type of sources does your audience value ?

Be careful when evaluate internet sources.

Organising the Argument

Use the Toulmin Method as your formula to organising your argument. The basic format for Toulmin Method is as follow:

• Claim: The overall thesis the writer will argue for.
• Data: Evidence gathered for support the claim
• Warrant(Bridge): Explanation of why or how the data supports the claim, the underlying assumption that connect to your claim.
• Backing(Foundation): Additional logic or reasoning that may be necessary to support the warrant.
• Counterclaim: A claim that negates or disagrees with the thesis/claim.
• Rebuttal: Evidence that negates or disagrees with the counterclaim.

Contemporary Design Issues

 Contemporary Design Issues

Introduction towards the Contemporary Design Issues.

In Contemporary Design Issues, there would be rhetoric. Rhetoric is any communication used to modify the perspective of others. It is divided by 2:

1. Author: is anyone creates communication.

2. Audience: is anyone who receives communication from Author.

Author has 2 purposes for employing a rhetorical communication. These are informative and persuasive. Informative cover such thing as:

• to inform
• to describe
• to define
• to review and etc

Persuasive covers such thing as:

• to persuade
• to convince
• to influence
• to argue and etc

Audience also has 2 purpose in receiving communication. These are passive and active purpose. Passive covers such thing as:

• to receive notice
• to feel reassured
• to feel sense of unity
• to be entertained
• to enjoy and etc

Active covers such thing as:

• to examine
• to quantify
• to asses
• to criticize
• to ridicule and etc

Contemporary Design Issues

Critical Awareness

Critical Awareness is also known as critical thinking or how you can be critical. Critical thinking is the ability to think clearly and rationally. It includes the ability to engage in reflective and independent thinking. there are 5 skill that someone with critical thinking skills is able to follow:

1. understand the logical connections between ideas

2. identify, construct and evaluate arguments

3. detect inconsistencies and common mistakes in reasoning 

4. solve problem systematically

5. reflect on the justification on one's own belief  and values

Critical thinking is quiet compatible with thinking " out of the box", challenging and pursuing your own thinking in creating something. 

2D ANIMATION

STRUCTURE

Flip Books

In this task we need to create the flip books about the 12 basic principle of animation. Flip books is create by using quality paper and a series of drawing that will animate by motion when change rapidly. Flip Books is not easy or not difficult to be done for but when you try to do it according to the basic principle it feel difficult and I faces the difficulties in creating the arc and times and also the squash and stretch. I need to understand and series of drawing in others paper before creating the flip books. I create my flip book using a A4 papers and also the small notebooks, then i divides the A4 papers into 4 and the notebooks into 2 sections. After that I staples it on the upper sides or where I want it to be drawing. In creating flipbooks we also faces the difficulties, if not enough amount of paper, the flip books will not move smoothly and the motion will become bad. So to creat a smoothly flipbooks we need a thick amounts of paper. When drawing in the flipbooks we also faces difficulties in maintaining the sizes of our drawing, because after we finish our drawing and when the drawing become unstable the animate drawing will look weird and we need to create it again. I also learn to create the flipbooks by  looking and watching videos in youtube.

REFLECTIONS

by creating this flipbooks, I understand that creating an animation is difficult and not easy because we need to understand the concept and the basic that we learn to create a good animation that will attract the audience and also the smallest thing we done doesn't mean it easy to do.
                                                                        

2D ANIMATION

2D ANIMATION

Task: Movement

In this week we do some exercise or series of drawing that is for this task, such as:

1. Life Drawing
2. Fast Character Sketch
3. Fast Movie Sketch
4.Perspective

1.0 Life Drawing

In this task of drawing, we need to draw the action that our in front of us. We need to draw him or her in figure drawing and also drawing in one line. Doing the figure drawing is not very difficult for me because we already learn it in high school but when doing it really fat and in one single line to create the contour it make the exercise difficult. But after series of drawing my friends action I really had fun doing the fast drawing figure.

2.0 Fast Character Sketch

In this activity, we sit around the group and we need to draw the person that seated in front of us according to the time given. In the time given we need to draw and find something that represent our friends. This activity is fun and nerve wrecking because for example you need to to draw your friend in 5 minutes and you also need to find any symbol to represent them and for example, I draw Aisyah and her symbol is her shawl. Then we change around and the time also become more faster and we also need to draw how many line that been given on that time, for example we need to draw 10 line in 1 minute.

3.0 Perspective

In this activity, we learn about perspective. Perspective is a drawing that we make from one focus point we choose. I've done this in high school but now I need to really understand about the the focus point and where i want to put the focus point to create the perspective. I also faces difficulties of doing this activity because I didn't come to class because of three days sick leave so I learn about this task late than my friends but I try my best to understanding the concept of perspective and perspective is for simple because there not their but we are craetingthe focus point and the perspective.

2D ANIMATION

2D Animation

Storyline

Introduction

The story is about lives of electrical appliances that stay at a huge mansion and rarely use by the human there. Its change when the new rice cooker came (the main character) and his name is Ric. There he meets with Grandpa Cook, Miss Blen, and Mister Fridge (the supporting character). He then say that he cannot wait to serve his new owner. Then the electrical appliances told him the truth that their master rarely use the electrical appliance because they rarely didn’t eat at home.

Climax

Ric feel upset and ask why would the owner buy them if the household didn’t use the electrical appliance. Then his predecessor told him the reason and why the owner didn’t rarely use them anymore especially the rice cooker. Grandpa Cook also telling Ric about the differences of the city lifestyle and village where the in the city the family rarely eat together and cooking together but in the village the mother and daughter will prepare the food together and the feeling of family was in there. Miss Blen also telling Ric nowadays the fast food restaurant is everywhere. People can the food easy, fast, and affordable and the way they like to eat it. People also can get any type food they want in one place such as Italian, Mexican, Chinese and others. Ric feel that is unfairly toward the electrical appliances because there are made to be functional and not as the souvenir or for decorating the kitchen.

Ending/Conclusion

Ric then meet another that feel unfair toward their owner treatment that they want to protest they usage with the owner but Ric hold them up that they use another way to tell the owner that the electrical appliance want to be use and also the owner should to spend time with his family at home.

REFLECTION

Creating a storyline is not easy. You need to understand the main character and also the supporting character to develop the character to make it interesting. 

CONTEMPORARY DESIGN ISSUES

Blog Post 2

The Understanding about Analysis

Analysis is a detailed examination of the element or structure of something. Analysis also known as examination of data and facts to uncover and understand cause-effect relationships, thus providing basis problem solving and decision making by breaking it into its component parts to uncover their interrelationships.

2D CHARACTERS

DESIGN THE CHARACTER

The Life of Young Rice Cooker and Friends

In this task, we were told to make a character for our stories and designing our own character based on our culture and history. In this task I design a character based on rice cooker that Malaysian has use in their daily life. This lead to creating the story of the life of the young rice cooker and his friends. The character is Ric (modern rice cooker), Grandpa Cook (traditional rice cooker), Miss Blen (blender or food processor) and wise Mr Fridge (refrigerator) living in the big house of their rich owner.

I choose this type of story because I want to show that even inanimate object like electrical ware has feeling and talking to each other about their master. So this is my plot of stories.

INTRODUCTION

It started on a certain big house and entering toward the house where a maid pull out new rice cooker from the box and place him next to the old rice cooker. The young rice cooker or known as Ric feel excited to start his work with other appliances at the kitchen and meeting his ancestor, Grandpa Cook. He also make a new friend with beautiful and friendly Miss Blen and wise looking Mr Fridge. During his stay there, he feel weird because he rarely been used by the maid and Mr Fridge told him that the their owner rarely eating lunch at the house and this is why Grandpa Cook service end. He also about variety of his predecessor and ancestor and their history in people life.

CLIMAX

In this part, young Ric learn about reason why their owner doesn't eat at home and he feel angry because he feel that if their rarely use them why they want to buy them. Miss Blen answer his question by telling him that maybe become some of accessories in the house. Grandpa Cook told Ric about his story when he was young, when people still eating with the family and strengthens theirs bond while eating and cooking together. Grandpa Cook also feel disappointed about the way modern people lifestyles nowadays when family just meet briefly. Ric thoughts that his owner must be taught to feel the important of bonding with family and eating together at home and not making the useful appliances like a decoration at home. So, he make a strategy with main switch to stop the electricity.


CLOSURE

Their owner feel the difficulties when the electricity was shut down in the house and they need to use Grandpa Cook to cook the rice and the owner dream about Ric threatening him to stop treatin them like a decoration item and try to eat at home to strengthens his bond with his family and take care about their health.

ENDING

The story end by the happy look of their owner eating with his family and a little quotes about eating together at home and that inanimate thing also has feeling even though they are made by human.

Picture 1

One of example of my storyboard, taken by Alexis using phone camera.

Picture 2

Storyboard example, taken by Alexis using phone camera.

Picture 3

Character of my story. From left to right. Ric, Grandpa Cook, Miss Blen and Mr Fridge. Taken by Alexis using phone camera.

Picture 4 and 5

Solid drawing and structure of one of my characters. Taken by Alexis using phone camera.

REFLECTION

During doing this task, I learn many difficulties about creating a character and making the story and fitting the character in my story but I learn about it slowly and try to understand the way of making animation in simplest way that I can know. 

IMAGING FOR NARRATIVE AND STORYBOARDS

12 BASIC PRINCIPLES OF ANIMATION

1)    Squash and stretch: Squash and stretch is when an object changes shape based on some sort of impact or movement. For example, when a hard rubber ball is thrown, it may hardly change shape, but when a softer ball is thrown, it may change shape depending on the force of the impact. Squash and stretch is used in animation to give it a more realistic feel. For example, if in an animation, a character is punched in the face, squash and stretch would be used to show the impact in the face, and it would show the impact on the hand too.

2)    Anticipation: Anticipation in animation is the same as anticipation in real life. When a character is going to kick a ball, the anticipation would be the character moving his foot back before kicking the ball. Another example is a character preparing to run by putting one foot behind its body, and getting lower to the ground. Anticipation is used in animation to give the viewer a better understanding of the action that is about to happen. For example, if there is an animation of baseball game being played, the anticipation for the batter would be to move the bat behind his head ready to swing. The anticipation of the pitcher would be to lift his leg up and get ready to throw the ball.

3)    Staging: Staging in animation is when you make an idea clear to the audience. The idea could be an action, a personality, an expression or a mood. The key point to staging is to make sure you catch the viewer’s eye and that they are draw towards the idea that is taking place. The animator must use different techniques to make sure the viewer is looking at the right place at the right time. This could be something as simple as moving the camera so that it focuses on the key event or idea taking place.

4)    Straight ahead action and pose to pose: These are two different approaches to the drawing process. The straight ahead action in hand drawn animation is when the animator starts at the first drawing in the scene and then draws frame after frame until they reach the end of the scene. The pose to pose action is when the animator carefully plans out the animation, and draws a sequence of poses. These are usually the starting pose, some poses in the middle, and the final pose. Then that artist, another artist, or a computer draws the inbetween frames. This is similar to key framing with computer graphics, but it must be changed slightly since the inbetweens may be too unpredictable.

5)    Follow through and overlapping action: Follow through is the end part of an action. For example, when throwing a ball, the hand continues to move after the ball is released. Overlapping is just starting the second action before the first action is finished. This keeps the viewer interested because there is no dead time between actions.

6)    Slow in and Slow out: The principles of slow in and slow out in animation is to make the animations look more realistic. This is as simple as a ball bouncing. The ball starts out stationary in your hand. Then when you let go it builds up speed until it hits the ground. Then it would come back up slightly slower than when it went down. Then when it reaches its maximum height it stops and repeats the process. Every time the ball hits the floor or its maximum height it loses speed, so the ball would eventually stop bouncing.

7)    Arcs: An arc is used for an action or movement. This could be moving your arm. You would have a key frame at the beginning and at the end of the movement. The arc is the action in between the two frames. This is usually used for characters but can also be used on objects.

8)    Secondary action: A secondary action is an action that comes from another action. Secondary actions are used to heighten interest in a scene, and to add a realistic complexity to the animation. If the secondary action becomes more interesting than the main action, then it is either the wrong choice for secondary action or it is staged wrong.

9)    Timing: Timing is an important principle because it gives meaning to a movement. Timing can affect how real a scene looks. Timing is used for characters feelings, and facial expressions. For example, if a character is shocked, you should be able to tell he is shocked because he should look shocked in his facial expressions right after the shocking event has occurred. If the characters shock was delayed, and the character didn't react until 5 or more seconds after the event, the scene would not be realistic, and you could lose the viewer’s interest.

10)  Exaggeration: Exaggeration is used in animation to help the audience know for certain how a character is feeling or acting. For example, if a character is angry in a scene, you could make him furious, with his eyebrows down, and gritting his teeth. A scene has components such as action, objects and emotion. Exaggerating all of these can create an uneasy and unrealistic scene, so finding a balance of exaggeration is important.

11)  Solid Drawing: Solid Drawing is used to make the main character or object stand out from the rest of the animation. This is so the character does not blend in to the background, and so that the character can easily stand out for the viewer. Solid Drawing is always drawn on its own layer so that it can be animated more easily.

12)  Appeal: Appeal in animation is the same as acting in a film. The way the character or object looks, moves and interacts with other characters has a large impact on the viewer and how much interest they have in the animation. Usually, the more realistic the character the more interest the viewer has.

This information taken from jordanwharton.wordpress.com/year-2/unit-67-3d-animation/12-principles-of-animation.

REFLECTION

From this information I learn new thing and revise back some of the basic principles in animation that I know and this help me to do the task and how to understand it function in making animation.