TASK 2 : Second game concept and story

I was thinking what story should I use to make it more meaningful since I have abandoned the previous story. I thought I would go with something relatable to more people – anxiety and depression. These days a lot of people, especially teenagers, are suffering from these things. Making a game about it will make them relate to it and feel closer and more attached to the game and it’s story.

Nonetheless, it might even help to overcome these fears since it will remind them they’re not alone and that if you look at things from the other side everything can get better.

Story:

The story is about young girl who falls asleep, while she is asleep in her mind she is travelling where the game takes place.

She suffers from anxiety, depression and paranoia. She understands that all these fears are deep in her unconscious mind. When she is asleep her sub-concence brings forward all the problems that she faces in her normal life.

Gameplay:

When she falls asleep and the gameplay begins, the first thing she does is to find and destroy the 3 monsters. (Game will contain 3 levels). Nonetheless the game level that I like to develop is about anxiety.

Each monster will be like a boss at the end of the level. The main monster will send smaller monsters which are a part of him. These will try to wake her up so she doesn’t reach the root of her fear in her unconscious mind (the monster).

For example, she’s trying to chase the anxiety in her mind. The anxiety will send small monsters such as ‘hopelessness’ and ‘guilt’ so she wakes up and doesn’t reach the root of her main problem – depression.

She will have to fight them off to stay awake and get deep into her mind to fight her fear. After she wins the fight against the boss she will get rid of the monster also known as some kind of disorder.

She will also have to collect 6 crystals. The crystals will appear each time at once, and after she collects the first crystal the second one will appear at the other place. While collecting the crystals she will have to avoid the smalls ‘bullets’ which the enemies will be shooting. Some of the platforms and enemies will be moving to sides or up and down. You will also be able to collect 2 shields which can protect you up to 3 bullets and 2 lives which will appear as hearts.

After collecting all the crystals the skulls are going to disappear and the slowly falling petals off the tree are going to turn black. The girl will have to make her way to the doors which are in the top right corner to get to the next level.

If you lose all your hearts, she wakes up from the dream and game is over.

There are going to be 3 levels and each of them is going to get harder. After she completes them she will have to fight the main boss which, in this case, is going to be her ‘anxiety’.

There will also be a tree in the middle to separate platforms in two sides. To get to the other side you will have to take the doors, and this is how you move between two sides. Other asset which is going to help to move between platforms are ladders:

As we can see in the picture I wanted to create a pastel and dreamy looking background which would create a mysterious and out of this world atmosphere. Since she is in a dream, I used stars and put a big moon in the background. The whole mood of the game background and visuals looks quite positive. However, the enemies are going to appear in a black colour which will be a good contrast to positive and pastel looking background.

I put the HUD at the top to not draw too much attention

Characters:

You
Anxiety + panic, fear, shortness of breath
Paranoia + betrayal, anger, mistrust
Depression + guilt feelings, hopelessness, decreased energy

I made a little research on how these disorders affect the person and what are the symptoms. I used the symptoms to be ‘the smaller monsters’ which are the part of the ‘main monster’.

Screen Shot 2017-10-03 at 10.32.26.png

Screen Shot 2017-10-03 at 10.31.38.png

Screen Shot 2017-10-03 at 10.31.09.png

The art style of the game

For the scenery I want it to look creative and have no limitations (since dreams can be anything). I want to use surrealism as the art style of my game. I would use different images and merge them together to create interesting sceneries. For example, something like this:

However, I’d like to use different colours. I want them to be more vibrant and psychedelic looking. Something like this:

The art style of the ‘monsters’:

They will be dark like silhouettes with faces. Each monster will have different attributes

Advertisements

Maya lighting

