development: resources
wrok / clients
flash games
flash projects
web sites
client list
 
Development (R&D)
resources
current development
 
about artifact interactive
contact

How Flash Golf was built


This is the basic process I followed in developing the game:

First Note that flash golf was built in Flash version 4

Part 1: Build the top view version of the game - this was about 1/4 of the development time.

This is reasonably straight forward - you need to record the co-ordinate of the hole and ball.

Every time the player hits the ball you make a calculation based on the strength of the swing, the club and the direction - to work out where the ball will end up and then animate the balls movement. You keep a track on the distance between the ball and the hole and when this is zero - you know the player has knocked it in!

This can all be done using basic trig functions - the only problem is that flash 4 doesn't support trig or even squareroot - so you will need to hand code trig algorithms. Actually since I developed this a few developers have provided trig libraries for flash 4 which saves a lot of time - check out http://www.moock.org/webdesign/flash/ or the Macromedia support site.


Part 2: build the player.

I videoed a golfer doing a few swings and puts
I then brought the digital video into a video editing app - and pulled out key scenes - to represent the swing - eg: for a swing I had about 300 frames - but many of these looked the same - I pulled out about 16 key frames.
Each scene was exported as a bitmap - and brought into fireworks 3 - I masked and removed the background, cleaned up the edges and exported as transparent png images which were brought into flash and sequenced up as a movie clip

( the other graphic elements were just done with a digital camera - except the trees which are from a object library)

Part 3: Build the main 3d perspective of the course.

This took ages. There is no easy way to set up a true 3d environment in Flash 4 ( no quads, slow trig etc) - so the illusion of a 3d world had to be created.

The way I achieved this was to first remove any upstanding objects - so there are no trees on the course only in the background. The only upstanding objects are the flag (which is resized based on proximity) and the player - who is always the same size). That simplified things a little as in eliminated the need to work out ball/tree collision detection.

But the problem still remained of showing the flat elements (hole, green, sand/water trap). Its easy enough to draw these -but how do you distort them based on the players location (ie: the fairway will look different if I am standing right in front of it, than it would if I was standing to the left of it, or if I was standing half way down it). The ideal way would be to apply quad transformations on a coord matix of each element - but flash only supports the very simple xscale and yscale transformations. So the work around I used was to plot the top view map onto a disc (with the hole at the center of the disc) in an external graphics app. I then imported this into flash and made it a movie clip. To then give the right perspective for the players location - I apply xscale and large yscale and rotation transformations on this movie clip based on the angle and distance of the player from the hole. This worked pretty well (with a few minor adjustments) to give the illusion.


Part 4: ball flight and testing

I then plotted the 3d ball flight on the main area - ie: so when you hit the ball you see it fly off into the field.

This again used some trig to work out where the ball would go, where it would land, etc. Because of the changing perspective as you get closer to the hole - this involved a lot of testing and a few work arounds.

And thats how it was done.

Back the main Development : Resources page