[Zooball] [Zooball Production Journal]

Infinite State Entertainment
Zooball Production Journal
by Senior Game Developer Arthur Nishimoto

Below I have prepared a journal outlining the entire project with emphasis on the programming development. I detail most of my contributions to the project noting Andy's contributions and specific collaborations when in context of the project as a whole. Andy’s contributions in detail can be read here.

I’ve provide a detailed account of the development of the Foosball Prototype that I wrote as a simple program to become more familiar with the abilities and restrictions of using the TacTile and working with mulit-touch as a whole. As I was investigating potential foosbar gestures in detail, the prototype quickly was reworked into the official Zooball build.

While the timeline below will describe the entire process, I'll mention the following highlights from Zooball's development.

 Also for most versions of the Zooball presented is a Java applet (before v0.4) or a video (v0.4 and onward)

Originally posted on the Infinte State Entertainment Wordpress blog.

Overall Project Timeline

Date

Event

Milestone

Documents

2/11

Game groups assigned

2/13

Class

Initial project brainstorming

2/18

Initial touch animation test - Andy

Initial gesture tracking - Arthur

2/25

Meeting 1

Game concept discussion

Meeting 1 Notes

2/26

Meeting 2

Disaster City concept, company roles

Meeting 2 Notes

2/27

Class

Disaster City proposal/presentation

Concept Storyboard

2/28

Disaster City revision

Concept Storyboard 2

3/1

Meeting 3

Disaster City dropped. New concept discussion. Zooball concept created and approved.

Meeting 3 Notes

3/4

Meeting 4

Preparation for Zooball presentaion Friday

Meeting 4 Notes

 Foosball Prototype v0.1

3/5

Basic foosmen/ball collision added. Early touch zone and bar sliding - Arthur

Foosball Prototype v0.2

3/9

Research on game and physics engines and possible Java applications.

3/11

Meeting 5

Physics, game engine, 2D vs 3D model discussions.

Meeting 5 Notes

Foosball Prototype v0.2.1

3/12

Basic collision detection stress test with multiple ball objects - Arthur

Foosball Prototype v0.2.2

3/18

Ball launcher implemented - Arthur

Foosball Prototype v0.2.2.5

3/19

Google Code Repository

Repository created

Link to repository

3/20

Class

Goals and scoring implemented - Arthur

Foosball Prototype v0.3

3/23

Game FSM created in Java/Eclipse - Andy

Repository rev17

Zooball v0.1

3/28

Meeting 6

Artwork discussion First foosmen and ball artwork - Joan

Technical Note: Touch Interface

3/30

UIC Spring Break

Touch Integration in Java - Arthur

Physics Implementation in Java - Andy

Repository rev31

4/1

Meeting 7

First sounds - Michael

Preparation for mid-semester review

Foosbar “Spring” control mode - Arthur

Meeting 7 Notes

Foosball Prototype v0.3.2

4/2

Sound integration in Processing, demo menus

New red/yellow rotating foosmen, additional background artwork, rotating ball animations - Joan

Technical Note: Rotating Animations

4/3

Mid-Semester Demo

Foosball Prototype v0.4

LSU Spring Break

Special game mode discussions

4/11

Looping music, full 360 foosbar rotation and collision - Arthur

Foosball Prototype v0.4.2

Technical Note: Collision Detection

4/15

Debug Console implemented - Arthur

Foosball Prototype v0.4.3

4/17

Conversion of Processing prototype into Java/Eclipse. Issues with TacTile Java export - Arthur

New web site - Joan

4/18

Meeting 10

Concerns about Java export on TacTile, General progress report.

Meeting 10 Notes

4/19

Java code converted to Processing - Andy

Fireball mode - Arthur

Repository rev46

4/20

Booster game play concept - Andy

Menu mockup - Andy

Full conversion of prototype to FSM - Arthur

Zooball v0.6-0.8

4/22

Meeting 11

Physics updates, discussions on user controls and addional gameplay elements

Meeting 11 Notes

4/22

Animal foosmen, stadium artwork - Joan

4/23

Zooball User Interface Study

Overhaul of full bar rotation and control scheme - Arthur

Zooball v0.8.5

4/24

Foosmen throw/catch ability and special balls - Arthur

Technical Note: Special Abilities and Statistics

4/25

Game statistics tracking - Arthur

Zooball v0.9

4/28

Physics implementaion - Andy

Zooball v0.9a (Physics demo)

4/29 - 4/30

Foosmen controls/Physics integration and game menus - Arthur

5/1

Final Presentation

Zooball v1.0

5/5

Final release

Zooball v1.1

Foosball Prototype v0.1

foosball_v_0_1

  • Initial version
  • Basic ball movement and test touch zones
  • Link to applet

Foosball Prototype v0.2