Six types of light sources:
ambient – brightens all parts of the scene uniformly
useful for simulating a combination of direct and indirect lighting
directional – even illumination of a scene using parallel rays of light
useful far away sources (ex: sunlight)
point – light radiates in all directions from a single point
ideal for omni-directional sources (ex: lightbulb)
spot – creates a cone of light in one directions
useful for beams of light (ex: flashlight, lighthouse)
area – 2D rectangular light sources
useful for windows, ceiling lights (longer render time)
volume – light fills a 3D shape (sphere, cylinder, etc.)
useful for a visual representation of the extent of the light
create – lights
three point lighting
key light – main source illuminating the object
secondary (fill) light – highlights details of the object
back light – distinguishes the objets from the background
attributes of light:
intensity – how much light emitted from the light source
fall-off/decay – how much light diminishes away form the source light (fall-off)
cone angle – width of the lights cone of influence – area outside cone not illuminated
penumbra angle – fall off at the edge of cone angle – more gives a softer edge to the light cone
drop-off – how much the light diminishes at the outer edges
colour – set an RGB colour for the light – affect colour of scene
light controls
aim from/aim at
fall-off rate
cone radius
penumbra/umbra control
non-linear fall-off
all in one control
two types of shadows:
depth math
raytrace
three types of shadow effects
hard shadows
soft shadoes
fall-out – shadow becomes lighter at the top of the shadow
Shading
its a combination of the basic material of an object and any textures that are applied to it
window – rendering editors – hypershade
types of materials:
blinn – used for metallic surfaces
lamber – matte surfaces
phong -shiny surfaces
standart AI
Robot tutorial:
 
I started off by creating three Ai Area lights. I done this by clicking on Arnold>Lights>Area Light. I positioned the lights on either side and one in the center above the robot.
Screen Shot 2017-11-06 at 11.08.38.png
Then I increased the exposure of the lights to 8. I enabled the colour temperature and left it at 6500. This will gave a cool blue feel to the light. I selected the light on the left and did the same, but now I used a warmer colour, and set the temperature to 4000.
Screen Shot 2017-11-06 at 11.07.30.png
To reduce the noise in the shadows from the Ai Area lights, I increased the light samples to 3. However,  the higher the number of samples, the lower the noise, and the longer it takes to render.
Screen Shot 2017-11-06 at 11.12.56.png
I’ve assigned an Ai Standard shader to the robot. I lowered the diffuse to 0.2 and changed the diffuse colour to a colour and increased the specular weight to around 0.4.
Screen Shot 2017-11-06 at 11.24.14.pngI selected the render camera and open its Arnold attributes in the attribute editor and enabled DOF. I selected the robot’s head and clicked Display>Heads up display>Object Details. I typed the distance from the camera that the head model was value into the Focus Distance attribute, so the robot’s head is in focus.
Screen Shot 2017-11-06 at 11.42.21.png

App and App Design research

UI ( User Interface ) – are the visual elements that the user sees on the screen. It can be buttons, images, icons, and other visual elements.

UX ( User experience ) – it’s the experience that user has as they interact with a certain app.

Wireframing – it’s a schematic guide of how the website or app is going to look like and will be functioned.

15033569833_a327c79601_b.jpg

 

5 well designed apps:

iOS weather app

ios10-weather-app-icon.png

This app was made to inform people about the weather of any location. Everyone can use this app and it’s easy to control. When you open it the first thing you see is the weather of you location:

unnamed.png

At the top there is a text with the name of your location. It’s written in the biggest size so it draws your attention. A little lower there is a slightly smaller text with the description of the weather. It gives the person a rough idea of how the weather is like. The number in the top middle shows the temperature of the weather. It’s in the largest size because it’s one of the most important things and purpose of the app.

A little lower we can see the app lists seven days of the week – from Monday to Sunday.  Today’s date has a gap between other days of the week to show more detailed information. At the left it says the highest and lowest temperature of the day. At the top of the timeline there are hours of the day, and below it we can see little icons of the weather and the temperature. The icons represent what the weather is going to be ( sunny, cloudy, rainy, etc. ) and it shows the sunset and the sunrise. By dragging this weather timeline to the left we can see further hours of the day. Present temperature is the most important which is why it’s presented in bold. Since days are brighter than nights, the day’s temperature is shown in bright colour while the night’s is darker and faded.

Below the timeline there are listed other days of the week with little weather icon on the left. It also says the highest day temperature and the lowest night temperature.

The icons are very minimalistic and understandable. Main of them are sun, cloud, moon, thunder, rain, snowflake, wind, fog and thermometer. Some of them are both combined to create a special icon to represent a specific weather (for example sun and cloud combined creates cloudy icon). Darker cloud represent that it’s night.

