2D Side Scroller Thief Game

Introduction

To begin this documentation, one should know its focus and purpose. Here, the aim was to explore elevated levels of research and show the thought process to develop an idea into a game prototype. This report will also look at justifying the decisions I made that puts value on the historical connection to the past, support the cultural trend, thus, argue the conceptual and modern factors of the game. In addition, covering areas of focus towards the types of skills developed in this project and how helpful they were to complete substantial levels of work over the two terms period.

The aim of this game is to engage users in solving puzzles by discovering areas of the game and completing quests for which they get rewarded. Playing the game requires problem solving skills, but if stuck the game gives out hints.

The game is based on a 2D side scroller platform with pixel art which includes animated character and environment designs. The theme/era of the game will go back to the Victorian and Edwardian age. As well as challenges around working with pixel art and animating 2d characters.


Historical Research


The Age of Classical Style Trend

Exploring Edwardian Fashion


The theme/era of the game will go back to the Victorian age, settling in City of London for many reasons which will become clear throughout the research.

I’m aiming to focus on something around the late 18th and early 19th century. This forms a challenge to find primary research on vintage trend, also known as Edwardian fashion, it’s less popular and unlikely to pass by individuals who wear clothing of that generation, the research is a tad harder. However, there is a lot of secondary research available in movies and photographs or paintings to support the assets development. This will be discussed in greater detail below as I go through the research in a constructive manner.

The Golden Age of Civic Architecture

Exploring Architecture Styles


Another focus is the Georgian architecture and the redesigning phase of buildings to create the environment in that style. Georgian architecture had begun through the 1714 and 1830 years, thus, some features can be found in federal architecture and colonial revival architecture which have similar approach and are a representation of the Georgian architecture. It was mostly used by countries colonised by England and/or spoke English at the time, therefore one can find that United States has a similar architecture called colonial revival.

Georgian Vs Colonial Architecture

Victorian Architecture Style


Professor Simon Thurley, who at the time was leading public lectures at Gresham College during March 22nd, 2012, gave some excellent insight on the history of architecture. In one of his lectures he mentions that “To understand the English architecture, you must focus on 3 major factors. These factors have been the groundwork to the development of the Victorian style. Changing demands, having new type of buildings for new activities, for functioning needs such as rail way stations, post offices, factories, docks, warehouses, etc. Rapidly developing technology in materials and techniques: iron, steel, terracotta. Finally, historicism, which refers to the many different styles to choose from: Egyptian, Hindu, Ottoman and Elizabethan.” He continues talking about the importance of historicism in architecture and specifies that there isn’t an exact order for these factors just that through time these helped to develop what we now know as Victorian style architecture.

After more studies of his lectures I’ve noticed that when he talks about historicism in English architecture, Profession Simon refers to the link it holds with domestic roman architecture, the classic style, also I suppose how this style is opened to different changes in studies of “Gothic for Protestant churches, baroque for Roman Catholic churches, Greek for banks and Egyptian for cemeteries.”

These examples are from an online blog where Author, Sreekanth P. S., explains the role of the industrial revolution in the development of architecture. In his research the author also mentions a well know architect, “The most original architect in England at the time, and he was Sir John Soane; the museum he built as his own house in London (1812-1813) still excites astonishment for its inventive romantic virtuosity.” The ideas he had about classical architecture are excellent example that show the finer details one would want to achieve with precision and focus on symmetric presentation. Which can also be observed in the image bellow to understand the precision or focus of the Greek style correctly from one of Sir John’s work.

Sir John Soane Museum in London

Changes were made to the northern nations infrastructure due to the English colonialism. At the time (1830s) England had been the largest trading nation and had been the most developed towards focuses such as manufacturing, textiles and architectural infrastructures, which had already begun by the Royal Navy through the late sixteen hundred according to research from the British History Online resource on “Charles II Articles of War”.

The reason for showing this artwork was the level of depth if portrays through builds, and how they have been positions around the room to create this parallax illusion that is seen in real life city compositions which I believe was greatly rebuilt within this room.

Artwork, Movies and Animated Films with Victorian settings

The approach I took for exploring and studying the Georgian architectural style or the Edwardian trend is through videos.

I find this method very useful at understanding the physics behind a 3d or 2d element in movement, thus, the purpose it has within the environment. Then from this research the intentions were to get a visual idea of structure, of building a setting that support the idea of higher class street, one with sources and wealth. The first focus is of course the people, focusing on the activities that were being put into practice by people, the methods used to accomplish them, and clothing worn by different classes.


Batman: Gotham by Gaslight


Batman: Gotham By Gaslight”, a new animated film by DC Entertainment, is an animation that has a comic book relative art style and through the length of the animated film the artists have tried to be consistent. Consistent throughout the approach to greater observation of proportions and how accurate it is when compared to the past.

