The document provides details on Joy Buck's process for creating an animated racing game production. Some key points: - Joy created a scrolling background 1200 pixels wide to give the illusion that the cars are moving. Various elements like trees, bridges and tunnels were drawn. - Eight small car templates were drawn in different colors and then each placed on separate layers and animated frame-by-frame to race along the track. - Additional animations were included like cars jumping over rainbow ramps with smoke, driving into water, and lights turning on in a tunnel. - An opening sequence was made showing the creator's initials and a leaf and lightning bolt on a cloud for the game's title of "Flash

1. Production Reflection
Joy Buck

2. To start...
In this project I am going to use the tools and skills that I have learned in
previous projects to make this product. I will use photoshop mainly for this
project. I will first make a background to up scroll to the audience. This will
make it look like to the audience that the Karts are moving. Then I will
make Karts/cars. These will be the same colour as the character the player
will have picked. After, I will make sounds, such as effects and music. These
will bring the game to life. After this I will add opening credits and
selection tools to add more realism as a racing game would have. After I
have finished all of these things, I will combine them in Premier Pro, then
export the product to YouTube to put on my blog.

3. Background

4. Process
Firstly, I have created a document that is twenty times (20x) longer
than the regular document of 120 x 80 pixels (so, 120 x 1600). This is
because I want complete a scroll up background that will fool the
player into thinking the cars are moving when it is actually is the
background.

5. Process
Zoomed in (700%), the project is
ready to paint on, with a pencil.
Referring to my plan and colour
scheme, the colours are perfect of
the background I want to create. I
am trying to create a track/map for
the cars to race on.
I use the pencil tool to do this.
I use all different sizes, depending
on the amount of detail, e.g. I used
the 100-point pencil for the full
background like this...
The pencil tool

6. Process
I stated by filling in the whole page
brown, to represent dirt and mud as
the rainforest has this.
After I found a good point for my
water. I added this in the middle. I
used the 75pt pencil for this.
I wanted to blend these carefully, so
I added grass, with the same pencil.
Then, I used the colours in between
to blend. I used the 1pt up to the
50pt to blend these using colours in
between Blue and Green.
Blend!

7. Process
Then, I used the circular pencil
tool to create the bridge at about
25pt in beige and brown. These
two colours look wooden and that
was the look I was going for. I used
the circular tool to first put a
brown circle down then a white
overlap. I did this until I reached
the other side of the land.
After I added detail like the black
posts (3pt) and the orange rope
(1pt).
This looked like a bridge that little
cars could cross!

8. Process
Then, I went back to the beginning
of the track/map and set up a
start line. The start line was black
and white, like a traditional racing
games. It has black and white
coloured flag/banner across the
top and eight racing placers
before it. I used the 1pt -3pt for
these.

9. Process
Then I added some side adds ( did
not know what to put on them so
I put a lined pattern).

10. Process
Then I added some power
jumpers. I love how vibrant these
turned out. I placed these in a
rainbow coloured arrow formation
in a 3pt pencil. There are about
three of these around the course.

11. Process
I have also added some little
detail around the course. Such as
flowers and mud puddles. These
used the pencil 1pt 10pt.

12. Process
Jumping over the bridge, I have
added a tunnel for the cars to race
through. I used the 25pt to 50pt
pencil for this. My idea was to put
lights on the cars as they when
though. I think that this will work.
I have also used some grey tones to
create rocks that sit on the road and
around the entrance and exit of the
cave. I was happy with the effort I
put into this because I have used
the darker grey tones to act as
darker rock faces. This makes them
look more animated and realistic
(even though, these are animated).

13. Process
After this, I realized I ran out of room on my document, so I
made it twice as long making it 120 x 3200 pixels. This was
enough. I think It will make a long enough race as well.
This was half that I ran out of space on...

14. Process
Then leaving the tunnel I have
added puddles, in different shades
of blue (3pt to 25pt pencil). The
idea behind this being that the
racers would skim in the water
creating a cool effect.

15. Process
After this, I have added some
trees, which I used the pencil size
50 down to 3. I used three shades
of green to draw these. I have
used the three shades to make
the tree look more realistic and
pop out, so the player knows what
it is. I even added brown to look
like bark of the tree.