foosball_v_0_2

  • FoosBars, players added. Bar rotation and touch zones implemented.
  • FoosBarManager generates number of player on bars based on number of bars. (3 person and goalie only)
  • FoosPlayers block balls if bar is within -0.4 to 0.4 of rotation value.
  • Link to applet

Foosball Prototype v0.2.1

foosball_v_0_2_1

  • Foosmen block balls and also changes the ball’s velocity on collision.
  • Fixed bars getting permenantly getting stuck in the edge of screen
  • Foosbar slide multiplier added for sensitivity adjustment.
  • Ball can now be directly touched if stopped.
  • Link to applet

Foosball Prototype v0.2.2

foosball_v_0_2_2

  • Screen border added and foosbar can identify if it has hit the edge of the border.
  • Foosmen collision box visible via displayDebug().
  • Ball/bar collision fixes.
  • Link to applet

Foosball Prototype v0.2.2.5

foosball_v_0_2_2_5

  • Ball changed to FSM
  • Turret ball launcher added
  • Added pause button/menu - States for overall program
  • Foosplayer::collide(ball[]) now tracks all recently hits balls and ignores them - fixes collision problems except for rare "corner" cases
  • Link to applet

Zooball v0.1

zooball_v_0_1_loading

zooball_v_0_1_menu

zooball_v_0_1_physics

zooball_v_0_1_paused

zooball_v_0_1_gameover

zooball_v_0_1_gameover

  • Created FSM to handle overall game states
  • Threaded asset loading
  • Loading screen
  • Link to video

Technical Note: Touch Interface

  • The basis of the touch interface is extracting the (x,y) coordinate of a touch from the managed list and checking if a particular object has been hit. The only exception to this implementation is the foosbar.
  • The foosbar are different because in the first implementation, the bar would jump to the position the touch was detected.
  • A finger object was used to track the last finger position. This finger would lag slightly behind the current finger position and the difference between the two would provide the amount the bar would move. (The finger object was originally part of a 5-finger hand interface prototype that was developed early in the semester)
  • The movement of the bar, either up/down or rotation, is dependent on the lag between the finger object and the current touch. Under 60 frames per second, the system would keep up with the touches to fast, that a flick motion would be interpreted as a drag-then-stop. At 30 frames a seconds, the delay was large enough that a flicking motion would be detected correctly and the foosbar has the ability to spin when flicked (opposed to stopping immediately after the touch is no longer detected).
  • Even at 60 frames/sec players could still “spin the bar” by dragging off the touch zone, however most players didn’t realize that and expected a flicking motion would work. A slight modifiction to the foosbar hit tracking and reducing the frame rate to 30, made a “flicking to spin” gesture possible on TacTile.

Foosball Prototype v0.3.2

foosball_v_0_3_2

  • Version 0.3
  • [ADDED] Goals and scoring
  • [FIXED] Minor bugs with collision for ball, foosmen, and goal zone.
  • [ADDED] After scoring, ball is given to other team. Launcher activated - Only tested with one ball
  • Version 0.3.1
  • All classes except Turret have been modified to be independent of variables in main class. (ex debugColor/font, screenDim)
  • [Modified] Turret control revised. Rotate shows direction choice and ball now fires on button release, not press.
  • [Bugged] Revision of Goal class now prevents proper score keeping
  • [Added] Foosman now accepts a single .gif image
  • Version 0.3.2 - Foosbar has optional "spring-loaded" mode
  • [Modified] Turret can be toggled from press to shoot, or release to shoot
  • [Added] SoundManager, Menu Screen for demo
  • [Added] Demo main menu, first sound files, ball accepts a single image file
  • Link to applet

Technical Note: Rotating Animations

Arthur’s rotation implementation:

pushMatrix( );
translate( x position, y position);

if( rotation >= 360 - rotateIncrement && rotation < 0 + rotateIncrement )
image(rotateImages[0], 0, 0);
else{
for( int i = 0;   i < 360; i += rotateInc ){
if( rotation >= i - rotateInc && rotation < i + rotateInc ){
image(rotateImages[i], 0, 0);
break;
}
}// for
}// else

popMatrix();

Andy’s rotation implementation:

pushMatrix( );
translate( x position, y position);

pushMatrix( );

rotate( PI -  (float)direction[current] );
images[(int)(map( (float)rotation[current], 0, TWO_PI, 24, 0 ) + 0.5 )].draw( );

popMatrix();