ios_weather_icons_1x.png

At the bottom we can see a little cursor and a line of dots. Each dot is a different homepage to a city or location and the little cursor shows your current location. As we can see there is no back or forward button, so to get to another page you have to swap with your finger to left of right.

The background of the page is a picture of the sky which would represent the current weather and the time of the day. If it’s night, the background always has a dark tone. On the day the background is always lighter, but the colour also relies on the weather. For example, if it’s partly cloudy (like shown in the picture) the background will have a blue light sky with a couple of moving clouds. However, if it was cloudy and rainy, the background would appear grey with animated raindrops, or if there was thunder the sky would be really dark with lightning flashing through the clouds and etc.

To create a background first they use a base colour:

iOS-7-iPhone-Backgrounds-PSD-Free.png

Then they other assets such as animated images of the thunder, clouds etc. and the text and layout. The use of white for colour was to make it stand out from the background.

By clicking a small icon of list at the right bottom we get dragged to this page:

unnamed.jpg

It lists all the cities that you have in your app and shows the time and the temperature of it. Each colour of the city also show what’s the weather like in there. At the bottom we can choose whether we can’t to see the temperature in Celsius of Fahrenheit. If you want to remove a city you swipe from right to left on the city and click delete. Little plus icon at the right allows to add more cities to your list:

unnamed-2.png

Smoothies from Whole Living

175x175bb.jpg

 

It is a smoothie app which teaches you how to make healthy smoothies. The smoothies are categorised so you can easily choose what type of smoothie you want:

320x568bb.jpg

When you choose a smoothie the app shows you a more detailed information about how it is good for your health, what it consists of and how to make it:
480x360bb.jpg

 

Bouncing ball animation

To start off, I changed the camera settings first. I went to viewcamera settingsresolution gate. Resolution gate gives a frame for your animation and shows in what resolution it’s going to be seen. You can edit the resolution to any size. For this project I’ve been working in 960×540. I’ve also enabled interactive creation by going polygon primitivesinteractive creation. If the interactive creation wasn’t enabled, the software would create a perfect dimension cube. However, with interactive creation we can drag our shape and create it in any dimensions we want. I also was working by facing the front camera. This is how it looks:Screen Shot 2017-10-16 at 11.34.12.png

I’ve placed the sphere at the top by y axis. By clicking ‘s’ key I’ve selected all keys:

Screen Shot 2017-10-16 at 11.35.47.png

Then by selecting the 24th frame I’ve dragged the ball down by y axis and selected all keys again. Then I’ve dragged the cursor on the timeline to 48th frame and pulled the ball back up again and selected all keys. These were my main points of animation.

Now I’ve selected the ball and turned on graph editor by going windowsanimation editorsgraph editor. A graph editor is a graphical representation of interpolation between animation keys that you can modify. The window with a sphere graph appeared:

screen-shot-2017-10-16-at-10-59-48.png

By selecting the graph I’ve smoothed out the corners and broke the tangents so it would be easier to edit the graph. By altering tangent handles you can change animation curves value and timing.

Screen Shot 2017-10-16 at 11.00.24Screen Shot 2017-10-16 at 11.00.55
Then I started distorting the sphere on the 24th frame to make it look stretched and squished by changing the scale by x, y and z axis:

Screen Shot 2017-10-16 at 11.07.58.png

After that I’ve started adding in between frames to make the animation look more natural. On each frame I’ve changed the shape of the ball to make it look as if the ball was affected by its weight, gravity and mass.

Screen Shot 2017-10-16 at 11.42.20.png

 

 

 

 

 

App Design

Healthy Smoothies App

This app will help you to learn and discover about smoothies which can help you to improve your health and add more variety to your drinking juices.

Audience: It’s for people who live a healthy lifestyle and takes care of their health on a daily basis. Age can be any.

Main idea: This app will have a big smoothie collection and you can choose which one to make. It will have different recipes for different smoothies. It will also show what ingredients contains them and will teach you each ingredient’s benefits and why it is good for you. (For example, the smoothie contains turmeric. By clicking on it you can learn everything about this ingredient. For example, ‘Turmeric dramatically increases the antioxidant capacity of the body’ and etc. )

