UPDATED – 2D Side scroller evaluation

Final Game/Assets:

Character Sprite Sheet

Character Sprite Sheet Final

Idea generation and design process

In my research, I looked at different types sidescrolling games for inspiration. I have always been interested in sci-fi and when I realised that there aren’t that many space-based platformers, I decided that I would create one.

To help the development of the visual style for my game, I created different boards on Pinterest for the level, character/entity and prop designs. I settled on having the background in grayscale and the entities in vibrant colours so that they would stand out and be easily recognisable.

Links to Pinterest boards:

https://pin.it/ilimjqubt5wpb2
https://pin.it/hmpuslggasl2me
https://pin.it/okpdiffbzdh6st

What was good and what needs improvement?

Final aim/How much further would I have taken it

Compared to my original idea, the final version of the game I created differed quite a bit.

The final aim of the game would have been to progress through the station to fix a faulty AI that was damaged in a meteor storm and now wants to kill all people on the station. The player would’ve had to solve puzzles and defeat the station drones to open airlock doors to progress to the next pod, picking up tools and weapons along the way to help them. The final part of the game would have been a ‘boss battle’ between the player and the station AI, with the player trying to reset it and the AI trying to kill the player. The player would also have been helped by a narrator/text boxes that would convey the storyline and direct the player where to go and how to complete the game.

I also wanted to make the players perspective invert when they were on the other side of the station to make it seem like the gravity was constantly changing and help sell the idea that the game is in space with no clear ‘Up’ and ‘Down’.

What I think worked

I think the game concept I came up with was different and fills a gap in the 2d scroller market.

I like the final design of the station, it is quite minimalist and, due to its lack of colour, makes the interactable elements such as the player and other entities stand out. I also like the way the character walks and how the space background stays stationary behind the level, giving the game a false sense of perspective.

What didn’t

The way the player interacts and uses the ladder was quite difficult to implement and I was never happy with it, which caused the last version to not work altogether. The jumping mechanic could have also been improved as the code was designed for normal gravity rather than space and so didn’t quite feel right when moving around.

Time management

I think I could have managed my time better, as I spent a long time in the planning stages and didn’t have much time/ resources to make the actual game.

If I had more time on this project, I would implement the rest of the features into the game, such as the enemies, items, an inventory system and interactable doors that open and close. I would also improve the ladder system work better as it is fairly buggy at the moment. Hopefully, in my free time, I will be able to make a fully completed version of this game as I have enjoyed designing and making it.

Advertisements

UPDATED – 2D Space Platformer Digital Development

Digital Asset Development


Initial Character Walk Cycle

AstronaughtDesign

From my sketches, I then digitized the astronaut character in Adobe Illustrator, with a front and side view.

Designing and creating the walk cycle

Test01Test02

I then created a series of still frames of a running cycle, however, I found that I had not designed the joints to interact very well with each other so there was a lot of glitching around the knees and elbows.


Character redesign to make joints easier

CharacterRiggedDesign

After the previous test, I decided to remodel the character, using circles for joints so that the glitching wouldn’t be an issue.

Character Redesign and Test 3

Test03Test05

Then, I reanimated the new character design, using a walk cycle rather than a running one as this would be more realistic in a space environment.

 


Entity design

PodDesign_PodPassiveFrontPodDesign_PodAggroFront

PodDesign_PodPassiveSidePodDesign_PodAggroSide

From my sketches, I realised that animating the legs of the Drones would have been way too complicated, so when I digitalized them I removed the legs so that they would hover. I also concluded that this would be more appropriate for a futuristic space game.


Initial Game Development

Version 0.1

-Entity Development

Extract Sprites

Create FlipbookFirst, I imported the sprite sheets for the idle and walk animations, then I extracted each sprite frame and created a flipbook. I then modified the astronaut blueprint class so that when the entity was moving it would play the walking animation and when it was not it would play the idle one.

Capture

Ca12pture2

-Level Development

Tilemap Final

Tilemap Collision Boc

To create the game level its self, I used a tile map. This allowed me to create a template of ’tiles’ that I could repeat to form the different compartments of the station. each tile also was given its own custom collision box – so that the entities won’t just fall straight through everything.

Tilemap

Version 0.1.1

Airlock Tile SetAirlock ClosedMost of the updates in this version were map based. I added a placeholder airlock tile with a collision mesh for the closed ones so that entities wouldn’t be able to pass through a closed airlock. I also completed more of the map to the plan I created in illustrator.

Map

Version 0.1.2

Ladder HitboxIn this version, I implemented a rudimentary ladder system to allow the player to move up and down in the station.

Ladder Nodesthe system works by sensing if the player is in the hitbox of the ladder and pressing the ‘e’ key. if they are, it sets the characters state to floating.

Ladder

Version 0.1.3