It also uses correctly observed details to fabrics and clothing, one can really see the inspiration of Edwardian and Victorian styles for outfits and costumes.

This is the first scene of applied practice, the drawing is used to describe the docks of the Gotham City, there is different view styles. The perspective is being built at the bottom, as it progresses towards the top it changes into a front view, orthographic style. This effect is created by positioning the level of the camera higher to align with the height of the bridge. Between the background and foreground, this landscape composition is structured exceptionally well, it uses distance between different parts of the scene which creates a lot of depth in the landscape.

Below I’ve worked on a second practice, looking at another method of adding depth to the scene. Artists from “Batman: Gotham by Gaslight” have brought the foreground closer to the camera, this technique is great as the audience are then able to observe greater details in the artist work. By using the parallax illusion, characters in the background seem to have more space for movement while the ones in foreground have less space for movement. This can be seen below where the women lean against a building, by positioning the characters in this location it gives the audience an idea of where the road ends in front, describing the distance between character in the background and in the foreground.

The value and importance of this animated film was to use it as a learning curve, focusing on the visual aspects. This is where I went and practiced drawings on various scenes, observing the structure of the city. To learn about the layout and perspective of streets and positioning of elements within a scene. After these practices I felt greater prepared to start the assets creation. Again, it was a valuable practice and had helped me to plan out the scenery referencing material from Batman’s Victorian age. In addition, although the animation, Batman: Gotham by Gaslight is constructed with reference to Cities from the United States, thus, the game established in London city, United Kingdom. The architecture and fashion support similar designs approaches which should prevent miscommunication about the setting of levels in game.

After studying distance and depth I had used these techniques to create a first design for the game. The sketch above was used as practice for positioning buildings and characters in a scene. The figure with a hat and umbrella in the drawing was added to represent the pawn within the game. One important aspect to take into consideration about this design is that, based on perspective, it better supports a 2.5D platform where assets are built in 3d, and position of camera can then give this effect of almost 2d. Therefore, for a 2d flat base pixel game the angling had adapted a more orthographic approach.

Winchester, United Kingdom


The second visual research was on Winchester, this was because at the time I thought about the colour pattern and advantages with selecting colours that will make a clear distinction between characters and environment within the game. The architecture is based on roman and gothic styles; therefore, the colours are arranged between different shades of greens, blues, reds and yellows.

“Winchester High Street in the mid 19th Century, A plate from the book Hampshire written by Robert Mudie”

This image is of a drawing representing the town centre. As an observation one can understand that this is a place in the town where a lot of things happen, there is a lot of activities taking pace at the same moment in time. An idea, to enhance the life fullness and energy around the map is to create this atmosphere by further building animations of the people as a later stage in the development.

Having greater numbers in population around the map can also be used as an advantage for the Thief by disguising himself or blending with the crowds to avoid detection. My only concern with this idea is if, given the time to complete the project, one is able to prepare enough animations of civilians and have enough knowledge to set mechanics that successfully function to allow the player to escaping detection through disguise.

Victorian style Portraits

“Forty Years Of ‘Spy’” is a book by Leslie Ward, he was an illustrator during the late 18th century who had studied the human figure, by painting or drawing people. After studying some of his illustrations and the content of these, I’ve noticed that his focus was to get realistic and descriptive illustrations of individuals, presenting the fashion and style of clothing at the time. Many of his art pieces were made in soft tones that average from brown to black and grey, however he also happened to paint a few using colour. The illustrations are mainly in a portraiture format, and as he explains each illustration, these would usually be of people he would encounter during this period.

The name “Forty Years Of Spy” is a description of what he was trying to achieve within his illustrations, by spying on the behaviour of people and putting that in practice on paper through his illustrations for over 40 years.


Below I have a sketch of an old man, the purpose with this work was to try and feel different, to understand the sadness, or the difficulty at the time for elderly and less fortunate people through drawing. One can understand more about the lifestyle of an elderly, maybe by studying photographs for points that lead to identifying emotional state, perhaps showing how this person may feel, judging on the small details about their body language and face expression in comparison to their surroundings. Another focus point about this drawing is that it seems so that the person from the photo is dressed considerably well, which goes to show that even wealth had no cure to unhappiness.

One issue in the past causing suffering and pain to an individual and their family was disease, the people at that time were less fortunate to find cure and medication to treat against illnesses. As a personal view, this drawing really reminds me of the erstwhile period, this is portrayed through the thoughtful, wondering eyes of the old man.

Leslie’s illustration describes the behaviour of coats made of fabric and cloth, and the shades of the highlights and shadows are very well executed. The only difference would be to reproduce this shade of fabric using pixels instead of regular painting brushes.