Advise on illness: It will also advise you which smoothies to drink if you have a certain illness. (For example, you have a cold. You put that in an app and it will suggest you which smoothies are good for this exact illness and why. For example, ‘this smoothie is good for cold because it has ginger, lemon and honey’ and by clicking on the ingredient you can learn more. ‘Ginger is good for a cold because it helps to flush out toxins from your body and boosts your blood circulation.’ and etc.)

Your profile: You have your profile. In profile, you can add your created smoothies and name them as you want. You can see other people profiles too and follow them to see what kind of smoothies they’ve created. You can like or comment on smoothies and discover different recipes.

Homepage: The homepage will contain seasonal smoothies available only on a certain season.
It will also show most popular smoothies created by other people.

Filtering: You can also filter the smoothies you want to see (for example, you can choose to see smoothies only with apple juice and etc.) and you can choose your allergens or the ingredients you don’t want in your smoothie so the won’t appear in your homepage.

Similar app research:

FitMenCook app

It’s a healthy recipe app for people. The aims of the person creating this app were:
A) Food should be easy to prepare and affordable
B) Food should be vibrant and tasty, never boring
C) Preparing food in advance is important
D) Following a, b, c helps you achieve your fitness goals

My app is similar to this one because the smoothies would be creative, never boring, affordable and would help you to achieve your health and fitness goals.

Screenshots of ‘FitMenCook’ app:
Screen Shot 2017-10-09 at 14.02.25

At the bottom there are categories of recipes, shopping and etc. We can see that you can browse recipes by the ‘tags’ (for example vegetarian, low carbs, etc.) which is similar to my idea of ‘filtering between smoothies’. There’s a ‘favourite’ category in which you can save your recipes that you like the most. In shopping category you can add reminders and lists of what you need to buy for your recipes. In ‘community’ part you can share your recipes with others, and it’s what I want to do in my smoothie app. However, in my app you will also be able to like and comment them. Most liked and commented smoothies will appear on the homepage for everyone.

The colours used for this app:

Screen Shot 2017-10-09 at 13.58.42

The colours look earthy and natural. Perhaps it’s because the recipes meant to be healthy, natural and organic. That’s why they chose the colours matching with the content.

The app audience seems to be for grown up people who care about fitness and pay attention to what they eat everyday.

 

 

TASK 1 : Game research

Sonic Rush

Sonic_Rush_Coverart.png

Sonic Rush is a side scroller/platform type game released in 2005. This used to be my favourite game as a child.

Gameplay
The player controls either Sonic the Hedgehog or Blaze the Cat, who differ in terms of special abilities. Gameplay consists of moving quickly through levels, collecting rings and defeating enemies by jumping on them. The player collects rings as a form of health. When they are attacked by an enemy, their rings bounce in all directions. If they are hit by an enemy and have no rings, they lose a life. Levels in the game are divided into “zones”, each consisting of two acts of normal gameplay then a 3D boss battle.  During boss battles, Blaze fights Doctor Eggman. The game features a special stages can access via certain handles in order to obtain the Chaos Emeralds. The emeralds can turn thoughts into power and can be used as a weapon. . When the player completes both Sonic and Blaze’s stories and collect all the Chaos Emeralds, they can access a final story.

 

46248-Sonic_Rush_(U)(Legacy)-1.pngAxeltornado.png

 

The background and platform art is in pixels and it gives the retro look. The HUD is usually at the top, and it shows how many coins you’ve collected and the timer. The atmosphere of the game is fun and playful.

In the first picture the action is happening in the fields of nature. At the back we can see a seashore, tops of the trees and bright blue sky with thin clouds. Personally, this whole scenery reminds me of childhood and the days I used to go out and be outside in the forests, not having anything to worry about. The bright and vibrant colours give an innocent and playful look, which perhaps, that’s what developers were aiming for, since the audience is young people and children.

