Five Thousand Beta1 Screenshots
Click on the thumbnails to see a larger image.
Thumbnail |
Description |
|
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.
|
|
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.
|
|
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).
|
|
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?
|
|
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 |
|
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.
|
|
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.
|
|
Notice how the plus button has a mouseover effect--the
plus gets surrounded by a yellow glow.
|
|
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.
|
|
Once the PROGRESS wiget reaches 100%, the "Next Panel"
BUTTON is enabled. This is another example of on-screen
widget interaction.
|
|
Now that the "Next Panel" BUTTON has been enabled,
it has a mouseover effect.
|
|
Clicking on the "Next Panel" BUTTON brings up a
new picture, indicating that the button is currently in the
"clicked" state.
|
|
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).
|
|
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.
|
|
In this screenshot, we used the keybad numbers to move
the CAMERA (i.e. the point of view) toward the
3D explosion textures.
|
|
Getting closer...
|
|
...even closer...
|
|
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.
|
|
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 |
|
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.
|
|
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.
|