2dplatformerrp

[2dplatformerrp]

Tile Maps

Using a tile map template, we designed our own levels using the tiles. The reason it's better to use tiles, is because it's great for optimization as each tiles load in chunks which for example, Minecraft uses this. You're able to use the same tile multiple times, and stack them together, which is great for saving memory, and also constrains these tiles to a grid.

[2dplatformerrp]

Walk Cycle & The Process

Above, is the finished product of the character's walk cycle, which took a while, as there was a previous (janky) iteration of what it is now.

In photoshop, I created a file the size of my sprite (32x32). Then, I went to Window>Timeline to bring up the animation timeline. I then made sure it opened a "Frame Animation" Timeline.

Frames for the originally intended walk cycle, which as you can see made my character look as he has a broken leg, and overall just very janky.

The problem with my original, was that I wasn't using any reference as I thought I didn't need to use any, but was very wrong which resulted in my original walk cycle looking abnormal. I also didn't want use reference images originally as we only have one monitor as our disposal for each user in this room, but, the monitors are 2K (2560x1440), meaning we have far more real estate than using regular 1080P monitors.

My biggest gripe with Photoshop animation, is that it uses the same layers no matter what frame, so you have to hide each individual layer for every frame you don't want it in. When you create a new layer on any selected frame, it'll automatically appear on every single one. I'm surprised the animation tools aren't as good as Adobe Animate's (Or Adobe Flash which is the name I'm still used to calling it) animation tools, but you have to remember that this is photo-graphic editing software afterall.

[2dplatformerrp]

Gem Animation

[2dplatformerrp]

Importing sprites into Unreal pt. 2

This replaces the original sphere pick up I made

[2dplatformerrp]

Importing sprites into Unreal

Paper2D makes the background transparent, as despite exporting the sheet with a transparent background, it automatically makes the background white.

I then extracted the sprites to create individual sprites for each asset I created.

[2dplatformerrp]

Sprite Sheet

As my sprites for pick-ups are 16x16, and characters are 32x32, I had to create a 96x96 grid for multiple sprites. We had to create a grid in order to align each sprite with each 32x32 panel of the file.

[2dplatformerrp]

Pixel Art Pick-Up designs As my colour palette is limited, so are all the possible items I can make without them being incomprehensible. All of these items, I intend on using in the game, such as the plaster and pill bottle as healing items, and obviously both will restore a certain amount of health.

Plaster: Before & After refinement

I decided to refine the plaster, as the original design didn't have the best proportions it could have, and proportions matter in pixel art, as the resolution size is tiny and will make said design look distorted.

[2dplatformerrp]

Potential colour palette I will use for my project

[2dplatformerrp]

Video Game Pick-Ups Pick-Ups in Video Games are items that are most commonly either some form of point, or a powerup to assist the player.

Aku Aku - Crash Bandicoot The Aku Aku mask from Crash Bandicoot is an item that grants the player an extra life. You are able to collect multiple of these, with them changing colour with the more you have. When you have 3, Crash wears the mask and is essentially invincible. At a glance when you see this item from smashing a box, you definitely would not think it is a health item, especially if you have played later installments of the game where Aku Aku appears in cutscenes as a main character with dialogue

Blue Shell - Mario Kart The Blue Shell is a power up that automatically traverses to the player in 1st place, spins around said player and explodes on impact, allowing for players in other positions to take 1st place. Assuming you've already used the other shells, you can immediately tell from it's design it's going to be used as an item to harm the other players, but probably wouldn't expect it to be as brutal as it is.

Gravity Gun - Half-Life 2 The Gravity Gun is a multi-use weapon that is given to you by Alyx when at Black Mesa East. This tool is used to pick up and throw objects, which later in the game becomes the Zero Point Energy Field Manipulator, which allows Gordon to pick up larger objects. Judging by the design, players definitely wouldn't of guessed that the Gravity Gun wouldn't be used to pick up and throw objects unless stated beforehand.

Grappling Hook - Little Big Planet 2 The Grappling Hook is a power up that is used to grapple on soft surfaces, like the sponge material. It was Introduced in the second installment of the main Little Big Planet franchise. Taking a look at the design, it's very clear compared to the other Pick-Ups on the list what it is used for.