Story
Blaze the Cat is somehow pulled from her native dimension into Sonic’s world. Her world had seven Sol Emerald – similar to the Chaos Emerald – but they were stolen by Doctor Eggman. She then makes it her goal to retrieve them. This is where Sonic meets her. While she is searching for the Sol Emeralds, Sonic is searching for the Chaos Emeralds, which have been stolen by Doctor Eggman Nega, Eggman’s alternate counterpart from Blaze’s dimension. They later meet Cream the Rabbit. After Eggman kidnaps Cream, Blaze goes after him while Sonic takes on Nega. Sonic collects the last of the seven Chaos Emeralds and meets Blaze, who fails to protect the Sol Emeralds. Sonic and his friends help Blaze realize the meaning of friendship and she turns into Burning Blaze. They fight Eggman and Eggman Nega and defeat them. The two worlds are restored, forcing Blaze to return to her own world.

 

 

Rayman

51zhqtGxnSL._SX466_.jpg

Rayman is a side-scrolling platform video game published in 1996.

Gameplay
The player character is the titular Rayman, who must travel through six worlds to free all of the caged Electoons, six cages of whom are located somewhere on each level. Rayman has the ability to walk, crawl and make silly faces. Each level is divided into several maps, each of which is completed when Rayman reaches the “!” sign at the end. The player is given a certain number of lives, which are lost when Rayman takes too many hits or falls into water or a pit. Scattered around each level are small blue spheres called Tings. If the player controlling Rayman picks up 100, he gains an extra life and the counter resets to 0. When the player loses a life, he loses any Tings he has collected. Tings can also be used to pay the Magician, a character found in certain levels, to enter a bonus stage, where Rayman can win an extra life. The player also comes across a variety of other power-ups and bonuses. At the end of each world, Rayman must defeat a boss enemy.

unnamed.jpg

The background is pixelated and the story is happening in a forest. The trees, plants and flying insects create an adventurous and mysterious mood. Unusual shapes of plants and assets makes the gameplay more interesting to play because you don’t know what to expect. Also you get lost in a different fantasy reality which helps you to escape the everyday life.

Story
The Great Protoon maintains peace and balance throughout a valley that is Rayman’s world. One day, the evil Mr. Dark steals the Great Protoon, leaving the Electoons, small beings who gravitate around it, vulnerable to Mr. Dark’s forces, who have captured the Electoons in cages. Rayman must free the Electoons and recover the Great Protoon to restore the valley’s balance. Betilla the Fairy, a guardian of the Great Protoon, frequently interacts with Rayman as needed to give him additional magical powers along his journey.

 

Rayman character design
The Rayman game hasn’t stopped developing throughout years. Now there are different types of games with this character, even in 3D. I’m writing about this character design because I think it’s quite interesting.

rayman___edited_render_by_rayman2000-dag4ji5.png

We can see that the character has no legs or arms, but that doesn’t make the character look any worse. The main parts of the boy are head, torso, and feet with palms. I think it’s a really simple design and it’s easier to animate it. What you need to have are only different images of face expressions, hand, hoodie and hair movement.

8b97bcebce6333d3f277db9f6f7fd5eb--fanart-pokemon-rayman-origins.jpg

Final Fight

Final_Fight_(flyer).jpg

Final fight is a side-scrolling beat-’em-up video game originally released as an arcade game in 1989.

Gameplay
Final Fight can be played by up to two players. Before the game begins, the player chooses between the three main characters: Haggar, Cody, and Guy. Each has his own fighting style and attributes. Health gauges are displayed for both player and enemy characters. The controls for Final Fight consist of an eight-way joystick and two buttons for attacking and jumping. By pressing certain buttons on joystick you can perform different combos. The player can also perform jump attacks. Pressing the attack and jump button allows the player to perform a special attack that strikes all surrounding enemies, but will drain a small portion of the player’s health. Final Fight consists of six stages or rounds and two bonus rounds. At the end of each round the player will face a boss character.

1181242106117.png

The style of the game looks really old school and the colour palette looks very vibrant giving a fun and uplifting mood. By the skyscrapers at the back, brick walls and old rusty buildings at the front we can tell that the action is happening in the city streets. As we know a lot of fights could usually happen in narrow, abandoned city streets, which is why the choice of this place puts you in a fighting mood. The atmosphere of the game is exciting, making your adrenaline rush stronger.

