Posts

Showing posts from 2019

Reflective Post

On balance I believe this project was successful in telling a story through gameplay, asset design and the audio used. I created a successful platformer that allows the player to walk, jump, defend and collect items. On reflection there were elements that due to time constraints I wasn't able to implement and therefore I need to work on my time management skills. Throughout this project I have learnt that I need to improve coding in C#. I have realised that when writing code I am not using the most efficient or "cleanest" statements. For example when collected items in my script, I wrote ten if statements for each heart collected. Although this worked and was simple to understand, in future I would attempt to use a loop and array to run through each statement for each count number as this would save me time overall. Unfortunately due to my limited coding knowledge there were a few aspects of the game that I couldn't get to work. This included a health bar/hurt bar...

Full Havard Bibliography

BLACKTHORNPROD (2018).  COOL DIALOG SYSTEM - EASY UNITY AND C# TUTORIAL.  [Online Video]. April 8th. Available from:   https://youtu.be/f-oSXg6_AMQ . [Accessed: 10th May 2019].   BOWL AND CEREAL (2017).  Unity Tutorial: Playing Audio (Music and Sound Effects) . [Online Video]. February 7th. Available from: https://youtu.be/egxNXuwf0_g.  [Accessed: 10th May 2019]. BRACKEYS (2018a).  2D Animation in Unity (Tutorial) . [Online Video]. August 5th. Available from: https://youtu.be/hkaysu1Z-N8. [Accessed: 10th May 2019].    BRACKEYS (2018b).  2D Movement in Unity (Tutorial) . [Online Video]. July 15th. Available from: https://youtu.be/dwcT-Dch0bA. [Accessed: 10th May 2019].   BRACKEYS (2014).  1. How to make a 2D Platformer - Basics - Unity Tutorial . [Online Video]. April 26th. Available from: https://youtu.be/UbPiCgCkHTE. [Accessed: 10th May 2019]. BRACKEYS (n.d.).  2D Mega Pack (Camera2DFollow.cs. and Parallaxing.cs...

Development Choices

While I was working many aspects of the game were changed or removed due to time constraints. Health Bar. NPC conversations became UI dialogue text. Was going to include a house (as shown on the Level Design). Movement Platforms. Count removed changed to dialogue text. Enemies that were going to attack the player. Orb was going to be the defense against attacks. Heart animation. No footstep or landing on platform sounds. Dialouge sounds became actual voice acting. Game over became cut scene. Title Screen became cut scene and dialogue. Ability to mute or pause the game. Two separate endings became one. Using a WiiMote controller. Should have set escape button to quit the game.

Game Assets

Image
All assests used in my game were created and illustrated by myself using Adobe Illustrator. For the player character, I animated a walk, jump, defense and idle animation so that there was more variety. NPCs Player Character Collectible Item Scene Cut Scenes (All images/illustrations deisgned in this post were designed by myself both cut scenes were created by myself, own images/videos, 2019)

Cut Scene Creation

Image
I created both cut scenes on Premiere Pro using simple effect controls and video effects to make each scene flow. I used the position, opacity and scale settings for the heart that transitions into the dragons body and used crossfade and dip to black for the video effects. I decided to add a cut scene because this was another way I could tell part of the story and a good final ending to the game. I felt like adding the cut scene added a conclusion to the game. (Screenshot of Premiere Pro Project, Own Image, 2019}

Sound Design & Music

Image
The sound and music for my game was created by Matt Burrows who studies BSc in Sound Design Technology at the University of Hertfordshire. I wanted to include sound and music to set the scene, as I believe that these elements can help to provide insight about the narrative without even playing the game. For example:  As my background was very dark, I wanted music that suited this dark setting and decided that cheerful sounds would not only confuse the player but not suit the tone of the game. Therefore Matt used minor chords when creating the music. The world is quite magical which is seen by the non-playable characters e.g. dragons, frogs, plants etc. and therefore a lot of reverb was added to the dialogue to give it a dream-like state. The jump, defensive orb and collectible sounds were primarily for player feedback so that they are aware that they have performed an action. As I wanted the game to sound more realistic than video gamey, Matt created all of the sounds/music f...

Worldbuilding

Image
When creating my game I realised that I had created an imaginary world and doing so helps to build an atmosphere and setting. I believe that worldbuilding is important because it makes the player wonder what is going on in this world, outside of the narrative. The background choice for my game is quite dark in comparison to the player character. This is because this world is filled with negativity and despair. The main focus of this game is Dragona (the dragon) who also has quite a dark colour scheme to fit in with the world and because she is sad due to the loss of her husband (Darkus). In this magical world, it is common for there to be dragons, plants and frogs as these are creatures that be associated with scariness. (Own illustrations of background image and dragon character, own images, 2019) However these aren't the only characters in this world, the occasional human will appear. The girl has been raised by Dragona and wants to help her Mother fight the sadness s...

Ramsay Safety Solutions' live website

Image

Final Ideation & Storyline

Image
Creating a dark world that has become filled with darkness, due to the negativity that 'enemies' share with the main character by saying nasty things. Once warmth is collected, the level's background would begin to lighten up slowly to show that warmth and kindness can erase darkness. I began to like this story more so I decided to illustrate a background on Adobe Illustrator which became my main background for my game. (Illustrated background ideation, own image) However, I also wanted to incorporate some of the elements from my previous ideas. This included having a human as the main character as this would be more relatable to the audience. When designing the character, I decided that I wanted her to look quite simple but use very bright colours so that they would stand out from the background. Similar to the original flame idea, I wanted this character to be bright to represent warmth, brightness and hope. I made this clear by adding a firey gradient as the...