I’ve continued thinking about the expected and required animations to improve the success of the game. And initially thought about the way assets could support the vintage design to the game. Planning the streets, providing spacing between houses, to build a small bit of privacy form one’s neighbour. Researching, many areas of interest in elements, such as the horse carriage, and how this style of transport functioned.

Video Games

Games are the most inspiring sources of information when one is looking to figures out how to develop their own game. The only sort of negative side to this would be to only be inspired from other games and not put effort in having something with originality. That is why with these games, my aim to analyse what and how developers have made certain aspects and further develop on them on my own into my own style. Good examples of this is covered further in the games section.

The genre is an essential element in video games, it helps up to subdivide them in within different branches and focus on the one preferred on top of other genres. For the video game, puzzle and stealth are the channels I am aiming to follow.


Assassin Creed Syndicate

The reason for details in research of setting the mood, is to get the players to experience this vintage connection of being of that world, at that time, of participating in events from the past. This is from a personal point of view where I have had similar emotional states because of how connected one can become to the world within the game. Assassin’s Creed Syndicate, a 3d open world game based on London’s infrastructure and performance in early 19th century, this game is a great reminder of attachment to a virtual reality which can really create this illusion to the mind that you are part of the game world, that you are in control of what happens around you, selling how real this experience may perhaps be. On top of that, its leading the mind to create an emotional attachment to the story, the characters and to your own pawn’s safety, wealth and fulfillment.

Invisible, Inc. (video game)

Invisible is a game very much inspired by Tron and neon lighting, it’s an excellent theme that improve the aesthetic of the player experience. Following this dark theme, the game has a similar colour contrast design for buttons, darker design brings in emotions such as obscure, mysterious and simply makes the game awesome and polished.


First look at Invisible gameplay

The menu system and button-based interactivity, having the same dark theme, provides a more focused layout with a linear and compact style organisation of controls and menu options. Also, by rolling over buttons one can experience more depth to the game enhancing the player experience and helping to feel more connected through every aspect of it, just by simple using some sounds and interactivity techniques on buttons. I have worked on putting this in practice through my own prototype. By having menu options, a prototype will have more resemblance to a complete game. Such as being able to pause in the middle of a mission. Invisible has another use for buttons as an interactive element, this is aiming to further explaining each step that a mission has with greater detail. This interactive element can be navigated through continuation buttons of confirmation and cancellation actions.

The video above i there to describe the main menu design by Invisible, Inc. as explained above about the choices in colours for contrast.


Yokotroit, Video Game

I have picked this prototype to study the player functions, features, characteristics and pixel art style of the game. It has a very similar idea in terms of the genre. Relatively simple to design and resembles more of what I am aiming to achieve by the end in this project. Yokotroit is a stealth type game, one of the objectives is for the player to find ways to sneak behind guards and collect valuable items along the way. What’s great about this game is that it runs via a “Point and Click” system. Point and Click systems in this case allows the player to carefully calculate their own steps and act at the right moment to avoid detection.








In the images above, the character can use a specific skill set to complete a level and move forward in the game. I believe the skill type used is hide, and once using the skill the guards are unable to detect the location of your pawn. The player also appears to have an inventory section, supposedly used to store the items collected while exploring each map. This is another mechanic within the game that could potentially be useful to have within my own prototype.


To reflect on the research about, it was designed to aid the development of game assets and player functions the prototype must have.

Description of game ideas


Spy Game

The first idea was to have a 2d side scroller pixel-based platform where you are disguised as a German spy, during the second world war, he infiltrates different houses of the parliament and steals important war planes from the UK government and army. However, I though about the popularity and negativity of this game ideas and decided to go for something more peace friendly.

The sketch above is of a scene design for the spy game. It’s based on “Yokotroit” a video game prototyped studied in the previous area of the report. With this sketch design I’ve applied some of the ideas that were discovered from the Batman animation. However, after drawing this idea, I realised that it didn’t quite fit the tie period as petrol engine vehicles were developed in later years. The second problem with this draft design of the game was the lack of depth the scene had. This is an important focal point to create a parallax that improves the visual presentation.


Thief Game

The second idea was to also use the 2d side scroller pixel-based platform for a Thief game. The thief begins his journey at London Bridge and continues along London’s most famous tourist attractions to reach a final destination, the Buckingham Palace. In this game the ultimate goal is to complete his evil master plan of stealing the Queen’s crown. The plater would be face with many challenges, such as having to avoid detection from the queen’s guards along various locations, completing puzzles in order to use transport tools and to the next designated location as part of the levels structure. An issue with this idea, what the chances of building all these levels, assets, functions and mechanics in the limited amount of time. Therefore, I have made a choice of focusing on details instead of trying to build the complete game.

