Contact Us      Site Map      Search
Home Screenshots Five Thousand

Page Contents

Five Thousand Beta1 Screenshots

Five Thousand Alpha2 Screenshots

Five Thousand Alpha1 Screenshots

Five Thousand Beta1 Screenshots

Click on the thumbnails to see a larger image.

Thumbnail Description
Thumbnail

This screenshot features Five Thousand's first Panel (i.e. screen). It's pretty simple, including some text (the LABEL widget) and a poor 3D rendering of a table. Heard but not seen at this point in the game is some nifty music. The pressing of the Space Bar or Enter key is detected thanks to some improvements to the Panel Configuration Files.

Thumbnail

Up to 6 players can play head-to-head. Player names can be entered via the INPUT widget. This widget took a lot of effort to create, and went through many iterations. It also required us to completely re-implement the KEYBOARD class. As it stands, INPUT is very elementary, as it only supports letters, and the shift, dash, apostrophe, space bar and backspace keys. In this screenshot we also see our first BUTTONs. It may not be obvious, but we're using transparency to round off the corners. All in all, we've done an amazing job with the buttons.

Thumbnail

Now the wonderful game dice appear. We were really lazy when it came to animating these. :p We had planned all sorts of fanciness, and in the end we gave the dice only 6 different static orientations, and an up or down position. Nevertheless, Five Thousand neatly illustrates the decent job we did with the Model View Controller (MVC) architecture. The user interface you see here neatly keeps track of the internal game state, such as the face values of the dice, the names and point scores of the players, and most importantly the logical state of the game (e.g. in this screenshot an OK button is displayed, as opposed to Roll or Steal).

Thumbnail

Here we see that the main gameplay buttons do indeed change depending on the logical state of the game. In this example, the current player (a fictional person named Jonathan K'Tan--getting the INPUT widget to accept dashes and apostrophes was harder than you'd think) must now decide whether or not to pass play along to the next player, or take a chance and try to accumulate more points. He should probably click on End Turn, but hey, who am I to judge a fictional person?

Thumbnail

Now that Joel has beaten K'Krick in this screenshot, all that's left to do is to quit or start a new game. Five Thousand plays pretty quickly for 2 players (maybe 20-30 minutes), but it takes longer for more players.

Five Thousand Alpha2 Screenshots

Click on the thumbnails to see a larger image.

Thumbnail Description
Thumbnail

This screenshot depicts the demo's default Panel (i.e. screen). The panel's background is a picture of Montreal's Bishop street, right next to Concordia University's library building. In the top left corner you can see the current frame rate written in red. At the bottom right is an animated SPRITE widget, displaying 6 different frames (one for each side of a standard die). At the top right is a disabled BUTTON widget. Just to the left of the button is a PROGRESS widget, and underneath that are two active BUTTONs. The image of a burly bouncer is a 32-bit transparent PNG file. This is evidenced by the fact that the bouncer is not a rectangular image.

Thumbnail

Here we confirm that the BUTTON in the top right corner of the Panel is disabled. A disabled BUTTON doesn't have any mouseover effect.

Thumbnail

Notice how the plus button has a mouseover effect--the plus gets surrounded by a yellow glow.

Thumbnail

By clicking on the plus button, the arrow (a PROGRESS widget) begins to get filled in. The minus button would empty the arrow. This is an example of communication between the on-screen widgets. By the way, the picture used for the arrow is also a 32-bit PNG file that supports transparency.

Thumbnail

Once the PROGRESS wiget reaches 100%, the "Next Panel" BUTTON is enabled. This is another example of on-screen widget interaction.

Thumbnail

Now that the "Next Panel" BUTTON has been enabled, it has a mouseover effect.

Thumbnail

Clicking on the "Next Panel" BUTTON brings up a new picture, indicating that the button is currently in the "clicked" state.

Thumbnail

As advertised, the button leads us to a new Panel. This screen features some of the same widgets as before, with the addition of some 3D transparent explosion images (once again courtesy of 32-bit PNG files). There are five explosions already on the screen because this Panel ran an initialization script (a new feature of the better panel configuration files we've developed in this release).

Thumbnail

In this Panel, the plus button adds more explosion images. Notice how the OpenGL Depth Buffer ensures that far away objects are drawn behind closer objects.

Thumbnail

In this screenshot, we used the keybad numbers to move the CAMERA (i.e. the point of view) toward the 3D explosion textures.

Thumbnail

Getting closer...

Thumbnail

...even closer...

Thumbnail

You can see that the explosions overlap in a rather pretty fashion. We're still working on how to draw 3D textures so that visual glitches don't crop up occasionally.

Thumbnail

Here we've canted the camera angle, so you can see the textures' 3D nature. They're 2D images in a 3D world.

Five Thousand Alpha1 Screenshots

Click on the thumbnails to see a larger image.

Thumbnail Description
Thumbnail

This screenshot illustrates our first major breakthrough. Since the Alpha1 release, on-screen interaction via buttons (and other widgets) has been possible. In this example, the user is prompted to click on the + and - buttons in order to make 3D images appear and disappear.

Thumbnail

This picture represents our second major breakthrough, and the last step toward releasing the Alpha2 build of Five Thousand. What you see in this image is a 32-bit PNG file displayed on the screen with its transparency information intact. Typically, transparency is achieved with a technique called color keying (where a specific image color, usually green or magenta, is chosen to appear transparent). In this screenshot you see the rendering of an alpha layer to achieve transparency, compiled under CodeWarrior 7.0! PNG is one of the few file formats that supports an alpha layer, and it offers great lossless compression too.