Friday, 31 May 2013

Developing the Crosshair

From my initial Crosshair development I ended up deciding that I wanted to create a crosshair that was simple in it's design yet unique. Therefore when I was drawing up my various ideas I tried to keep my sketches geometric and easily interpeted by others. In the final stages of my drawing I highlighted a few designs that I preferred and was going to develop further in Photoshop. So when it got to working in Photoshop I did two designs that were heavily focussed around the simple shape of a circle.
The image to the right displays the 2 final outcomes I ended up with, one with 4 crescent moons focussed around a circle and another with 4 banana-like shapes. I think for my final game I'm going to choose the crescent design as the 4 shapes resembles more of a hidden circle than the banana design does. Additionally I find that the crescent design is more coherent with conventional crosshairs found in all types of video games. For example, the image to the right displays the UI from Team Fortress 2, the game designers there decided to go for a more simple approach to their crosshair with a circle that has 4 spaced out segments removed, resembling an invisible X-shape through the circle.

Now in order to implement the design within Unity I needed to have a script that would hide the default windows mouse cursor and replace it with my design within the game. Additionally I needed the new design to act the same as the default cursor by following it around wherever the user would move their mouse to. Whilst trawling around on the interwebs I found a script that could be attached to the main camera (so it used the 2D GUI plane) and used a variable to display any design I wanted for my crosshair. The key issue though was that it was optimised for a set screen size but I personally wanted it to be more flexible around any size the game may find itself at. Therefore I changed the math.clamp for the position of the mouse to start at the top left of the gamespace and be the width/height of the current screen size. The image above shows the code that I used for the crosshair to be put within Unity.

No comments:

Post a Comment