This is a map design for the different location our thief would have to travel through to reach the end of the game. With these locations there will be a series of levels to complete in order to move further in the story. With this sketch I have tried to use the river as a circuit that forms the map towards the Palace. Also, the positioning of these attractions was based on real-life study of London structure and their position along the river Themes.

Game design decisions


The prototype

For a start these are demoes that allow test to be made by other users. Prototypes are made in the early stages of the game creation, this is where the developer can describe the type of game, perhaps show the areas of focus and of interest. The prototype term means that a game is not complete and polished but still functions: for example, to use the character controls in order to move around and explore the environment.

This can also be seen as the Alpha and Beta phases as the developer is trying to test how successful and positive the responses are from testers and is given a chance to receive constructive critique and feedback for correct updates to be made. If the prototype is really successful, one could possibly find investors that are willing to support with the development of the game from the financial side.


Why have levels for the game?

By having levels and score points, the game happens to result in competition, to win, to reach higher scores, thus, feel accomplished. For example, if you discover this game among a group of friends, one’s aim becomes to play longer hours learning about the game, and it possibilities, discovering techniques to solve puzzles and ultimately completing game quests. The more experienced player would have better gear or skills to reach the end game.

Therefore, I think using levels and score points can populate the game increasing the number of players.


Ideas for online compatibility

Another technique for making the game more successful would be to build it for the web or for online platforms shared and accessed through servers. This idea is sort of encouraging for game design firms to work more and more on online platforms due to accessibility and popularity, along with user benefits such as enjoyability to have fun and stay connected to others. Through online methods there are chances for games to cultivate extensive numbers of users, and in many cases, these are free to play games, some great examples are from MMO or RPG genres.

For my game design, an idea would be to export the game for mobile devices and provide compatibility for Android and OS operating systems. The game prototype would be exported as APK standard format.


Why have puzzles for games?

Captivating the players interest is an important aspect within any video game, the challenge of not losing interest and becoming bored of one’s surroundings can be a difficult step to overcome. With puzzles, there is more thinking process and the game could instantly become more tempting to try and solve, the fun factor grows based on how creative and well presentable the puzzle is to the player.

If using puzzles, the game constructs artistic and resourceful ideas to improve on secondary movement or character and environment animations. By bringing animation and interactivity closer together and finding ways to make this work I believe it enhance the pleasure to continue playing.

It brings this attention towards the competitiveness of the game and how skilful one’s mind is to get through some complex puzzles. The difficulty in puzzles is needed to continue grabbing the players attention, however, this should be controlled based on how much has been learnt from completing the previous levels.

This section also reminds me of the atmospheric and distinctive focus on game mechanics and thoughtfulness of the game.


Sounds in games vs movies

For video game before the next-gen consoles platform, fps rendering was a serious constraint, therefore compared to movies games try to keep their sounds to a minimum only adding ambient music for the backdrop or in support for the visuals encase player decides to attack, jump, or had potentially been killed by the enemy.

In this research a study about video games versus movies, by Adrien-Luc Sanders, explains the constraints about real-time rendering in video games and why it is important to compress sound assets for faster render times and smoother gameplay. He mentions that “Adding voices to characters other than generic "beast" sounds would triple or double the strain on the rendering output engines and slow the game down even further. Again, this limitation is not evident in movies, where speech and varied sound effects are necessary for the overall effect; but because movies aren't being rendered frame-by-frame as you watch, there's no need to cut corners on the audio.”


Evidence of long term development


Weekly plans

Along with other classmates, we have been given an objectives and target planning document to aid in building a guide for self-support in the production process. I should mention that this planning document had not remained identical due to problems that have occurred or decisions that had to be made due to software knowledge or time constraints.

Out of all the tasks as part of the planning documentation, the most difficult one to plan was the week by week targets. For me the problem was to determine how much time each practice took in order to move on to the next. This was difficult as I have very little experience of workflow in video games and have had little knowledge on software which meant that many of the mechanics or assets would take longer to build after having accommodated to the software.

Summary of the directional focus

Animations and Pixel based assets design are the directions I took for the element of specialisation. Looking at the way animation and decorations can communicate with the audience and how to develop natural movement using a 2d flat base frame method.


Regular critique

For the development of assets, I have used peers feedback as a method of collecting constructive criticism about the Thief concept. The process for this was to ultimately develop the performance of the frames-based animation. To share my progress, I had to make short recordings of sprites in movement, where it would be observed for glitches and errors of figure movement and motion. The purpose with this task was to acknowledge others point of view on my work and help identify areas that required more focus.

A screenshot showing the feedback process I was mentioning earlier where I described and discussed the errors around the walking animation of the thief character. Feedback was given by Paul.