shadow.draw( );

  • The foosmen and balls were originally going to be implemented as 3D objects within a 2D game field. But as both programmers were unfamiliar with working with 3D graphics, it was decided that the foosmen and balls would be implemented as animated sprites instead.
  • The code developed by Andy to handle rotating animations is more efficient than Arthur’s original implementation that used an array of 360 images. The animations were generated in 15 degree increments. This new version is better suited for the radian angles used in the physics and also allowed for minor scaling in the foosmen.
  • For the ball animation Andy cleaned up the original animations and added a shadow that provided a more fluid rotation animation and a greater sense of realism as the shadow did not rotate with the rest of the animation.
  • Arthur's implementation of the left, Andy's on the right.
  • oldball_vs_newball

Foosball Prototype v0.4 (Mid-Semester Demo)

foosball_v_0_4_opening

foosball_v_0_4_menu

foosball_v_0_4_soundtest

foosball_v_0_4_gameplay

foosball_v_0_4_rotatetest

  • At this point, the game was too large in size (mostly due to the recent artwork) to be exported as a running applet.
  • Temporary menus were created as well as a sound test feature and rotation test. These were added separately as sound and image integration was completed after the deadline to be added directly into the mid-semester gameplay demo.
  • This also marks the first addition of background images. The demo images and its problems with contrast and noise was used as a basis for further artwork design.
  • Link to video (Low framerate due to video capture)

Technical Note: Collision Detection (Pre-Physics Engine Implementation)

                            
collision
  • The original collision detection was created by Arthur. It featured a simple collision box around the base of the foosmen that would check if the ball was within that zone. If it was, the ball would be bounced in the appropriate direction.
  • This has several issues. First was that the collision would be ignored if the ball was moving too fast. Second the collision code itself was very specific and difficult of modify. Third was the possibity of multiple collisions that caused an “internal bouncing” effect.
  • This was corrected by having each bar keep track of when each ball hit in conjunction with an outer “near-collision” box appromately 20 pixels from the actual collision box. This version of collision detection is illustrated above.

Zooball v0.6 - v0.8

classdiagram

  • Version 0.6
  • The Java/Eclipse FSM game states was converted into Processing and integrated into the Foosball Prototype. From this point the protoype was officially renamed Zooball version 0.6.
  • Version 0.7
  • TouchAPI support was restored and additional bookends were generated: pause and main menu screens.
  • Version 0.8
  • Re-integration of all older prototype features like the ball launcher.

Zooball v0.8.5

foosball_v_0_8_5

  • This version was specifically designed to tackle the possible problems with the user interface.
  • Three different control modes were designed and could be easily changed in-game. These control modes were 1) Fixed bar mode, no rotation. 2) Limited “spring-loaded” rotation, and 3) Full rotation mode.
  • This version of the project was used for a user test study.
  • The study consisted of two groups of 4 participants. One group was told the controls, the other was just told to figure it out.
  • Both groups were tested with each of the three modes.
  • The study reported that most users preferred the spring-loaded mode over the others. The full rotation mode was the least favored.
  • In response to this, I merged the reset to neutral aspect of the spring mode and integrated it into the full rotation. Full rotation was still kept to provide the experience of actual foosball.
  • Also minor sensitivity changes to the foosbar rotate and slide were made based on feedback.
  • Link to video
  • Link to user test video (~35 minutes)

Technical Note: Special Ball Abilities and Statistics Tracking

ballfsm

  • Special ball abilities was a challenge since each ball needed a normal, fireball, and fakeball state. Using an FSM format, these specific states was able to convey to a foosbar that it had been hit by a specific type of ball.
  • The fire effect was achieved used the same Particle Manager that has been developed by Arthur for the bug-squish project.
  • The same particle manager was also used for water, smoke, and trail effects.
  • The ball also kept track of the last foosbar it hit as well as the source foosbar (if it has a special state active).
  • The ball keeping track to parent foosbar information also allowed the tracking of statistics at the end of the game.

Zooball v0.9a

foosball_v_0_9a

Zooball v1.0

zooball_v1_0_intro

zooball_v1_0_menu

zooball_v1_0_about

zooball_v1_0_menu2

zooball_v1_0_mode

zooball_v1_0_play

zooball_v1_0_over

zooball_v1_0_stats

  • Integrated physics and redesigned catch/throw ball mechanic.
  • Version demoed for the final presentation.
  • About screen, game mode screen, boosters, and game statistics during the game over screen.
  • Game play video

Zooball v1.1

zooball_v1_1_tutorial

  • Final release version of Zooball
  • Numerous bug fixes with the new physics engine (balls/bars moving too fast and going through wall, etc.)
  • Tutorial fully integrated using pre-recorded mouse movements. A special mouse recorder was developed that recorded the location and pressed status of a mouse cursor.
  • This mouse playback method is used to provide instructions without the use of a full pre-rendered video (which could not be implemented due to Processing/Linux problems). Also this was chosen to be more dynamic than a slideshow or a static image.
  • Overview video (Warning - framerate issues due to recording software)

[Zooball] [Zooball Production Journal]