All HUD is at the top of the game screen. It shows the timer, health bars, names and the scores. By putting the HUD in this place it helps you to concentrate more on the game.

Story
The game is happening in Metro City in United States. The city’s crime rate reached alarming levels. Since the election of pro wrestler turned politician Mike Haggar as the new Mayor, Metro City was changed and cleaned up drastically. However, the Mad Gear gang would not go down so easily. Under the leadership of the businessman Belger, the group attempted to bribe Haggar with a large payoff to keep him from going after them, which Haggar refused. The Mad Gear responded by abducting his daughter Jessica. When Haggar found out about his daughter’s abduction, he decides to take his fight against Mad Gear. Seeking additional manpower, Haggar recruits Cody, an expert fighter and Jessica’s boyfriend, as well as Guy, a ninja in training and Cody’s good friend. Together they fight against Mad Gear to rescue Jessica and eradicate the gang.

 

Super Mario World

Super_Mario_World_Coverart.png

Super Mario World is a 1990 platform video game developed and published by Nintendo.

Gameplay
Super Mario World is a platform game in which the player controls Mario or Luigi from a side view. The character moves by running, jumping or flying. The game has 96 levels. The majority of the game takes place in these levels with obstacles and enemies, by running, jumping, dodging or defeating enemies. The player is given a certain amount of lives, which are lost when Mario is attacked by an enemy, falls into a pit or lava, or runs out of time. Each world features a final stage with a boss to defeat. There are also a lot of power ups like “Super Mushroom” and “Fire Flower”. There is also a Joshi dinosaur which Mario is riding. The dinosaur can eat the enemies. 

SuperMarioWorld_CED.jpg

The whole game is in a minimalistic pixel art and there aren’t too many details in the background. The background is the sky with a few clouds and the whole gameplay is happening on the platforms with the grass on the top. The game is more focusing on the interactive assets which can affect your game (such as boxes, enemies and etc.) Also, with a more simple background your whole attention draws to what’s happening at the front and makes you focus more. Main colours of the game are bright which brings a positive and a fun feeling to the game.

Story
Mario and Luigi agree to take a vacation to a place called Dinosaur Land, where there are many types of dinosaurs. When Princess Toadstool disappears Mario and Luigi are trying to find her and encounter a Yoshi dinosaur. He says that his friends were kidnapped too. Mario, Luigi, and Yoshi set out to save Princess Toadstool and Yoshi’s dinosaur friends, exploring Dinosaur Land for Bowser and his Koopalings. Mario and Luigi continue to follow Bowser, defeating the Koopalings in the process, and save all of Yoshi’s dinosaur friends. They eventually make it to Bowser’s castle, where they fight him in a final battle.

 

Here we can see a Mario sprite sheet with all the movements:

SNES - Super Mario World - Mario.png

Pac-Man

Arcade-Game-Series-Pac-Man-Xbox-One-title-screen-main.jpg

Pac Man is an arcade game developed by Namco and first released in Japan in May 1980.

The game is happening in a labyrinth. Black and neon colours are mainly used in this game. It creates a retro feeling. Personally these colours remind me of arcade machines, city lights and night and it creates an exciting and fun atmosphere.

Gameplay
The player controls Pac-Man through a maze of various dots, known as Pac-Dots, as well as four multi-colored ghosts: Blinky, Pinky, Inky, and Clyde. The goal of the game is to consume all the Pac-Dots in a stage in order to proceed to the next one. The four ghosts roam the maze, trying to kill Pac-Man. If any of the ghosts touch Pac-Man, he loses a life; when all lives have been lost, the game ends. Near the corners of the maze are four larger, flashing dots known as Power Pellets that provide Pac-Man with the temporary ability to eat the ghosts and earn bonus points. The enemies turn deep blue, reverse direction and usually move more slowly. When an enemy is eaten, its eyes remain and return to the center box where it is regenerated in its normal color. Pac-Man was designed to have no ending – as long as at least one life was left, the game should be able to go on indefinitely.

Obviously, this game can put a lot of adrenaline and can make your heart beat faster.