Images (Licensing)

Image
I got the majority of the images used in the website from pexels.com which is an online image site. I decided not to reference these images as they are free to use for commercial use and attribution is not required, which is stated in their image licencing policy: (Screenshot of licence for Pexels images, own image) Although the majority of the images used on Ramsay Safety Solutions' website were free because of the niche line of work Ramsay Safety Solutions is in, there wasn't always an appropriate or relevant image that related to the company. Therefore with agreement from the managing director, we decided to purchase a Shutterstock image package. This allowed us to download five images for £29. We decided to only use this package when we needed a header, slider or blog image that was in a niche area. (Screenshot of prepaid image packages from Shutterstock, own image) Below are the images we purchased on ShutterStock. (Screenshot of license hist...

Stylesheet

Image
I decided to create a stylesheet so that if anyone needs to modify the website, they are informed about  image sizes, colours, buttons and positioning.

Time Management

Image
I predicted my time management using a Gantt chart at the start of this project which was included in my project proposal. I predicted that this project would take the full ten weeks allocated to complete however, I finished two weeks earlier than expected. Research Phase  Initially I predicted that the research phase would take me one week to complete with three days focusing on 'Coding WordPress Templates' and one day researching WordPress Plugins. This stage took longer due the initial research I completed on WordPress and decided that I would achieve a more professional result if I decided to handcode the website using a BootStrap template. Therefore I spent, one week researching 'WordPress Interfaces' so that I was able to understand the differences between WordPress.org and WordPress.com and to experiment using these systems. I spent a day resarching 'WordPress Plugins' so that I knew what components I could easily put into the website by using WordPres...

Sketches

Image
I used a combination of sketching freehand and sketching on Illustrator to create my characters. I practiced drawing a walk circle for my character so that I could edit her idle state on illustrator so that when she became animated she looked as though she was walking. (Freehand sketches, own images, 2019)

Sitemap

Image
The client requested a sitemap of Ramsay Safety Solutions' website and therefore created the sitemap below for the client. (Sitemap, own image)

Level Design

Image
Sketching my level helped me to visualise my game. I changed my idea slightly where I thought there could be NPCs saying mean things to the main character and each time the character walked past these NPCs, it would increase the hurt bar UI element at the top of the screen. Once the hurt bar reaches its full capacity, the game ends. I also wanted there to be NPCs that you could interact with that say kind things showing that the world can be cruel but that there are some people that are kind. The hearts are collectable items that decrease your hurt bar as they bring warmth and kindness. 

Testing (Links & Contact Form)

Image
index.html  Phone button link working correctly on all headers Arrows on headers working correctly - correct header is displayed Video link working correctly - welcome video is shown Workplace Risk Assessment link working correctly - Workplace Risk Assessment service page shown Fire Risk Assessment link working correctly - Fire Risk Assessment service page shown Audits & Inspections link working corrrectly - Audits & Inspections service page shown Accreditation Schemes link working corrrectly - pre-qualification service page shown Bespoke Management System link working correctly - Bespoke Management System service page shown Retained Consultancy link working correctly - Retained Consultancy service page shown Policy Formation link working correctly - Policy Formation service page shown Awareness Training link working correctly - training page shown Contact us button working correctly - contact page shown Team e-mail and linkedin buttons working correctly. Em...

Contact Page Implementation & Design Decisions

Image
The contact us page was barely changed from the original design. Interactive map added for interactivity rather than a still image. (Contact Us Page Mockup (Left), Final Contact Page (Right), own images)

FAQs Implementation & Design Decisions

Image
Not many chnages were made on the FAQs page. Header image changed to gradiented image to add branding consistency using Ramsay Safety Solutions' colour palette. Navigation bar changed as mentioned previously for clarity. Instead of using #5a5a5b for the left side of the accordion, I decided to use a lighter grey because I felt as though this colour was less harsh than the darker grey. As the purpose of FAQs  are to answer any general questions, I needed the page look professional and inviting. A lighter grey added a softer touch to the page. I decided to add a statement underneath the FAQs with a contact button in case the user has any unanswered questions that the client may be able to answer. Map removed as mentioned previously as it didn't add any extra value and felt unnecessary to have a map at the bottom of every webpage. (FAQs Mockups, own images) (Final FAQs page, own images)

Latest News Implementation & Design Decisions

Image
Header image changed to gradiented image to add branding consistency using Ramsay Safety Solutions' colour palette.  Navigation bar changed as mentioned previously for clarity. Photographic imagery used as mentioned previously to add branding consistency using Ramsay Safety Solutions' colour palette with the day and month of each published post added to each image. Instead of continuing the post icons on one page (as this would become lengthy), I decided to create more latest news main pages to improve interactivity and less scrolling for older posts. I deicded to use a maximum of twelve posts per latest news page, otherwise the user may loose interest quickly if they have to continue scrolling down a page. Blue tint used on header images for individual latest news posts, photograph used is the same as the image used on the latest news main page to add consistency and related to the blog post specifically. Image removed from each individual post, as this image was added...