As part of this screenshot, I had a discussion with Ben, about the progress of the Post Office box.

In the conversation there are talks about the use of objects for interactivity and game decoration. The post office box had significant value for the function of the game, this was where the player can click on the note to discover his quest. I learnt that constructive critique discussions between classmates can have had a significant impact on the development of my assets design.

Complete Game Description

This game is based on a thief who happens to be assigned jobs from individuals to steal property and deliver the item to the individual who assigned the job for rewards. There will be a verity of animation states such as Idle, Walk, Run, Jump, Fight/Shoot to boost on the level of player functionality.

The character will be able to pick up and use items within game, he will also be carrying a weapon (perhaps of choice) to deal with NPC’s or aid with the completion of objectives. The NPC’s will have a distinct look compared to the general crowd of people. They should be able to detect the player at close range. If the player gets closer the NPC’s (guards) are set to chase after and your pawn and place you in jail.

In later stages of the development, the game will provide further skills that your character can learn. For example, the player can avoid detection by following/using the hide skill. This skill will only be allowed in specific areas of the maps (boxes, barrels) and can be unlocked after level 3 has been completed.

As the game advances the objectives become harder to complete and difficulty level rises. The sort of things to expect are, increase in guards round the maps, higher rank, or more skilled in detection and combat abilities, thus, the player also received a skill point after each objective. He can master a specific skill or multiple skills.


Thief skills begin at the first level:

Agility 1 2 3 4

Combat 1 2 3 4

Armor 1 2 3 4

Theft 1 2 3 4

Disguise 1 2 3 4

Hide 1 2 3 4


The game will be a 2d side scroller platform with a perspective ultra-wide camera view to follow the player. The design is referencing pixel art and arcade pixel games, with animated sprites for characters and environment.

As an overview, I am expecting the game to have a fully functional base map where the player needs to explore the town and find the objective that leads him to the task. Example: "finding the keys of the judge secretary in her house and use them to steal a letter from the court house."

The quality of the sprites, character animation and basic gameplay mechanics are important aspects. Those will be the areas of focus and should be presented fairly well, and as mentioned of good quality. For skill development and knowledge of Game engine, blueprint functions, mechanics and animations I followed a 2d platformer game making tutorial from a reliable source called, plural sight.

I will be going over a few steps that one must take when building the game world within Unreal Engine.

Firstly, import /source character sprites, learn how to divide them in individual sheets using unreal extraction settings. Binding sheets together to make keyframe animations and naming them correspondingly to have an organised files structure which you and others can understand.

For some aspects, some of the work looks at the handle animation, handle movement to develop player functions such as, player shoot/death as a game mechanic. To be able to complete such task it is required that you make more variables which tells the software when is true that player does a function.


Tutorial sessions that helped you manage your work

As mentioned above about the “Intro to 2D Side Scrollers in Unreal Engine” tutorial and the ones completed in class I was able to create a test project. In this project the character is able to shoot, run, and jump, which was an excellent practice to understand the basics of using sprites to build the animations for the character. These actions have been assigned keyboard commands using the project settings window in Unreal Engine. From this test project I was able to construct on top of it replacing the test sprites with my own designs which can be seen further in the documentation where I go over the animation and creation processes.

Visual behaviour test of the practice project with run, shoot (object collision) and jump animations.

"Cyberpunk artwork created by Luis Zuno"

The purposes of doing a test is to understand how the parallax effect, and depth of view works within unreal engine, and so for this practice I have used online sourced assets to make an accurate test on how the environment behaves within the project as the player is moved from the side to side.

Here is a video of the different layers to build depth through background, middle ground and front ground.

Using this demo, I also wanted to look at how other artist have created animated sprites and how much detail is required to reach an appropriate level of quality. In addition, to create the shooting animation and make is realistic I used environment collision, changing between the projectile animation and the projectile impact animation for when the projectile had hit the wall.


Other ideas for the game included:

  • adding an inventory, to have the item pick up mechanic for the player to interact with the environment

  • adding a health bar so that if player is hurt or hit it will lose a percentage of its health

  • adding an NPC that can detect player and restart the game to the beginning

  • also adding a function to hide player when reaches a box that was discovered when doing research on tropes and game ideas

After importing the character sprites to unreal, the process is the to export these in single sheets for alignment into an animation. The sheets can be modified as I have done in the example to give that first step more weight and push motion by simply extending the play time.

Also, with the image below I wanted to give a visual idea of the nodes used and how different variables are attached to the actor as well as branching out the different sprite animations that use a logic of true and false to avoid clashes if activated by the player.