Pliers - Inscryption Possibly the most gruesome item on this list, are the Pliers from Inscryption. They are used to pry out your own teeth to put on the scale when you are running low on teeth, as teeth are health in this game. You definitely would not expect the Pliers to be used to pull out your own teeth, but maybe for other potential use cases, which might be just as gritty...

[2dplatformerrp]

In order to resolve the issue of data such as health and score not transferring over to the next level, we had to go back into the view graph to add casts over existing code to patch the issues

[2dplatformerrp]

Continuing to create my level and applying newly learnt skills/objects

[2dplatformerrp]

Score System Finale/Health System

Going into the pickup view graph, we added a variable in order to change the score of individual pickups

Now, we have made a health integer.

Once I made that, I then went into the player View Graph, to then add another print string, and another integer, this time being the HP integer.

[2dplatformerrp]

Recapping Actors

Last week, we created Jump-Pads. Now, we're recapping the process, only this time we're going to make "PickUps".

Once I created the actor, I had to double click it in the content drawer, then add a sphere into viewport. Once I done that, I had to make sure (In the details tab) I set "Collision Preset" to "NoCollision". After, I added a "Sphere Collision".

We then had to code, by going to "Event Graph". I then had to add "On Component Begin Overlap" for the collision. Afterwards, I added a "Cast" component, and print string, which would display text when I come in contact with the sphere.

[2dplatformerrp]

Score System Pt.2

In order to make the score system number to increase, we had to add "Cast To BP_ThirdPersonCharacter". Then, I added a GET and SET Score component, alongside an "Add" operator, to increase the score, every time I interacted with the sphere.

We added a "Destroy Actor" component in order to make the sphere disappear.

[2dplatformerrp]

Variables/Score System Pt.1

A Variable is a value that can be changed, commonly used for health, ammo, score, etc.

Using variables, we made a score system. First of all, we went to the ThirdPersonCharacter details, then went to the "Event Graph". Next, I then went to details, variable, then changed the variable type to an integer.

I then done something similar in the blueprint tab, only this time I added the name "Score" to the variable.

I then added an "Event Tick" component, and a print string, to stream an infinite amount of "Hello" as a temporary solution to display score A tick is an event that is happening with every single frame, and is used in order for events to not match your framerate, so they don't speed up.

I then resolved the issue by dragging the "Score" integer to the View Graph, and selected "Get Score". Afterwards, the game then started displaying 0 instead of "Hello"

[2dplatformerrp]

Pixel Art Sequence

64x64 We were tasked with opening Photoshop to create pixel art of any character, in any perspective. On the spot, I came up with an idea to draw a head similar to the DOOM guy's from the DOOM (1993) HUD.

32x32 After that, we then had to translate that 64x64, into a 32x32 sprite. Even at 32x32, it was starting to get a little difficult, but it's also a fault of mine for not making use of all the space available. Regardless, you could still decipher that it's a face.

16x16 At 16x16, I couldn't even make a nose or a mustache. The head also just looked like some sort of spoiled lemon at this stage.

8x8 At this point, it now looks like a lego piece, with a cyclops eye... and a face.

4x4 I could no longer even have a face, but, I at least could have hair, skin and a head remain.

2x2 At last, 2x2. Now, the pixel art resembled the head of a Minecraft skin, if it were lower resolution. It also looked like a colour palette, and the point of this exercise was to push our creativity, but also display how many colours our characters have. Now, my character when enlarged has a larger colour palette, but I couldn't fit in all the colours in the 2x2 without it not looking like a low resolution face.

[2dplatformerrp]

Side-scrollers, and what are they?

A side-scroller is a genre of video game where the camera is at a side-view angle that follows the player whether it goes left or right. Typically, the graphics are pixelated as side-scrollers were conceived during the 70s-80s when hardware was limited, and CRT TV displays were 320x240 (240p), so visually you were very limited with what you could display. Even in modern day, games still have a pixel art-style as it's reminiscent of that time period in video games.

