We had to design and create a heads up display for a racing game. I have already done all that I need to on the sketch/development part of this coursework to create a speedometer and three logos for all the teams.
Speedometer Finalization: Computer designs
I had decided on doing the ‘all-in-one’ design as it looks very neat, professional and displays information well. I have also been keen of my other circular speedometer shape design as well. I will show now how I created the final speedometer step-by-step.
- I first started with a circle and added a black-to-white gradient colour to it. To get the prongs equal distant apart, I did mathematics to get 41 white lines in an arc around the circle. Using the maths, I used the ‘polar grid tool’ and created a grid with 100 ‘radial dividers’. I deleted the 59 other lines that I weren’t using and used the surviving shape as guidelines to get even lines around my circle. I gave the lines varying lengths and thicknesses to leave with 11 main big lines to annotate with numbers. I created a base in the centre of the speedometer to act as a needle rest and gave it a red border.
- I created a grey arc all the way round the speedometer using many shapes and minus-ing them with the ‘pathfinder’ tool leaving me with an almost accurate grey border around the dials. I didn’t like the round caps that were on all the lines of the dial so I turned them to having no cap on the end of the line. Last of all, I added some text (found in all car dials) to the circle. (RPM, x1,000)
- I added 11 numbers from ‘0’ to ‘11’ to the 11 main white lines. I then added more text (MPH) to the circle, underneath the needle rest. This will be roughly where the current speed will be put. Next, I created a red little strip to the end of the dial to simulate to shift up, otherwise you will stall. I then tried to theme everything with a blue colour.
- I added two boxes, one under the MPH text and another above the needle rest. The smaller one will show the current gear (and when to gear up/down) and the bigger box will be for the current speed. Also added a basic needle that displayed the revs.
- The final picture was an addition of a boost bar to the left of the current circle. It extended out of the main circle. The bar was given a blue trim (to add onto the colour scheme of the speedometer) and two red bars. The brighter one simulated the boost remaining while the darker one was simulating the depleted boost. I added a gear and the speed onto the speedometer to complete the look. I also took another picture to simulate the game mechanics of customisation. Going to a place to spend in-game money to change your boring old speedometer.
Logo Finalization: Computer designs
The logo designs were straightforward as I came up a neat backstory for each team at the start and stuck with it. I might have developed more logos for the UI, but this was adequate enough. I will show now how I created each of the logos for the different difficulty. Starting with the ‘easiest’ one first.
‘Easy Mode’ Logo
- I used the shape of a helmet as a guideline when drawing the thick ‘G’ like line that acts as the size of the helmet. Then I created a black helmet visor that acts as the straight line of the ‘G’. The circle around the logo is the size requirement to fit behind the speedometer.
- I added three small stripes on the left side and half of a dividing line just below the G-helmet.
- The rest of the dividing line was added as well an impression on the face of the helmet.
- I added a ‘flame decal’ to the helmet as it was looking too bare. I used the ‘pen tool’ to draw around it and adjusted with the ‘direct selection tool’ or the white cursor tool to re adjust any points that were off the guide that I was using. This is the final Black & White version that I could use behind the speedometer.
- I added some helmet colour to my design. The Trim at the top of the helmet goes from yellow-to-red. The main helmet goes from dark-blue-to-white. The decal has the same yellow-to-red gradient used in the helmet trim.
- I coloured the background around the helmet so it looks like an arcing gradient from dark-blue-to-white. The background gradient messed the helmet gradients up so I had to recolour the gradient to dark-blue-to-light-blue. The helmet trim was adjusted to so it wouldn’t mess the background colour up or leave a noticeable colour difference.
‘Medium Mode’ Logo
- I didn’t want to go for a realistic looking tiger, (due to me not simply having the patience and the art skill to make it look good) so I instead made a cartoonish looking tiger instead. I added face features and ears to create a very unimpressed looking dog.
- I coloured in the tiger’s face (with a gradient) and added eye shadow to its eyes. I introduced some lines to make it look more stripy but instead made it look like face paint.
- I enlarged the tiger and added some face paint on the cheeks of the tiger. I coloured it accordingly and also coloured in the ears as well.
- I brightened up the tiger face and added red lines to simulate danger. This is the final coloured logo design. I call it the rare-spotted DerpyTiger.
- I made a special black and white design if a colour one looks off when put under the speedometer.
‘Hard Mode’ Logo
- I created the initial shape of the skull using a guideline, many shapes and the ‘pathfinder’ tool to merge all the lines into a solid skull shape.
- Added the bone line near your eyes. I also added the empty holes where the eye is supposed to be located.
- Added the jawline and the shape of the bone in your nose.
- I individually created and repositioned these teeth to make it look ascetically pleasing. To make the teeth, I made a circle with the ‘ellipse’ tool and used the ‘direct selection tool’ to curve it to create teeth that I was happy with.
- I repositioned the skull in the centre of the circle and created a machete that looks like it is driving right through the skull. I didn’t add blood droplets as it is unnecessary to the logo and would add gore that didn’t need to be there in the first place.
- On the opposite side of the machete, I created the barrel of a machinegun that is going through the skull.
- I added the rest of the machinegun, adding all the detail and impressions of the gun as well. This is the final black & white one to act as a backup.
- I coloured the skull, machete and machinegun in real life colours. I used some gradients that came built-in to simulate wood grain patterns. Also added gradients in the eye, nose and background of the work.