Blueprints were covered in the experiment but not to extensive levels of detail, there have been actions added to the player blueprint and to the shoot function blueprints, however, node graphs were mostly used to be able to complete the character animations test. This exercise was great at learning and getting an idea of the process.


Assets Design and Development

A lot of the times in video games proportions matter. That may be because the audience tend to think of them as digital recreations of our world. Which is why going back to the research practice, I’ve learnt how to structure a Victorian scene with focus of distance between characters and layout positioning of houses around them to support this idea of real-life interpretation.


Aseprite

As a software learning curve for pixel art and pixel-based graphics I have moved to Asperite. This is a software that brings back the blocky graphics interface, and although one can do similar things with Photoshop. Such as 2d animated functions of a character using frames with layers. It feels like with Asperite there is more focus on the actual arcade games style for building game assets. A helpful element of Asperite package is onion skinning, this is helpful at morphing each frame with the next when applied to adapt a smoother movement. As one of my lecturers were explaining, the one thing to avoid in games is to have a stiff model animation. Without character animations there would be no personality for that model and leads to lack of depth.


Another efficient advantage is the scaling option, by using a pixel by pixel graphic those are considered vector and Asprite gives the ability to change the canvas size for making higher resolution designs or lower resolution.


Game and Real-life References

On the left there is a concept art from designs of Assassin Creed Syndicate. The focus to this concept art is to study the depth of view and how the artist have been able to use a selection of tourist attractions, to make it clear to the audience of when or where the game will be located.


The mansion house, London, was a visual reference for one of the buildings which is part of the background element. An element which adds more depth to the image, observing the tall pillars that came from the Greek classic style architecture. That style had significant impact on English buildings designs at the time.

For the furthest level from the character in game, it was inspired from London city famous classic structures referencing, London Bridge, St Paul's Cathedral, The Big Ben and The Mansion House. I tried to be consistent at adding buildings that had more to the design, for example the spiky pointier rooftops because they sort of reveal enough for the player to figure out the rest of the design through imagination.

famous structures with colour and outlines using pixel brush in Aseprite

Gradient filter using convolution matrix in Aseprite

it was added to blend the outlines with the background color making the last depth layer a secondary focus

Character Design

Quick personality and aesthetic sketches inspired from people encountered through London underground journeys

More abstract sketches that look at nature, mythology, spirituality and advanced props

Relatable to stealth and disguise, the outfit of the Thief had to help him blend with other civilians. For such reasons I took the following design approach where he can easily adapt to different situations and at normal, but at the same time appear dangerous. To place fear in his enemies eyes.


The outfit choice was also relevant to clothing and trend at the time, and back to Victorian days, male figures had the tendency to wear a hat, it was a usual detail that completed ones outfit. Forwards down to the torso of the figure, a long coat was used due to game decisions to have mechanics for fighting; which meant caring gear and inventory; for item stash. With this design the Thief will be able to hide his loot and the weapons he carries.




The aesthetic of the character is referenced from this concept art by "Hunter Schulz", he has this concept art where the character reminds me of a well-known character from the past, a villain and antihero with a fancy coat and hat. Jack the ripper had a similar style where he also carried weapons and was a shady/sinister man.


For a developing idea of the game, the character design goal becomes to reference a Victorian rouge antihero. It must have hidden abilities and stealth design. A selection of clothing to blend with the rest of the surroundings and cloak through crowds of pedestrians to escape the guards.


Animation Practice Cycles








This lower detailed model of the Thief was made on a standard 32 x 32 pixel block.

Furthermore, a character in a game can have many unique features and be constructed using original behaviours to form his personality. I think in the preliminary stages of a character design process, to be aware of the personality and type of identify he or she has will support in the design of that model’s features and details.


There are many different personalities to choose from: one could be a happy face, sad, fashionable, rude, smart, grumpy, energetic, laidback, violent or passive. As a Thief, I think a fitting profile would be to combine happiness with intelligence. The character is less stingy, the happiness in him will make him enjoy what he does, especially if he’s activity of making these robberies is for a deeper cause.


He may intend on helping the less fortunate or poor by stealing from the rich. However, in this case, the character story would be too obvious, and I had to avoid following a cliché story for originality purposes that prove to make games more successful.


The actor, character or model, if its supposed to be seen by the player because of the platform of the game, it becomes a important area of focus. In most cases this character is what the player will end up studying and staring at for long periods of gameplay time. Depending on how this figure is designed will make the player enjoy and connect more by attaching to their character. A promising idea to start planning this concept would be to think about the character’s unique personality. I’ve noticed that many games have their character behave in unique ways, to cringe, tense, breath or look around the map. These characteristics of model further improve how real the experience is for the player, also describes more on its personality only from the idle pose.

Thief Idle Animation: with this animation the goal was to show the awkwardness felt by the character as he stands still.

