Development

This page is to demonstrate my development process.

After looking at different ideas and inspiration for my interactive project, I am now going to develop further and create some digital artefacts to demonstrate my thoughts.

As we saw before on the Research page, I have been to the quarry and taken lots of photos. In order for these photos to be of more use, I will take some of them and create visualisations of how I imagine the paint balling centre to look like.

The image below is a mock up of what the paintball site would look like. There would be the paintball inflatables situated around, providing a moveable layout of cover for the players that can be re-arranged depending on the event hosted. The inflatables provide a safe environment for the players.

SONY DSC

As you can see in the image below, there is a flag on top of a mound of gravel. This is to demonstrate how one of the game modes ‘capture the flag’ would work at the quarry.

SONY DSC

The image below also demonstrates another location for the flag to be in the quarry. The players would have to travel across the quarry from one side to the other with the flags in order to win. This is just one demonstration of a game mode in the site. I am using these images to show how the quarry would be a great location for the paint balling, attracting the target audience to the Jurassic Coast.

SONY DSC

I will be further demonstrating my ideas through the use of  3D animation and video editing. For this, I will be using the programmes Cinema 4D and Premiere Pro. I will show how I go about creating the videos step by step using screenshots.

This is the first step I took with the animation. I needed to make a curved screen object so I created a cube and sphere, stretched them and inserted them both into a Boole object to make the sphere disappear leaving a chunk missing from the cube. A long winded method of creating what I want, but I got the exact results I was looking for.

Screen Shot 2013-12-10 at 11.01.38

The image below shows the curved screen object I created from this process. The reason it needs to be curved is due to it being pressed against the paintball mask. The mask is curved so the screen needed to be in order to rest on it. This screen object will be used to demonstrate the HUD in the mask.

Screen Shot 2013-12-10 at 11.02.22

This shot below is when I was creating another boole object and cutting out holes to make it look like a mask. This proved to be tricky and didn’t get the results I wanted so I set about looking for an alternative method.

Screen Shot 2013-12-10 at 11.32.21

The image below is a shot from when I created a lens to simulate the mask. I created the lens on photoshop and extruded it in Cinema 4D. I also added a tint to the lens to show that we are not looking through a hole and there is glass in front.

Screen Shot 2013-12-10 at 11.54.38

This image is to demonstrate the view through the lens. As the screen would only be on one side, I only needed to demonstrate the right lens. I therefore removed the other half of the lens.

Screen Shot 2013-12-10 at 11.56.41

This image below is to demonstrate the process I went through to place the screen on the curved glass. It needed to be placed so the user would be able to look through and see what’s in front of them as well as being able to see the screen. The research I looked at show that a screen that far from the face would look like a 14″ screen about 2 feet away from your face. This was perfect for what I wanted.

Screen Shot 2013-12-10 at 11.57.54

In the image below you can see me adding a hinge to the screen, showing how it is connected to the lens. The screen is therefore completely in front of the user’s eye and not covered by the corner of the lens at all.

Screen Shot 2013-12-10 at 12.00.18

The images below show how I went through adding materials and colour to the objects. The mask would be green to go with the outdoor theme. The outer casing for the screen would be black.

Screen Shot 2013-12-10 at 12.29.55 Screen Shot 2013-12-10 at 12.34.29 Screen Shot 2013-12-10 at 12.47.55 Screen Shot 2013-12-10 at 13.20.05

In order to promote the mask I wanted to make the animation have moving parts in the mask. I then added pivot points to the screen so I could rotate and connect it to the mask when animating. I would then later add sound to match the movements.

Screen Shot 2013-12-10 at 13.26.27 Screen Shot 2013-12-10 at 13.26.39

The first render! Messing with settings to get the best result possible was time consuming but worth it in the end.

Screen Shot 2013-12-10 at 13.44.27

Due to only having the trial version of Cinema 4D, unfortunately I can only render in 800×600 resolution. The promotional video will still be effective none the less.

After rendering the mask video, I now needed to create the animations for the HUD.