Unfortunately, in an effort to try and improve the ladder system, I managed to break it all together so the final version I have made is mostly broken.

2D Game Design Idea

 

Mood Boards


Set Design Initial Idea Board


Character Design Moodboard


Prop Design Moodboard


Game Outline

The game is set in the future on a space station. The station has been destroyed/damaged by an asteroid shower and the main computer (AI) has gone rogue and started destroying the station / killing the astronauts on board. The goal of the game is to fix and restore the station/defeat the rogue AI.

The goal of the game is to fix and restore the station/defeat the rogue AI.

The player must work their way through the station, checking each compartment for damage and fixing them if possible.If the pod is damaged beyond repair, the connecting airlocks will no open and there will be a visual cue on them that there is something wrong with the pod. Some compartments will be locked and require access keys to open. these can be found in different pods and/or by defeating ‘station drones’.

As the player is working through the station, the AI will try to stop them from getting to the data core by placing Station Drones in their way. If the player Defeats/Stuns a Drone or walks into the view of a camera, the AI will know where the player is and try to stop/kill them by shutting down pods/ systems (i.e life support) or activating the Drone’s defence system.


Set Design / Station Layout

The station is built up of ‘Pods’ around a central beam. The whole station is rotating around that to create gravity. Depending on which side of the station the player is on, the gravity changes – rotating both the character and the camera angle.

Around the station, there will be cameras. This, along with the Station Drones, is what the AI will use see where the player is.

Characters

Main Character

astronaut – in a space suit, cant see face.

Station Drones

Station repair/defence droids controlled by the main AI that has two different modes: Passive and Aggressive.

In passive mode, the drone will go around the station doing minor damage repair. However, in aggressive (or defence) mode, the drone opens to reveal two weapons and will attack the player (or anything that moves).

Final ‘Boss’

The main Boss is the Rouge Station ‘AI’ that has been damaged by the meteor shower and has killed the rest of the crew on the station. As the player makes their way through the station, the AI will try repeatedly to kill them.


Tools, Items and Currency

These will be lying around in different pods as the player progresses through the map. There are two different types of items: Weapons and Tools.


Tools

Crow-Bar like device

Found near the beginning of the game, this is the lower tier tool, used to open airlock doors without power.

Repair Device

Found nearer the end of the game, this device is capable of fixing and repairing broken station parts and/or faulty systems.


Weapons

Melee Weapon 

Found near the beginning of the game, this weapon is made out of repurposed station parts to form a basic self-defence weapon capable of defeating (just) Station Drones. However, will alert AI to presence when doing so.

Stun-Gun

An endgame weapon, ranged and powerful, can stun Station Drones (permanently) and Station Cameras (for a limited time). Does not alert the AI to the player’s presence but has a limited power and needs energy packs to recharge.


Specific gameplay mechanics

  • Station has changing / no gravity so scroller gameplay can change direction from horizontal to vertical (camera rotates with the character)
  • The player cannot see the state of adjacent ‘pods’ until they have opened the airlock to them.

Art Concept Design

Space helmet Design Moodboard

 Tool/Weapon Design Moodboards

 

Platform Game Research

Platform Games

Platform games often have short levels, which rapidly increase in difficulty with simple and intuitive controls. Game players are essentially renting the game for as long as the game avatar is alive.

Platform games are often very colourful as they are meant to attract a mainly child audience and it makes the game more appealing.

Super Mario Run

Super Mario Run is a side-scrolling, auto-running platformer. The player controls Mario by tapping the touchscreen so Mario jump over larger obstacles; the longer the screen is touched, the higher Mario jumps. Like other side-scrolling games, Mario must avoid obstacles such as; enemies (goombas) and gaps that wish to block his path. Apart from completing the levels as quickly as possible, you have to collect coins. There are normal coins and special coins for each level. First, there are 5 pink coins once they have been collected 5 purples coins are unlocked, and after the purple coins have been collected 5 black coins are unlocked. This gives each level of at least playthroughs.

smr-5-1200x675

Crossy road

 The objective of Crossy Road is to get as far as possible without being killed. The player plays as a chosen character and must tap to go forward or swipe the screen in the appropriate direction to move the character forward, backwards, left or right. The game consists of an endless series of obstacles in a set path, such as rivers, cars, and trains. The player must time movements correctly in order to pass these obstacles without dying.

For example, in the instance of a river, the player must cross the river using floating logs, without landing in the water. If the player takes too much time crossing an obstacle or goes idle, an eagle will snatch the character, resulting in the game’s end. Every forward movement will earn one point, with every fifty points sounded out by an effect.

Furthermore, there are coins scattered across the environment that can be used to make new characters playable.

2706568-crossy-road-11

Jetpack Joyride