When I think of the idle animation for the thief, I imagined the behaviour and movement he would make pretending to make himself unseen and checking his surroundings to remain cautious of guards.


Development

Advanced character concept with colour shading

After testing the first draft in unreal, the most obvious issue that needed to change was the sprites resolution. With the previous 32 x 32 block, unreal was not able to control the quality of the design and character seems to have a blur on top. To increase the quality of the character i doubled the block to 64 x 64. This setup was in favor by most 2d artists based on forums that i looked up to learn about pixel game resolution for maps and for characters.

Advanced character design idle animation: more descriptive for body angling and position as he rotates

Polishing

Why I had to increased character height?


The legs height was too short on the vertical integration. With shorter legs there was a difficulty at animating a natural walk cycle for the character given the feedback from other classmates about the glitch errors from parts of the legs movement. To fix multiple issues the height of the character is now greater by 4 pixels, allowing more extension of each leg.

Polished character concept with smoother outlines and cleaner shading techniques

Adding weight to clothing and adding movement based on character behaviour.




Environment Design


exterior street design, houses with victorian architecture, thus, other ideas on decoration and animation

Throughout the development of the environment, there were two sketch plans for describing the focus and ideas in the interior and the exterior designs. Such as, setting of rooms from that period, objects for interactive purposes and that need collective systems using inventory.


However, due to various software constrains some of these designs have not been included in the last update of the prototype. Together with things mentioned through research and evaluation, I came to a conclusion of not having perspective deigns for the houses, this is due to the flat mechanic of 2d games. Therefore, many of the house designs were controlled enough to have some 3d details, to give it some knowledge of perspective, yet they would still be flat designs as presented below.

Judge's House Interior Design

Court House Interior Design

Street Layout Design: angled to help the camera and build more depth

Victorian Style House Variations for Exterior Design

The environment work was supportive and functioned well together with the characters. This is one of the most important aspects within games, films, animations, and that is to make sure characters and blending correctly and fit the art behind them.


I think after the arcade games, environments had become more and more demanding as a primary focus and requirement for most games. This may be because as one syncs with their video games, a great and realistic design of that world around the player will improve the chances for enjoyment and lead to a better satisfaction or experience for the player.


Below I listed original interactions that reflect on vintage designs from a victorain period.

Along with the environment I have put together a simple design for a main menu. This process included creating menu assets importing them to a widget blueprint in unreal, getting this to be displayed on the screen and keeping buttons organised when navigating just by having their visibility turned off and on for each screen. The player is then able to hit play, and action is triggered and their first mission begins.


Below I have shown the menu options and how it would act when hovered or when not.


Evaluation

To begin the evaluation for the game prototype, I’d have to take into consideration the various elements used such as blueprints, artistic styles, research, colours, camera, characters, animations, environment and other game making methods. In the process of completing different steps to the making of the video games many of these elements were accomplished, developing skills of software, one being the practice of compositing sprites that together form player actions.


The ultimate goal was to produce a game prototype that functions to a level where the interactivity and animations communicate with the player. Of course, a lot of this involved the theme, the purpose with this theme was to replicate a Victorian style street from somewhere back to the early 19th century. And judging on the current day, pixel-based video games are being reintegrated into society. This may be because video games from the past have lead the entertainment department to new forms of communicating to audiences. People, including myself also remember how much fun this form of entertainment brought during the past retro and arcade styled games. A good example to analyse is Cuphead, this project is trying to reinvent Disney classic 2d character animations (mickey mouse) into characters for video game using the most developed cutting-edge technology of the 21st century. Many of these factors supports the idea of bringing video games “back to arcade age”.


The latest prototype package does not cover all the ideas spoken of in the game description, this can be found in the earlier parts of the documentation. One reason for this is that in many cases the thought process of setting enthusiastic aims will include the risk of failure, this clashed with the ones that are set as time realistic aims. When taking the challenge of making a pixel game, the primary issue with that becomes the lack of experience with 2d pixel animation, and smaller areas such as formatting and adapting assets for game use, for example creating sprite sheets.

Presenting the game prototype idea

Referencing to the previous research of Assassin Creed Syndicate, with this game idea I was looking to set a mood and improve the experience between the player and the game world by concentrating on building a strong connection to the vintage pixel design of a Victorian period. A game world with animations and interactive decorations such as doors or notes can be operated using the point and click function, this ultimately allows the player to explore rooms or check the quest. To explain the purpose of entering rooms, based on a note found on the post office box, the player is instructed to investigate which house is the Judge’s, stealing the keys to unlock the court house building.