16. Process
Finally, the finish. This looks some
how identical to the start but has
three times more space at the
end. I can use this wisely as this
can be the ending scene too.

17. Process
Here is the full background...

18. Background Frames

19. Process
Adding the background
was easy for me to figure
out. I used the tweening
tool to add the scrolling
background. I have
animated a scrolling
background before in my
experiments, which
worked well. I learned
from this.
First, I exported the
background as a JPEG file
and placed it into a
standard (80x120 pxl)
file.

20. Process
Then, after I placed it, I stretched the file into its original size (3200x120 pxl). I
then clicked the timeline button and then set it up. I then place the start of
the background on one of the frames and then the end of the background on
second frame. Then placed the tweening button.

21. Process
After I pressed tween this
came up...
I chose 150 frames because it
looked the most appropriate
to make the cars move quick.
This is the tweening tool...

22. Process
Then It turning into a big scrolling background, just as I wanted...

23. Racers

24. Process
For the racers, I wanted to make eight animals and their matching cars, In the
actual race. You will not see the characters; you will only see their co-
ordinating coloured car.
I started making the cars as
a template for the actual
things, this meant all eight
were on one layer in the
game. I used the pencil size
1 pixel as they are tiny.
I started with the yellow
car. Then followed with the
rest...

25. Process
This is what, they finished looking like.

26. Process
Then, I copied (traced) each car on to a its
separate layer, this allowed me to place each
car on each frame.

27. Process
Then I placed each car on each frame, which was a time-consuming concept.
However, I had to make sure that the cars where in similar places to the last
frame or It would not look as realistic as I would have liked.

28. Process
I have added animations within this race such as... The when the cars go
over the rainbow ramps. I have added smoke (which I added with a grey
pencil in 1pt). This was made with two layers on was for when going up
and another added to this to make it look like the car was flying.

29. Process
Another, is when a car drives into the ocean! The car gets taken into the water
by two layers if water. I used the already existing colours to make splashed of
water, to look like the car was taken by the water. I used the 1pt px pencil to do
this.

30. Process
Another animation I have completed is the light tunnel. When the cars go
though the tunnel the lights tun on. For this I have used the opacity feature
on the pencil to make the see though effect on the lights. The yellow colour is
stronger when closer to the car front. I duplicated this seven other times so
each car had one. And then placed them (as I placed the cars and other
objects).

31. Process
The next animation that I have completed is the water skid into puddle. This is
similar to the other water animation that I had created but with one less
layer. I thought this showed that this water was not as deep as the other. I
used similar colours to the background and in a 1pt pencil as this is detailed.

32. Process
The final animation that I have completed is the rocket animation, this was similar to
the first ramp animation that I have created. I have created this rocket as I wanted to
make the game look more interesting than viewers expect. I am going to make the rule
that if a car is left out of screen for more than 10 seconds (as purple was) the rocket
takes you as a power up. This required three layers, the rocket, and the same smoke
used for the ramps.
I moved this like all the other layers to look like it moves up the screen.

33. Additional animations

34. Process
In this part of production, I have made an opening sequence that includes the
name of the make (who made it), The opening scene and selection screens. I
did the best I could in the time that I had. These are the additional
animations.

35. Process
This is a 4 second clip that shows the manufactures stamp on the piece. I have
used my initials to make up this bit. Firstly, used the text tool to type the
three different letters. These were different layers. In size 24 text. After this I
duplicated each letter two more times, totalling up to nine letters. I changed
the colours of each letter to have three letters Black, three Blue and three
Green.
I have arranged these basically
like the rest of the piece, by
moving the letters on each
frame differently so that it looks
like they are moving. This ends
up looking 3d like.
I end up using these colours
later with text thought the
piece.

36. Process
I fade this away with the opacity of the pencil in the biggest size possible. I
used four different layers to make a transition to the opening. On one layer I
press once, it is light and the next layer I press twice, and the colour is
stronger. I do this again until I have four layers that range from a strong colour
to week. Then I press the layers on the frames on after another until the
green colour (I used green because it goes with the colour scheme) is
completely opaque.

37. Process
For the opening scene, I decided to
take my idea to draw a pixel art leaf
and put it in the opening. It was the
best leaf I ever drew! I put this on top
of the faded background. I moved this
as it was on one layer according to
each frame and how the other
objects were placed.