The game uses a simple, one-touch system to control the jetpack; when the player presses anywhere on the touchscreen, the jetpack fires and Barry rises. When the player lets go, the jetpack turns off, and Barry falls. Because he is continually in motion, the player does not control his speed, simply his movement along the vertical axis.

The objective of the game is to travel as far as possible, collect coins, and avoid hazards such as zappers, missiles and high-intensity laser beams. Contact with any of such obstacles would result in instant death, although Barry’s body will tumble and slide for an additional distance upon dying.

You can also ensure you make it further with the various upgrades that start from a mech all the way up to a water board or massive dragon. The collection of coins allows you to upgrade these machines or enhance your character aesthetics and jetpack as there are over 50+ different jetpacks and items of clothing to buy at various prices. In addition, you can buy upgrades using real money.

4

Animation Project – Research (Task 1)

Meaning of hope

Screen Shot 2017-03-14 at 11.24.54.png

Research what Hope can mean

“the miserable have no other medicine. But only hope” – William Shakespeare

Hope is an abstract concept that a bad situation or seemingly impossible task can be improved and or solved. Hope can and has been used as a tool/weapon by leaders to manipulate and control others.


Animation History Timeline

Thaumatrope – 1824

‘The Thaumatrope is a Victorian toy constructed from a simple disk or card featuring a different picture on each side and attached to two pieces of string. When the strings are twirled rapidly the card rotates on its axis and the two images appear to combine.’

http://www.mhs.ox.ac.uk/exhibits/fancy-names-and-fun-toys/thaumatropes/

Phenakistoscope – 1831

‘The optical toy, the phenakistoscope, was an early animation device that used the persistence of vision principle to create an illusion of motion. It was invented by Joseph Plateau in 1841.The phenakistoscope used a spinning disc attached vertically to a handle. Arrayed around the disc’s centre were a series of drawings showing phases of the animation, and cut through it were a series of equally spaced radial slits. The user would spin the disc and look through the moving slits at the disc’s reflection in a mirror. The scanning of the slits across the reflected images kept them from simply blurring together so that the user would see a rapid succession of images that appeared to be a single moving picture. A variant of it had two discs, one with slits and one with pictures; this was slightly more unwieldy but needed no mirror. Unlike the zoetrope and its successors, the phenakistoscope could only practically be used by one person at a time.’

https://www.juxtapoz.com/news/illustration/short-history-of-the-phenakistoscope/

Flip-book – 1868

‘The flip book looks like a small notebook – originally stapled, mostly bound today- that you hold in one hand while you flip through the pages with the thumb of the other hand, either from front to back or from back to front. Pictures or drawings give the illusion of motion, slower or faster depending on the speed.’

http://www.flipbook.info/history.php

Praxinoscope – 1877

‘The Praxinoscope is a typical optical toy from the 19th century. It consists of a
cylinder and a strip of paper showing twelve frames for animation. As the cylinder
rotates, stationary mirrors in the centre reveal a ‘single image’ in motion.
The Praxinoscope was invented in 1876 by Charles-Émile Reynaud (1844-1918).’

First animation with sound – 1928

The first method for recording sound onto film consisted of a varying white stripe along the edges of the film strip. A lamp would shine through from one side onto a light-sensitive detector that would translate the light into sound.

Snow White: first drawn animated feature film – 1937

‘Snow White and the Seven Dwarfs was the first full-length animated feature in colour and with sound. The risk-taking film made use of the multi-plane camera to create an illusion of depth. It introduced human characters modelled on live actors and used larger painted cels and drawing boards than previous films. It took almost four years and an astronomical (at the time) $1.7 million to create. Its single nomination was for Best Score. The film was “recognised as a significant screen innovation which has charmed millions and pioneered a great new entertainment field for the motion picture cartoon.”

http://www.filmsite.org/snow.html


Animation Technique

Cel Animation

Cel animation is the process of creating different transparent layers on cellulose sheets on top of each other. Each layer is then either painted or drawn on by hand. This means that each frame doesn’t have to be entirely animated and the animation can be smoother.

Pros

  • produces a higher quality animation than other classic 2d animation techniques

Cons

  • Incredibly time-consuming – Have to draw each individual frame

img2


Animation Examples

Animal Farm (1954)

How was it made

The original film was probably made using a similar process to Disney’s Snow White (released 1937) using a camera and multiple hand-drawn and painted cells. The CIA played a large part in funding the film as at the time it was anti-communist propaganda, and had a hand in changing the ending of the film to a less pro-revolutionist version.

Story

the animation is about a group of animals on a farm that decides to overthrow their (drunk and bad-tempered) owner. They then create seven commandments stating that all animals are equal. As the animation progresses the pigs start taking more and more power for themselves, editing the commandments as they wish until the pigs run the farm. “all animals are equal, but some are more equal than others”. The animated film is an adaption of George Orwell’s book ‘Animal Farm’ which was written as a political statement about the soviet union and communism.