With the current stage there is missing details to the keys pick-up system, meaning less logic for inventory functionality. To improve logic the problem was that a global inventory was required where it saves information of multiple maps and while searching for solutions, browsing online resources, the ideas of inventory systems developed were still only able to support a single map usage.


The thief has an interesting design, at times it seems less detailed than the guards, but eventually I realised that this was a positive aspect, as a thief details and highlights would make his more noticeable, therefore a more traditional approach seemed to be the correct path to go by.

Colour is a very valuable aspect for a video game, colours bring life, they help to enhance the fun and interactive factors, it makes the game more interesting. With the selection of colours used for this game, I wanted to explored acid and holographic meaning of colours. Of course, most of the time these feel like strange patterns and sort of seem to symbolise a psychedelic art style, which ultimately was a personal choice because I find a lot of connection and beauty in colours as such.


By doing an observation from the past, gothic art and gothic architecture had also adapted a similar colour pattern, this is therefore a supporting example for that period. This medieval artistic style used light details to represent mystery and divinity through churches windows. Focusing on a background where one can notice dark and sinister contrasts of colours as wells as the bright and adored light colours will form a balanced method to the style. The artists who used this style ensured that everything had been painted in a clear layout including walls, ceilings, objects and characters.


There have been different focuses to the visual aspects of the game; props and decorations, character designs, animations and environment designs. The element that I am intrigued to continue practicing after this project is character design and mechanical animations for different abilities of a model. This will include working with Aseprite, getting more familiar to pixel art and building smoother movement of objects similar to how I recently gotten more familiar when I was developing a realistic horse carriage animated sprite.

There are of course many other areas of this prototype that need smaller and larger attention towards making the player experience better and having more original elements, perhaps voice overs, foley sound design for better atmosphere, more interactivity, and others more.


As an overview, I believe that over time my skills will improve, and more developed videos games can be achieved, and with the current skills gained I am moving forward with a much clearer understanding of what games are and what processes have to be taken into consideration when making them.


Bibliography

References

  • British-history.ac.uk. (1819). Charles II, 1661: An Act for the Establishing Articles and Orders for the regulateing and better Government of His Majesties Navies Ships of Warr & Forces by Sea. | British History Online. [online] Available at: http://www.british-history.ac.uk/statutes-realm/vol5/pp311-314 [Accessed 7 May 2018].

  • Demo), Y. (2018). Yokotroit - (Completed Game Demo) by mdhProtos. [online] itch.io. Available at: https://mdhprotos.itch.io/yokotroit-gompleted-game-demo [Accessed 7 May 2018].

  • En.wikipedia.org. (2018). Georgian architecture. [online] Available at: https://en.wikipedia.org/wiki/Georgian_architecture [Accessed 7 May 2018].

  • En.wikipedia.org. (2018). Winchester High Street Mudie 1853.jpg. [online] Available at: https://en.wikipedia.org/wiki/File:Winchester_High_Street_Mudie_1853.jpg [Accessed 7 May 2018].

  • HGTV. (2018). Colonial Architecture. [online] Available at: https://www.hgtv.com/design/home-styles/colonial-architecture [Accessed 7 May 2018].

  • Katetattersall.com. (2018). [online] Available at: http://www.katetattersall.com/wp-content/uploads/2014/10/flonces-pagoda-1855-men-1840.jpg [Accessed 7 May 2018].

  • Klei.com. (2018). Invisible, Inc. | Klei Entertainment. [online] Available at: https://www.klei.com/games/invisible-inc [Accessed 7 May 2018].

  • Sanders, A. (2018). Animating for Video Games and Movies: What's the Difference?. [online] Lifewire. Available at: https://www.lifewire.com/animating-for-video-games-vs-movies-141113 [Accessed 7 May 2018].

  • Soane.org. (2018). Understanding Architectural Drawings. [online] Available at: https://www.soane.org/collections-research/key-stories/understanding-architectural-drawings [Accessed 7 May 2018].

  • Sreekanth, P. (2018). Impact of Industrial revolution on architecture. [online] The Archi Blog. Available at: https://thearchiblog.wordpress.com/2011/06/02/impact-of-industrial-revolution-on-architecture/ [Accessed 7 May 2018].

  • Thurley, S. (2012). English Architecture, 1830 to 1914: On Top Of The World - Professor Simon Thurley. [online] YouTube. Available at: https://www.youtube.com/watch?v=4hp47G--ZbU [Accessed 7 May 2018].

  • Ubisoft.com. (2018). Assassin's Creed Syndicate. [online] Available at: https://www.ubisoft.com/en-gb/game/assassins-creed-syndicate/ [Accessed 7 May 2018].

  • Ward, L. (2011). Forty Years of 'Spy'. Project Gutenberg.


Copyright © 2018, EDUARD GAL STUDIO. All rights reserved.