What are the rules of a side-scroller? I believe your average side-scroller game contains at least some form of health/lives system. In Sonic The Hedgehog for example: Rings are a form of health. It doesn't matter how many rings you have, as long as you can have one, you will just lose a rings and not die. However, if you get hit without any coins, you will die. Another aspect associated with side-scroller games, is visual story telling. In the 80s-90s, video games had a lack of dialogue which either was a design choice or due to hardware limitations, as in Mario Bros for example: There is some dialogue from Princess Peach when you defeat Bowser and rescue her, or Toad tells you she's in another castle... Other than that dialogue you're given, you're left by yourself to decipher what is going on And finally, I believe each side-scroller should be required to possess unique abilities & power-ups. In Celeste, you are able to climb and dash in the game. The entire game revolves around these two abilities, as it is a precision platformer game.

Celeste (2018): Celeste is a story-rich platformer game About Madeline, who is on a journey to the top of Celeste mountain. When I played this game on my computer back home, I noticed that the controls differed from other games. Instead of the usual WASD movement and spacebar to jump, the key bindings by default is C to jump/accept, and the arrow keys to move. However, that's not all there is to the movement. You have the ability to climb platforms, and dash if one is far away, or you're trying to avoid spikes (Z to climb, and C to dash). Personally, I found the default bindings to be confusing as all the functionality keys were right next to each other, so it's easy to mis-click a key by accident. Regardless, I still think these abilities spice up the game, as it allows for the level designs to become more complex and require precise movement. The levels progressively get more and more difficult the further you proceed, with obstacles such as falling platforms, spikes, moving platforms, and large gaps which require you to dash in order to reach the other side. In some levels, there are power ups that allow you to dash again once you've already dashed and climbed onto a platform, as if you have dashed and climbed onto a platform, you can't dash again unless you stop climbing and fall back to the ground. With the green crystals however, you are able to replenish your dash ability. Celeste's art style is spectacular, and in comparison to Mario and Sonic, it obviously stands out due to the differences in time periods each game came out in, with Celeste releasing in 2018, whilst the others released in the 80s and 90s, meaning the visuals were limited by hardware. Not only is there pixel art, but it also features digital art for the character images in the dialogue, and even a 3D model of the Celeste mountain when in the menu and level select.

Super Mario Bros. (1985): Super Mario Bros is a platformer game, which is a successor to 1983's Mario Bros. You play as Mario (or Luigi if you're player 2) to travel to the mushroom kingdom in order to rescue Princess Peach (referred to as Princess Toadstool in this game) from Bowser (referred to as King Koopa in this game). Movement in this game isn't nothing too special, but you have to keep in mind this game was released in 1985. The NES controller also only has a D-Pad, Start, Select, A and B. If you hold down B, you can sprint, but if you end up acquiring the fire flower power up, you can press B to shoot a fireball which you can use to defeat enemies, even Bowser. All the levels in the game are very much designed with the mechanics in mind, but there's only so much you can do with a level designed for a character that can only run and jump, hence why there are water levels. World 2-2 is when you are first introduced to a water level. In these levels, you press A to swim up, and you have to avoid enemies such as Bloopers, and Cheep-Cheep. You also need to avoid the reef and holes in the ground, because you would drown if you were to just drop down into it. Bizarrely enough, there's even fire you need to avoid under the water... The art style is very vibrant, profound, and is designed for the NES and it's limited hardware, meaning a lot of assets are re-used in order to not exceed the video memory limit. Despite that, it's still very impressive for the time when taking into account the video memory is only 8KB which pales in comparison to how much graphic cards have now.

Sonic The Hedgehog (1991): Sonic the Hedgehog is a platformer game about an anthropomorphic supernatural hedgehog who has to prevent Dr. Robotnik from stealing the chaos emeralds, and free all the animals that have been trapped within mechanical robot capsules. The mechanics are very different compared to Super Mario Bros. In this game, the protagonist, Sonic, can run at supersonic speed (768 miles per hour), jump and spin-dash. Levels in Sonic are very much designed around the mechanics. For example: Loops. The loops are designed with Sonic's speed in mind, as you need to be running before-hand to get to the opposite side of the loop. There are even bounce pads you can use in order to accelerate yourself further. It's art style, similar to Super Mario Bros, is very vibrant. It is also very pleasant to look at not just the art style, but the environments and it's use of parallaxing, which is an effect used to give the illusion of depth and different elements appearing visibly behind each other, which thanks to the 16bit hardware of the Sega Genesis, it was able to display this effect and have the art style it has without any performance issues.