Characters

  • Old-Major – The old boar that inspires a revolution in the animals, before dying and leaving Napoleon and Snowball to fight over power.
  • Napoleon – The pig that becomes the final leader of Animal Farm, through force and manipulation.
  • Squealer – The pig that spreads lies and false statistics about Napoleon and Animal Farm’s success.
  • Snowball – Napoleon’s opposition, is less manipulating and devious than Napoleon, other animals preferred him as leader before Napoleon took over by force, exiling Snowball.
  • Boxer – The workhorse who goes along with everything blindly, until he overworks himself and dies

Style

This slideshow requires JavaScript.

The art style is similar to many animated films of its era, made using many of the same techniques. The colours used vary throughout where peaceful and relaxed moments use light colours like greens, blues and yellows. Whereas, moments of tension or conflict use much darker colours like reds and blacks.

 

The Snowman (1982)

How was it made

Based on the picture book by Raymond Briggs, The Snowman was created for Channel 4 and was first broadcast on 26th December 1982. The score was made by Howard Blake which is entirely wordless except for the song “Walking in the air”. It was made with traditional animating techniques, using pencils and crayons to achieve a rough, non-polished effect, which contrasts with Disney’s style of polished, flat-colour animation.

Story

The animated short is about a boy that builds a snowman on Christmas Eve that comes to life. They then go on a motorcycle ride around the countryside, disturbing the local wildlife. However, the motorcycle starts to melt the snowman so the boy puts him in the fridge to cool him down. Then they fly around, past the boy’s village and to the north pole where he takes the boy to meet Santa, who gives the boy as a scarf. At the end, the boy wakes up the next morning to find that the snowman has melted and wonders if it was a dream, however, he finds the scarf that Santa gave him.

Characters

  • The Snowman
  • Boy (James)

Style

This slideshow requires JavaScript.

The animation was made using crayons and pencils to create a textured effect to the final animation.


Wall-E Research

When I read the theme for the animation competition ‘A Sense of Hope’ what immediately came into my mind was the film ‘Wall-E’, which was released in 2008. To me, the plot implemented the human core idea about hope life and the human existence. I was deeply influenced by this film, so I decided to make my animation based on this.

‘Wall-E is set in a distance future when humans left the Earth on a giant spaceship. A robot named Wall-E and his cockroach Hal. This all changes when Wall-E meets Eve, another generation robot and fall in Love with her. The two robots are heading into space on a mission that could bring humans back to Earth. This film is Pixar’s ninth animated production. Luxo Jr and a pair of binoculars influenced the design of the main character. The emotions as happiness and sadness were demonstrated by moving the eyes up and down without the need to have other facial features as nose or mouth.

One of the key elements of the design was that the main character should be accepted as a machine first and then the focus should be put on his personality and human characteristics. The idea for the plot started from a single question: “What if mankind evacuated Earth and forgot to turn off the last remaining robot?” The film director loved the space movie genre and chose to convey the idea by giving life to inanimate objects. The film has no spoken dialogue in the first 30 min and the creative team relied only on the emotions and ‘body language’ to draw the audience attention to the plot. It was a risky approach but the team has solved the issue brilliantly using foley effects and sound to lead and compliment the plot. For the first time, Pixar used in this film life-action footage to give the CGI characters appearance that they have inherited from their ancestors, who left the Earth. The second character Eve, the next generation robot has a sleek high-tech design.

walle.jpg


Sources

Name (Year of publication) Webpage title | Website title. Available at: URL (Accessed: Date)

(2017) How is sound recorded on motion picture film? |HowStuffWorks. Available at: http://entertainment.howstuffworks.com/question413.htm (Accessed Feb 2017)

Michael Brooke (2014) BFI Screenonline: Animal Farm (1954)| BFI Screenonline. Available at: http://www.screenonline.org.uk/film/id/574478/index.html (Accessed Feb 2017)

History of animation | Available at: http://history-of-animation.webflow.io/ (Accessed: Feb 2017)

Jez Stewart (2014) Animal Farm: Behind the scenes on Britan’s first animated feature film. BFI | BFI. Available at: http://www.bfi.org.uk/news-opinion/news-bfi/features/animal-farm-behind-scenes-britain-s-first-animated-feature-film (Accessed Feb 2017)

SparkNotes (2017) SparkNotes: Animal Farm: Characters List | SparkNotes. Available at: http://www.sparknotes.com/lit/animalfarm/characters.html (Accessed Feb 2017)

Victor Opeyokun (2017) BFI Screenonline: Snowman, The (1982) | BFI Screenonline. Available at: http://www.screenonline.org.uk/film/id/530124 (Accessed Feb 2017)