The image below shows a 2D version of the quarry and it’s layout. The brown circles represent the inflatables dotted around as obstacles (and cover). The red dot marks a flag (which would have a rfid tag inside it). The players would be able to see where the flag was at all times by looking at this map due to it being tracked. I made this image on Photoshop and it directly represents one of the quarries from a birds eye view.

Screen Shot 2013-12-10 at 15.47.51

The image below is in Cinema 4D and is a plane I made to represent the terrain of the quarry. I would later add the photoshop image on top to give a 3D look and more realistic feel.

Screen Shot 2013-12-10 at 15.47.40

This image below is when the map is layered on top. As you can clearly see, there is a texture to it and adds realism. The players can see the dips in the ground on their maps.

Screen Shot 2013-12-10 at 15.48.01Below is a demonstration of the map from a flatter perspective. You can see how the ground looks and it directly represents the quarry. I will later on add the player arrows to represent their location with respect to yours. This means you can see the other players and where they are at any time while paint balling.

Screen Shot 2013-12-10 at 15.56.20This image below was me testing whether or not to add physical 3D objects in the middle of the map. I decided this didn’t work as well as I hoped so removed them. This is due to the objects potentially blocking players’ arrows and therefore defeating the object of having them there in the first place.

Screen Shot 2013-12-10 at 16.01.57The image below is demonstrating when I started adding the players’ arrows to show their location. I coloured them blue to make them stand out on the green map. They also have a bump on the back of them to show what direction they are pointing in. There are 2 flat edges and one rounded. I will later animate these to demonstrate how they would look in the real life situation on the HUD.

Screen Shot 2013-12-10 at 16.22.27Here I have added more of the arrows, pointing in different directions. The red arrow shows a teammate that has ‘died’. They will turn off their masks, which cancels their location transmission so other players know that they have died. This is so that if a player has a flag, the other players can know that they need to take over and retrieve it and the flag isn’t just left on the floor.

Screen Shot 2013-12-10 at 16.25.44The image below demonstrates me animating each individual arrow. I needed to keyframe each movement and rotation to give a realistic feel to it, much like a video game.

Screen Shot 2013-12-10 at 16.43.51This image below also demonstrates another path of an animated arrow.

Screen Shot 2013-12-10 at 16.59.20After I animated the arrows, I rendered the video and put it into a new Premiere Pro project.

I also rendered the animation from a different camera view (3D perspective), to demonstrate how the paintball players can change modes on their HUD to what view they prefer.

The next part of the project was to make the ‘Buddy Tracking’ animation, to demonstrate how the players can spot their friends with relation to their head movements. This was also made in Cinema 4D and featured a lot of objects arranged and moved with keyframes. A very simple and easy animation which affectively shows another aspect of the HUD.

Screen Shot 2013-12-10 at 17.51.05

Below is the rendered video of the buddy tracker.

I also made a team score sheet as another menu option on the HUD. I made this image using Photoshop:

Screen Shot 2013-12-11 at 13.04.01

After making all these menu options I realised I needed to include the Time, Player audio and Paintballs remaining to the HUD. I decided to make these in the same place across all of the menu options so I added it to the top of each screen using Photoshop and Premiere Pro.

Screen Shot 2013-12-11 at 13.04.19

Here is a screenshot of how this looks now:

Screen Shot 2013-12-11 at 14.16.08

The paintball HUD would be useless if you had no control over changing the screen so I created a button the user’s would wear round their wrists. Press the big red button and the HUD will change menu to the next one in the cycle. So for example, you are looking at the 2D map of players and want the 3D one, press the red button once and the menu changes to the 3D menu as that is the next option in the menu cycle. Press the button again and you are taken to the Team Score sheet, which updates as players kill and die.

Here is the front end of the button:

Screen Shot 2013-12-11 at 14.08.52

The next stage of the project was to finalise all these animations and images and create a promotional video. The image below demonstrates me creating the introduction to the video. I created the words and animated them to dramatically fly towards the screen. I will render each section individually and edit them together with Premiere Pro.

Screen Shot 2013-12-10 at 19.47.55

Here is the edited clip of the title sequence I made:

As you can hear, I also added sound effects to add to the dramatic effect of the titles flying forward.

The project will now continue onto the Final Product page.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s