38. Process
Since I had thought of the name Flash Dash, I thought the game could include
a lightning bolt as it says in the word ‘flash’. I also drew this. This grumpy
looking cloud was drawn like the leaf, with the pencil. I used a smaller pencil
to draw detail on it to add a 3d feel to it. In this the cloud and bolt are on the
same layer, but I have also placed another layer with several other bolts to
add the extra effect of lightning in this animation.

39. Process
After the electrocution, the
background instantly turns black
(added with another layer). I then add
the ‘f’ letter in the same shade of
yellow next to the thunder bolt in the
next frame. Then comes rest of the
title moving on from the side (moved
in each closer in each frame towards
the ‘f’.
After this I added a flashing ‘press A
to start button’. In a smaller white
text. I made this flash by turning off
the layer that the text was on, on one
frame and back on, on another. I
repeated this three times

40. Process
Then using the same fading technique as
before I added a grey layer to draw the focus
on to the selection menus. The first selection
menu is about the game mode such as the
easy, medium or hard. I add a title on the top
telling the player what menu it is and three
buttons, easy, medium and hard. I use the
text tool to type out the words as three
different layers and colour these white. I then
duplicate these three (once) text layers and
colour them green. I then duplicate the word
‘medium’ and then colour this blue. To look
like the player is choosing between these
levels, I place the all the words ‘easy’ on top
of each other and then switch the two layers
on and off to look like the player pressed the
button. I do this with the other two words.

41. Process
Like the first selection menu, the second selection menu used the
same technique. It is a car select menu. I placed a big title at the top
of the page like last time and then used the Car template that I made
to trace the cars on earlier in the production. This was perfect for
this selection menu because I didn’t have to make the cars again. All I
needed to do was, like in the last menu, to add 8 identical small
squares under each car (each one with its own layer created with the
shape tool). These where grey. I duplicated four of those squares and
turned them blue. I then lined up each grey square under each car
and then in the next frame I used one blue square under one of the
cars to look like the player is picking between the colours of the cars.
By this I mean tuned on the blue square that is placed on top of one
of the grey squares. I continued to do this to two other cars before
going the red car, our chosen car. The red car’s grey and blue squares
where laid out the same as the others, but I did something different.
I wanted the player to look like they are selecting the car, so I added
in a frame (after the blue square shows under the red car) that just
has grey squares and then followed by a frame that is identical to the
one that came before the last. This would create a flash motion.

42. Process
Next, I have created a quick ready (couple of frames) warning sign, to tell the
player it is going to start and ask them if they are happy with their choices
that they have made. This part starts with white text coming in from the side
in three frames, of course placed to look like it is moving. After I add smaller
green text to tell the player to press to start. I add blue text in place in the
next frame to look like the player selects it. I duplicate those two frames
once, so it has a flashing effect. This finished by fading the next four frames
into black (as done in the opening).
The ‘press a’
frames repeat.

43. Exporting the video(s)

44. Process
To export my videos (I had two videos my opening credits and the actual
game) I had to first make sure that the image size of the video was correct. I
changed pixels to inches making sure it was the size of YouTube’s required
document size (1080 x 720). To do this I went to image and then image size.
Then I exported my videos. To do this, I went to file, export and then render
video. This then popped up...

45. Process

46. Process
Making sure everything was how I wanted it, I pressed render. This took about
two minutes. I did this twice as I was going to put the whole document
together in Premier Pro.

47. Sound effects/Music

48. Process
To start creating my sounds, I need to figure out what exactly I needed to
create, I knew I what I needed from my plan, so I used this. I wanted to create
the audio in order, so I stated with the opening of the piece.
This was my manufactures approval on the game (my initials). I needed a
sound for this. It needed to be short, so I counted how many seconds it
lasted. This was how long the sound lasted. This was created in garage band. I
used the sound of the electronic drum kit as a build up and then I used some
synth to release the build up. It also sound like the logo sets itself into place.
I used the piano keyboard as this was most useful.

49. Process

50. Process
After this, I move on to the next
sound. Opening theme. This is the
leaf, lightning bolt opening. I wanted
something that sounded like thunder.
I found the best sound that was close
to sounding like thunder. This was on
Beep Box.
After getting used to this website it
was easy to navigate. This was where
I had customised the sounds. You
could do this to any of the four
coloured blocks.

51. Process
This was the rest of
my opening piece; I
made the beat on all
the instruments used
play from high to low
as this shows the
mood when the bolt
comes into the
scene.
This was the grumble
noise.

52. Process
Next, I needed to make the music for the two selection screens and the
‘ready’ screen. I made this on Garage Band. I knew how long this music would
be as I had counted how long the section of these three screens are all
together. I wanted on instrument that sounds positive and brings the focus on
to the options. Therefore I chose synth, specifically the classic house organ. I
made the rhythm simple for the same reason of focus. There are only two
chords played on after another and repeated three times as the part of the
game is not very long.

53. Process

54. Process
After that, there were the selection noises. These are the noises that sound
when ever the player presses a button. I tried to do a variety of sounds so
that I could split this track up later in Premier Pro. This included the electronic
drum kits such as Deep Tech and Boutique 808. These drums were good for
unusual sounds and some even sounded like computer clicks. I played these
at different tempos so that if I had fast clicking in my game, I could use them.
I could also use these sounds as transitions between screens if I wanted to.

55. Process

56. Process
Next, I made a start of the race noise. This was the sound effect that signalled
that the race was going to start soon. This was a short noise and was made
using yet another synth instrument, the Power Fifths. I made this noise
accelerate to make the player excited to race.

57. Process

58. Process
After, I made the pointer noise. This was the noise which described the
pointer which was the players car, red of course! Like other sound effects and
noises, I had counted the visuals of the pointer and how long that It was
doing it for. It was three quick clicks, this was perfect.
I used another electric drum called the Dub Smash for this noise.

59. Process

60. Process
Now it was the turn of the traffic light. The traffic light was the signal to the
player that the race was starting in less than 3 seconds. I had used the electric
drum sound for this, called the Mega Crush. This sounded like a horn, but I
matched it to the lights beat. They were barely three seconds.
I also used the controls at the bottom of the screen to make the sound more
hollower sounding.

61. Process

62. Process
Then, I created music for the actual race itself. I created this after the traffic
light sound as I was going to play this music after the race had started. I
continued the same organ instrument as I had used for the selection screens.
This added some similarity between tracks. As I have done many times, I
counted the time of the race and that would be how long the music would be.
I have done this music in four parts of speed/tempo. I played a lower beat
with three keys and then stopped recording. This was only one little 3 beat
tune. I then apple looped it, (you this by dragging the end of the tune as far as
you would like) I did this four other times. I then, kept playing the same 3
beat sequence but higher up the keyboard. I apple looped these like I did with
the first.
I then added a back beat to add more to the piece as it sounded a little too
simple. This was just a drum kit, Soul Cal, which played after each 3-beat
tune.

63. Process

64. Process
Then, the engine noises were created. I wanted to make only the car that the
player chose make the engine noise. This was what made this noise quieter
than intended. This noise was made by a synth called Agile synth bass. I used
the time that I had counted for the background music as these two tracks
were going to be place on top of one another. First, I made a drone, the same
engine noise over about 15-18 bars of music. After this, I added a shorter
drone as the same instrument to double up the sound and make it sound
bigger. Then, I added two other, of the same instrument to make acceleration
of the car to make it seem like it is going faster.
I then used the control panel at the bottom to make the sound more buzzier
and engine like.

65. Process

66. Process
After this, I had made a sound for how the car is placed in the race (e.g. 3rd ,
1st ,5th ...). This noise will sound when the car changes position. It was made
by the synth called the Chime Chords. It is only one sound that has a little
reverb and an effect on the player as they will now pay attention to where
they are placed in the race.

67. Process

68. Process
The next sound I created was a drum roll as it was the end of the race and the
trophy was about to be won. I created this on Garage Band. I used the sound
of the Soul Cal drum (this was the only drum available apart from electric). I
counted how long this scene lasted and made the drum roll this long. I
doubled this up with a duplicate of the same drum roll and ended it will the
cymbals crashing.
I have also made the toms and cymbals more hard sounding in the control
panel.

69. Process

70. Process
After this, came the game over logo. I wanted to make this sound more of a
negative sound than positive. I used the sound of the synth, Emotive Pulse. I
created a basic tune that is three notes going lower down the scale of the
keyboard.
I also added a little reverb to this.

71. Process

72. Process
After, I needed to create some music for the restart screen. I wanted it to
match the rest of the game so, I used the synth, Classic House Organ. I made a
basic three beat sequence. This is a positive beat, makes you think. I backed
this up with an electric drum kit, the boutique 78. This add I little more
texture to the piece.

73. Process

74. Process
After this I needed to make some sound effects to the game. I first created a
noise for blinking. This meaning, if a car had crashed and needed to be
reborn. This sound is for that. I created this in Beep Box. I used the triangle
wave sound, it sounded more video game like. I made the note flow in a wave
like pattern as this sounded more optimistic.

75. Process
Next, I created the sound effect that was the sound of the car going over the
rainbow ramp. This was made in Beep Box again. I created this sound with the
Ukulele instrument. I made the sound higher at a quick tempo. This made it
sound like the car was jumping.

76. Process
I then created a splash. This was the splash, where the yellow car falls into the
water. I made this sound with three different various electronic drum kits. The
Neon, Seismic and Modern Club. I created a simple tune and duplicated it two
more times and put it into the other two drum kits. It was crazy how different
the same tune sounded in different instruments.

77. Process

78. Process
I then
created a
separate
splash. I did
this with the
same tune as
the other
splash and
took the
middle tune
out so it did
not sound
the same.

79. Process
Last but not Least, I created a rocket sound effect. This was for the rocket that
the purple car got to become first place. I had completed this on Garage
Band. I made a warning sound to warn the other drivers and the player that a
rocket is coming. This noise was made by an electric drum kit, Big Room. It a
sequence of the same two beat four times. I then created the actual rocket
noise. This was created once again by a synth, the Wobble Buzz Bass. This
sounded exactly like I had in my head. I held it down to create a drowning
effect for 5-6 bars.

80. Process

81. Putting it altogether

82. Process
Firstly, I created a new document on Adobe Premier Pro. This was to make it
into a video to place on YouTube. I then imported the two video clips into the
document…

83. Process
Once all these clips were into the
Premier Pro document, I placed the
two videos into the layout I had
wanted. The opening screen of the
game and then the actual game. Then
I had placed the sound. First the
music. The music of the opening was
harder to place where I wanted
because of the length. I made this too
long. I figured out how to place this in
a way that It would work. Here’s how…
This is the razor tool ...
The original clip cut down.
I had used the razor tool to cut up
the clip
Remaining clip
with the
grumble of the
thunder.
Rest of the
clip.

84. Process
I then placed the other music without a
problem. Then placed the sound effects
starting with the opening logo sound
effect. This fitted in.
I then placed the other sound effects,
such as the clicking noises. I placed each
clicking noise when the colour of the
button indicated clicking. I split up this
track as it was a track full of clicking
noises. But, I only ended up using the
first noise and then copy and pasting it. I
also, used the last noise in this track as it
was used for the ready noise indicating
the layer has pressed the button as they
ant to race.
The clicking sound effects
separated from the original track.

85. Process
I then did a similar technique with the sound effect of the placement of the
cars. I had to copy and paste a lot of the same track and then place them
where was necessary.

86. Process
After placing, my sound effects and
music. I thought to listening to it for
the first time all together. Then I
discovered that the volume on the car
placement sound effect was too loud.
I found how to turn it down. I turned
this down to about -9 when it was on
3.
It is audio one that I was looking at.
(right now it’s paused that’s why
there's now sound waves)

87. Process
After I was happy with my video
game, I went to go and export it.
This is how...
I went to file, export, media. Then it
comes this pops up... (Next Page)

88. Process
This is the export
settings. I makes
sure to change the
title and where
the piece is saved.
This is highlighted
in the blue writing.
Then I make sure
the format is
H.264 and then I
change the
present to
YouTube 720p HD.
Then press export.

89. Process
Now, the video is in my files and I have put this on YouTube and then
embedded it in my blog so that you can mark it. This piece took a while, but
this process log should show everything that I have done to get this far.