Monday, June 9, 2014

Full Project Report Post #19

Scrounge World Game
Clay Francisco & Zach Kamerling

Code Repository

Document Repository






Abstract. We discuss the idea of a web based real-time strategy game. Our main implementation points that separate this from most real-time strategy games is the client/server architecture combined with a fairly unique user interface. We attempt to highlight the benefits and difficulties of bringing a real-time strategy game to the web. We show that real-time and computationally expensive games can be made in the Haskell programming language and illustrate how painful it can be to make 3D games for browsers. Furthermore, we discuss what we plan to accomplish in the future to advance tablet gaming and the real-time strategy genre.

1 Introduction

First we discuss the history of RTS game architectures and UI's and how they have evolved over time. We discuss the benefits and complexities of the current model. In Section 2 we give a brief overview of the project and specify what it's composed of. Then we go on to explain the projects goals, its target audience, the server's architecture, and the client's architecture. We end by stating the current status of the project, what conclusions we can draw from our time working on it, and what we would like to do in the future.

1.1 The RTS Problem

Mobile games are a huge part of today's gaming market and yet are still missing a catalog of strategically rich RTS games.   The current mobile market is choked with Tower Defense clones (for reasons I will examine later) that systemically replace creative gameplay with extreme graphic content (either cutesy or violent, sometimes even both).  What I find most interesting is that the audience supports this kind of re-skinning of the same game i.e. guy “A” plays “Zombie Doom-Hut Defender”, while his 9 y.o. kid plays “Candy Monkey-Heart Protector” but underneath it all they are the exact same game, power-ups and all.
This may be good business but it's bad practice.  The game designer in me just can't stand the blatant disregard for the game theme to game mechanics correlation.  This is my main motivation for jumping into the mobile game design arena in general.  Pen and Paper board games have a long and varied history that will continue on just fine without my help.  Mobile strategy games need help though, and I am more than willing to lend a hand.

I must note here that turn-based strategy games have been successful on mobile devices and the genre is seeing a steady influx of creative exploration as people begin to re-imagine the board game paradigm.  X-COMM, Aerena & Toribash are three great examples of turn-based strategy games changing the digital board game genre.  Say good-bye to Majong and Othello clones.

2 Overview

2.1 Project Specification

Scrounge World is a client/server model RTS (real-time strategy) game implemented in Haskell, JavaScript, & CSS/HTML. The Haskell based server performs all game logic and sends packets of information to all players involved in the game. The client renders these packets of information and sends player commands to the server. The game is made for the web because we wanted it to be playable on as many platforms as possible. The server is made in Haskell to demonstrate the benefits of using a purely functional language to make a computationally expensive real-time game. Another aspect of the game is that other parties can modify it to create new experiences and tweak things how they desire.

2.2 Project Goals

We are using this project as a learning experience and we plan to market it in the future. Our hopes were to learn web development, game development, concurrency, parallelism, and advanced functional programming constructs. We also hope to change what people think is possible on mobile devices and demonstrate that a touch interface is viable for RTS games. With the modding capabilities and chance to play on many platforms, we believe we can create a diverse community of gamers who create and share experiences with one another.

2.3 Target Audience

RTS games typically only appeal to hardcore gamers. They require a player to balance their time and thoughts between economic growth, military expansion, intelligence gathering, and strategic maneuvers. In combat, players must also be able to quickly give commands to units to maximize their potential. Many units have special abilities that the player must utilize to gain an advantage.

Mobile games however have the exact opposite type of user.  Mobile game players have notoriously short attention spans and need very low learning curves.  Two concepts completely foreign to the RTS genre.

To make our RTS game successful, we'll need a UI that enables the player to quickly go from thought to action with as little effort as possible. RTS players spend all of their time navigating the battlefield, selecting units, and giving orders. They don't want to be fumbling around in menus searching for things while their opponent wipes them off the map. We designed a UI that we believe solves these problems and enables players to issue any command they wish within one or two seconds.

2.4 Server Architecture

There are extremely few large games written in the Haskell programming language. Certainly none that are similar to what we are trying to accomplish. This means no game engines were used on the server end and nearly all logic was written by hand. The only significant libraries used were for networking (websockets, stm, & blaze-builder) and array based data structures (vector, hashtables, repa).

The server code is divided up into several large components. There is a single module containing all data type declarations used by game logic called “Data.hs”. Nearly every module imports the “Data.hs” module. It's pointless to separate a games data into separate chunks when almost all pieces are interacting with one another at once. The simple act of a unit moving from point A to point B will touch nearly every chunk of data contained within the game. For this reason we don't think it's a great crime to include all data declarations in one module. By looking at a single module, you can get a good idea of how the game is structured and what all the pieces in play are. It also greatly simplifies importing.








The terrain in the game is procedurally generated and there is a module to specifically deal with that. “Terrain.hs” is responsible for generating random terrain using perlin noise and edge detection. A grid of perlin noise is generated, then layers are created by mapping ranges of values to specific integers. For instance, let 0 represent the water level, 1 represent sand, 2 represent dirt, 3 represent a ramp, and 4 represent a plateau. The perlin noise ranges from -1 to 1. So we can map values from -1 to -0.2 as water, -0.2 to -0.3 as sand, etc. We don't want units to travel between dirt and a plateau without using a ramp. So we use edge detection to find plateaus, then generate a ramp for each one to ensure units can access every plateau.




“Pathfinding.hs” is responsible for generating pathing data and finding paths using that data. After we have generated the terrain, we generate information for units to quickly navigate the world. To begin, we find every “corner” on the map. Let black represent tiles units cannot move through. Red represents  corners on the map.


The previous diagram gives you a visual idea of how we identify corners. After every corner has been found, we perform a raytrace from every tile on the map to every corner. When this is done, every tile should know every corner it can “see”. Armed with this information, pathfinding using A* is trivial and extremely fast. It will take some time to compute visible corners and scales poorly for large maps, but the game-time benefits are awesome.

While “Pathfinding.hs” figures out where units should move, “Movers.hs” is actually responsible for moving a unit from point A to point B. When a unit moves, it may collide with walls and other units. To find nearby units, we use “Tree2D.hs” to construct a 2 dimensional tree every game frame that allows for fast lookups of nearby neighbors. When units bounding spheres are overlapping they push away from one another. Heavy units push lighter units around more and are pushed less by lighter units. If a unit would move into or through a wall, it is forced outside.

We now have the basic pieces required to get units moving around a map, but there's nobody to order them. “Competition.hs” is responsible for connecting players to the game, accepting messages from them (which are stored in a mailbox), and sending messages to the players. To create a competition, you simply state the port, the message decoder/deserializer you wish to use, and a list of teams with names & passes. When players connect to your server, they are automatically put into their respective teams and can now add messages to the mailbox. This module is very general purpose and could be used for any game with predefined teams.

We have the component for receiving and sending messages, but we haven't specified what those messages are. Every game frame (1/10th of a second), players need an update on the positions and attributes of units they can see. Since there can be hundreds of units visible to a player at any time, it's important that we save as many bits as possible when transferring information. Each unit is composed of a unique ID, a team #, an animation ID, a type ID, XYZ coordinates, and a facing angle. We cannot lose precision on a unit's ID because we don't know how many unique units a player will control throughout the game. We assume 4 bytes is enough to cover a player through any realistic match. For all other information we can either reduce the range/precision to save a lot of space. We know there will never be more than 255 teams, so it's safe to use just 1 byte for the units team. We can make the same assumption for the type ID and animation ID. To conserve space on the units XYZ coordinates, we have to know beforehand that the map won't exceed a certain size. For our game, we assume 1024
is the maximum size of any coordinate. This allows us to reduce precision from 32 to 16 bits. With 2 bytes a unit any occupy any of 64 (2^16 / 1024) different places between each tile. That's more than enough to fool the human eye.

2.5 Client Architecture

Basic Specifications:
- Client/Server model.
- Cross-browser/platform compatibility.
- JavaScript 2D client.
- 3 (+ 10) button UI layout (for touch devices).

Use Cases:
We are hoping that we will bring RTS fans to the mobile gaming market and introduce the mobile gaming audience to a more hard-core style of gameplay.  There is, of course, the theory that “hard-core” games don't belong in the mobile arena because the audience will only support a 10 minute attention span.  We are hoping that this doesn't hold true and that people will spend 20-30 minutes completing a round of our game.  Only time will tell.  Or maybe more research.  I don't know how many people play Settlers of Catan on their phone but that's our market share either way.

Implementation Choices:
Excluding the flip-flopping about 2D and 3D graphics most of the game has been fairly static from early on.  Game-play and UI design components have been completely independent of dimensional representation

Game Structure on Client:
PhaserState -- Phaser uses “states” to control application flow.  You can think of states as being screens; Main Menu, Game Login, Options Menu, etc...  States are used to manage asset loading.

PhaserGame – the game object that contains all of the current level data.  This object is a global variable that is re-used for every level.  However, Phaser does allow for multiple games to be created which would support a mini-game sort of functionality.   We only have one game object though.

PhaserObjects – I won't go deeper into explaining the structure of Phaser except to say that it has all of your standard 2D engine bells and whistles.  Support for touch, keyboard and mouse input handlers, sprite sheets, tile maps, animations like tweening, limited WebGL shaders, etc...

Logic flow from server listener:
ChefClass:  Receives binary data from the server and parses it into game-readable event code.  The ChefClass parses the data into messages called “cereal”.


2.6 UI Design
link to UI mock up/instructions
https://drive.google.com/?tab=mo&authuser=0#folders/0B1FaaEchU94Ya1F1T1p3RmVuUHM

When designing the UI we started by identifying the obstacles we had to overcome.  Second, we developed a design that overcame said obstacles.  Lastly, we are developing and will deploy our revolutionary design.

Through my research I found our 3 main obstacles on the mobile platform were/are:
1) limited AI capability for single player.
2) limited UI capabilities. The RTS genre relies heavily on complex hotkey setups.
3) limited/lo-fi assets do to decreased RAM size.

Obstacle 1: AI on a tablet.
People are spoiled.  AIs nowadays are awesome.  They often adhere strictly to the rules of the game and are truly an analog (if a poor one) for playing against a human opponent.  It wasn't always like this.
In the early RTS days, most of your game AIs were pretty rudimentary.  Many AIs were simply hard coded enemy factories that ceaselessly spewed units at you.  As you progressed through the levels the enemy factory would simply go into over-drive and the mayhem would ensue.  Eventually people caught on and weren't very happy with the situation.  Apparently they didn't like that their enemy could “cheat” -nevermind the fact it can't think-  but the game companies obliged as technology allowed.  Which brings to our current day audience who expect a more complex play experience than gamers of old.  One that truly is them versus a digital opponent not just a factory.

It wouldn't be unreasonable to assume that one of the reasons game companies are hesitant to tackle the
transition to mobile is because the AI constraints for single player mode might not be received well by
the younger audience of gamers.  I am pretty sure this is why game companies have stuck to the TD genre.  It thematically allows the AI to no longer have to consider economy or terrain-based combat.  Which is HUGE!  It allows the designers to revert back to the unit factories of old.

Obstacle 2:  UI on a tablet.
This part just took sitting down and playing with an iPad to see what felt comfortable and what reasonably fit on the screen. Once that was accomplished (which was quite easy because much of this research was done for us) it was now a matter of sticking to the layout we had during game creation.
Which is actually an incredible difficult task but we did manage to design a fairly robust layout that should allow for 70-80% of the functionality provided by a full suite of hotkeys.

Basic UI mockup:



Obstacle 3:  Assets on a tablet (and cross-platform compatibility).
Frankly this part has been a huge struggle.  Figuring out what kind of 3D assets you can cram into the RAM of a mobile device is a real pain.  After literally months of struggling with trying to scale down 3D model implementations and loaders I came to the conclusion that the only real way to get 3D assets into a browser game is to write your own model parser.  You need the kind of per-vertex control only custom code can achieve in order to trim down model data to the most critical information.  I am not ready to write our own model parser just yet so 2D is really the only option left.  Hopefully our decision to move to 2D gives us the asset freedom we couldn't find with 3D.  We need to be able to create enough graphical depth that terrain still feels as though it is on multiple levels.  If we are successful in that regard I'm not worried about the quality of the graphics as most 2D games on mobile devices have been well received.

I think it's worth noting however that creating their own ultra-light model parser would be nothing for a AAA production company.


3 Status

On the server, we are currently able to make very basic mods that generate terrain and make some units for each team which can be ordered around. Players can connect to the game and see units moving around. The client is currently unable to send commands to those units so we simply have them ordered to move to the center of the map (assuming they can reach it).

Do to the indecision with the 2D/3D implementation choices we currently have 3 clients that are all in various states of functionality.  Zach has an 2D Elm “view port” he uses to obverse unit behavior to troubleshoot the server code.  I began the client in 3D so I have an implementation that is extremely un-performant do to the model loader I was using at the time.  The implementation looks pretty and has all the foundational logic for screen panning, marquee select, unit spawning, and a few other basic dummy functions.  I simply had to abandon it because I couldn't figure out how to make it performant shy of coding my own model loader from scratch (which the project time-line didn't allow for).  The 2D implementation I am currently working on I have only been coding for just over a month.  In that time I have almost caught up to the amount of work I completed on the 3D client in 4 months.  The 2D client currently has all the bells and whistles of the 3D version but with better functionality for the event listeners.

4 Conclusions / Critique

If we were to do this project again, we would greatly simplify what we expected to accomplish. Originally, we planned on having 3D graphics, units shooting stuff at each other, and terrain would only be revealed to players as they discovered it. 3D graphics proved to be the most problematic. WebGL is very new technology with buggy model loaders. To get it working, we would have to implement our own model loader or stick to using static scenes. There are very few WebGL games with graphics beyond simple colored polygons, which makes for few examples. If we hadn't aimed for 3D we would have a lot more done at this point. We may have even met every other goal.

We wanted to have our unique UI implemented so we could show that a RTS game for tablets is feasible and comparable to the PC. Trying to get 3D working delayed us and we don't have the real innovation to show off. The server development came pretty close to the original goal. A few steps of the original plan were switched around and all terrain is visible to all players immediately. The modding support actually went better than expected. I believe with continued development, we could make a game that is easy for players to change and manipulate to their liking. Haskell's default laziness had an effect on performance and was annoying to deal with (as we anticipated), but adding a few deepseqs solved the problem.

5 Future Work

Getting a fully functioning client is top priority for the future as the UI might define the success of the project overall. This will allow us to really experiment and test out the design of the game. Once we have a working client, we can add in game features at will and see them in action. When we get something working that is fun, we will focus on making modding easy to do with plenty of documentation. Currently, games must be configured manually via text file, so in the future we'll need a coordinating server like “Battle.net” which can setup games for players. Once we have that infrastructure in place, we could market our game to the masses.

Tuesday, May 20, 2014

Rough Draft for project Report -Post #18

Scrounge World Game Project
Clay Francisco & Zach Kamerling

Code Repository
https://github.com/RTS2013/RTS


PDF Version of this doc on Google drive
https://drive.google.com/file/d/0B1FaaEchU94YQ2NqS045dGZPUzQ/edit?usp=sharing







Scrounge World is a browser-based real-time strategy game coded in JavaScript and Haskell.  Our main project goal was to design an RTS for mobile devices that plays like a full sized desktop application.

Our project examines the why and how of bringing the RTS genre to the mobile market.

Why we want to achieve this:

Mobile games are a huge part of today's gaming market and yet are still missing a catalog of strategically rich RTS games.   I must note here that turn-based strategy games have been successful on mobile devices and the recent port of X-COMM to Android proves a market for turn-based strategy games does indeed exist in the mobile arena.  This, combined with the obvious success of RTS games on desktop machines makes us certain that the need for this type of game exists.

We have set before ourselves the challenge of designing a game that distills the complexity of a full keyboard worth of hotkeys down to a 3-button, touch screen interface.

This project has several learning components, not the least of which is simply designing and testing the UI.  Next, it will be necessary to construct a game that squeezes impressive battle scenes onto the reduced screen real estate.

How we plan to achieve this:
While simple to explain, implementation is proving to be quite the endeavor.  The how of completing this kind of project is really a “cross that bridge when I get to it” sort of experience.  When loading 3D assets for example;  You can't simply use the JSON model loader provided with your given engine.  You must consider the entire number of onscreen assets supported by your internet connection for each different format, JSON, Collada, OBJ, etc... and average the supported number of polygons by the number of individual units on the screen at any one time.

Without a wealth of industry experience to draw on, the new designer must trudge forward on his own discovering the boundaries of the current technology.  Or we could have just done 2D from the start because the foundation of 2D programming hasn't changed in 20 years whereas the 3D browser environment is changing on a daily basis.

What the heck are we talking about anyway?

Real-Time Strategy (RTS) games are a genre of war game where players each control their own army.  Game “pieces” are divided

<RTS run down>

Tower Defense (TD) games are a specialized version of the RTS core mechanics system.
The essential components of the TD are:
- Single Player:  Games consist of waves of progressively stronger, faster and trickier units that
  take predefined pathways towards your home base.  Once your home base is drained of life,
  you lose.

- Snap-to Grid.  The map is always some expression of a standard grid separated by paths
  leading to “the base”.   The player may never place units in these pathways.  They remain
  clear for the enemy hordes to stream down.  Your units are sized to be varying multiples of
  this grid system.  Placing units is the main strategy component of TDs.

- Immobile Units.  Once placed, TD units are glued to their position and are only (and not
 always) removable through recycling for scrap.  Once recycled, a small “after-market” amount
  is added to your resource pool and the square is now open for replacement.

- Economy:  TDs don't have a classic harvesting based resource system.  Instead, players earn
  resources by killing enemy units.  Resources are then spent on new weapons and upgrades.

- Strategy:  The goal is always to protect your base by placing units who have the correct range
  and rate of fire around the correct pathway or lane.  This is a greatly simplified explanation
  and games like Savage Moon for the PS3 prove that you can have engaging strategy with only   a gamepads worth of buttons (and despite the horrible cursor control of the analog stick).


Too many Tower Defense games!  But why?
We really aren't sure why game companies haven't tackled the problem of mobile RTS games but there are a few obstacles that become immediately apparent to any game designer.

1) limited AI capability for single player.  2) limited UI capabilities. The RTS genre relies heavily on complex hotkey setups.  3) limited/lo-fi assets do to decreased RAM size.  This is another point RTS games tend to not to deviate from.  Players have gotten used to to having dozens of available units with several available upgrades and customizations.  Do to the visual scale of RTS games units require very distinct art assets to be distinguished from one another.

Obstacle 1: AI on a tablet.
People are spoiled.  AIs nowadays are awesome.  They often adhere strictly to the rules of the game and are truly an analog (if a poor one) for playing against a human opponent.  It wasn't always like this.
In the early RTS days, most of your game AIs were pretty rudimentary.  Many AIs were simply hard coded enemy factories that only spewed units at you.  As you progressed through the levels the enemy factory would simply go into over-drive and the mayhem would ensue.  Eventually people caught on and weren't very happy with the situation.  Apparently they didn't like that their enemy could “cheat” –never mind the fact it can't think--  and the game companies obliged as technology allowed.  Which brings to our current day audience who expect a more complex play experience than gamers of old.

It wouldn't be unreasonable to assume that one of the reasons game companies are hesitant to tackle the transition to mobile is because the AI constraints for single player mode might not be received well by the younger audience of gamers.  We are pretty sure this is why game companies have stuck to the TD genre.  It thematically allows the AI to no longer have to consider economy or terrain-based combat.  Which is HUGE!

Obstacle 2:  UI on a tablet.
This part just took sitting down and playing with an iPad to see what felt comfortable and what reasonably fit on the screen. Once that was accomplished (which was quite easy because much of this research was done for us) it was now a matter of sticking to the layout we had during game creation.
Which is actually an incredible difficult task but we did manage to design a fairly robust layout that should allow for 70-80% of the functionality provided by hotkeys.

<PIC>
Obstacle 3:  Assets on a tablet (and cross-platform compatibility).
Frankly this part has been a huge struggle.  Figuring out what kind of 3D assets you can cram into the RAM of a mobile device is a real pain.  After literally months of struggling with trying to scale down 3D model implementations and loaders I came to the conclusion that the only real way to get 3D assets into a browser game is to write your own model parser so that you can trim it down to only the most critical model data for your implementation.  I am not ready to write our own model parser just yet so 2D is really the only option left.

Although creating your own ultra-light model parser would be nothing for a AAA production company.

Where the project is now:
Client:
Really basic 2D UI has:
- limited button functionality (control groups and “action” buttons)
- broken map panning
- the start to marquee select
- the start to unit spawning

- binary message receiver 100%
- binary message sender 80%

Server:


How we will get to our goal:
Just keep coding!  It may sound ridiculous but that's the plan.  With the exponential reduction in work load created by moving to a 2D client I know has a very clear design path to follow.  2D RTS UIs have been around for over 20 years so there is a wealth of online experience for me to draw from.

Just to illustrate the kind of time and complexity reduction we are talking about here;

Time to create a 2D vector-art, scalable/rotatable, modular, overhead art asset:  3 hours

Time to create a 3D mesh with a baked-in texture map and rigging:
Model, 2-10 hours.  Texture, 2-10 hours. Rigging, 2-10 hours.

So in the best case scenario it will take double the amount of time for asset creation.  I think it is important to note that the test sprite I am using for units took me less than 10 minutes to draw.

Yes, we intend to market it:
Because I believe the mobile market is waiting for this kind of strategy game I will definitely be pursuing it's marketing.  It is my intention to continue game design as a career path upon graduation, either independently or under a corporate umbrella.  This project is a great learning tool for exploring mobile gaming technologies and I plan on continuing with it until it's completion after school.

BODY:
///////////////////////////////////////////////////
////////////////////////////////////////////////////

Specifications:
- Client/Server model.
- Cross-browser/platform compatibility.
- JavaScript 2D client.
- 3 (+ 10) button mobile UI layout.

Game Specs:
- Support 3-8 players simultaneously.
- Support 500-2000 individual units.
-

Use Cases:
We are hoping that we will bring RTS fans to the mobile gaming market and introduce the mobile gaming audience to a more hard-core style of gameplay.  There is of course the theory that “hard-core” games don't belong in the mobile arena because the audience will only support a 10 minute attention span.  We are hoping that this doesn't hold true and that people will spend 20-30 minutes completing a round of our game.

Implementation Choices:
Excluding the flip-flopping about 2D and 3D graphics most of the game has been fairly static from early on.  Game-play and UI design components have been completely independent of dimensional representation

Game Structure on Client:
PhaserState -- Phaser uses “states” to control application flow.  You can think of states as being screens; Main Menu, Game Login, Options Menu, etc...  States are used to manage asset loading.

PhaserGame – the game object that contains all of the current level data.  This object is a global variable that is re-used for every level.  However, Phaser does allow for multiple games to be created which would support a mini-game sort of functionality.   We only have one game object though.

PhaserObjects – I won't go deeper into explaining the structure of Phaser except to say that it has all of your standard 2D engine bells and whistles.  Support for touch, keyboard and mouse input handlers, sprite sheets, tile maps, animations like tweening, limited WebGL shaders, etc...

Logic flow from server listener:
ChefClass:  Receives binary data from the server and parses it into game-readable event code.
The ChefClass parses the data into messages called “cereal”.

In the PhaserGame update loop there is a cereal eater method that simply listens for changes to the cereal model and “eats” the changes as they come in.  I think there is a way we can have the PhaserGame listen directly to the ChefClass but I'll figure that out later.

Almost all my subclasses inherit from the Phaser.Sprite or Phaser.Button classes because everything on the client is just UI.




Game Structure on Server:

GameObject:
- Map

- Team:
- Entity (Projectiles and Units are actually the same class for now)

- Chef (the binary message passer)

Status:
Not even close to finished.  However, we do have everything in place for our Client/Server message passing and can observe unit behavior on the client through an Elm “portal”.

We have a less than complete product because we kept moving forward with a 3D client even after it became apparent that there was no way one person (me) could complete that kind of workload in the allotted time.  This happened because we started our project with 4 team members and now only have 2.  Both team members left (one dropped the class and one joined another group) during Winter quarter so much of the client work I had done already was in 3D which I was loathe to throw away.  It was a lot of time and effort to scrap.

So much of my time has been spent scaling back implementation details to accommodate the lost members.  Sadly taking even more time away from my direct project work.

CONCLUSION:
Not much to conclude other than we just need to keep plowing ahead.  Successful game design is about sticking to the plan even when things get hard.  Of course plans will change but changes must a conscious decision that reflects the predetermined goals of the design.

Design and Programming Issues:

//////////////////////////////////////////////////////////////

Lessons Learned:
Did I ever.
//////////////////////////////////////////////////////////////






Tuesday, May 13, 2014

I LOVE PHASER!!!! (or maybe I just love 2D) Post #17

This past week I spent reading up on a JavaScript engine called Phaser.

So far it's been awesome.  It has great support for touch functionality and UI components.  It has support for the Tiled .tmx format as well as JSON.

In two days I created a draggable (with touch and mouse) dude that "eats" stars when you drag him over them and displays the point total.  Which doesn't sound like much but a lot of the time went towards separating the code demos into a proper class structure for encapsulation.

I'm going to see how far I can get on the GUI in the next week with this new engine.

The great part about switching GUIs is that the binary decoder/encoder we have is completely re-usable. Which means I can completely change what I am doing without effecting the model.  Thank goodness we planned ahead for this.

Just as a side note.  If things get strapped for time in the next couple of weeks we can always re-hack together my almost working 3D GUI so that it displays the state of the model.  i.e.  You can peek into the game state like a little movie but can't interact with it.  This will allow us to show that our foundation is totally functional just missing most (well... all really) of it's features.

Which is why I'm taking the time to research this 2D option.  Our main goal is to learn but we are set on doing so by creating a playable end-product even if it takes us longer than our scholastic time-constraints might allow.

Pictures of the GUI/HUD to come by the end of the new week.

Thanks for reading,
-Clay Francisco

Passing the halfway mark

[posted 1 week late]
[this is for last week --May 5]

I can't believe it's week 6 already.  Looks like I'll have to spend the rest of the week coming up with an action plan for how these last 4 weeks should go.  With the end of the quarter sneaking up this fast I'll need to spend a few hours this week figuring out what tasks we can accomplish in this limited time.

Back to previous problems though; this past week I ended up solving my CSS issue.

It was an asset loader problem with the level objects (it's always the freakin' loaders!!!).  I didn't realize that the level objects contained the paths for their terrain PNGs because the game has it's own image loader function/class.  I figured that all the image data would get loaded through image loader function but that isn't the case.   Several of the pieces to this tutorial game are hard-coded for ease of readability and it ends up making the structure of the code a little sprawling.

Now that I'm through that headache I can focus on the 4 week crunch.

I will be spending this week digging into a 2D engine called Phaser because I'm starting to wonder if all of these headaches can be avoided with sprite sheets and atlases.   I should be making more headway then I am.  Also my impending graduation is definitely bringing my 3D trudge to the forefront of my mind.

So wish me luck on my super short 2D adventure.

Thanks for reading,
-Clay Francisco

Tuesday, April 29, 2014

My week back in Java Post #15

This past week I spent 3 days working with the Parts & Portals game group.  Well...  really just Daniel and myself.  We had a fairly successful run of it.  We got the enemy units turning and jumping and the player shooting bullets and a little health powerup working.

The AndEngine has some interesting quirks and I didn't spend enough time to really get a good feel for it but the bullets took us a while to implement because of the way the engine handles dynamic object spawning.  The AndEngine requires dynamic object spawning be handled by a GenericPool class that the given subclass must extend.  This is because the small amount of phone RAM must be tightly controlled.  Java's regular garbage collection doesn't seem to cut it so it looks like the GenericPool class takes care of object loading from level to level.

If you don't want to use the GenericPool it seems like the only other option is to use the XML level editor to hard-code assets into the level.  This works out great for health and powerups but doesn't work for dynamic badguys and bullets.   It took us a few hours to figure all of this out but once we defined the two basic datatypes for the engine the rest of the work went pretty smooth.

Moving forward, once collision detection for bullets is in place, killing enemies should be a snap as the superclass already "knows how to die".  Which will bring the game to a point where you are being chased by enemies that can kill you and that you can kill (plus there's life!).

Overall we had a pretty good time getting over their engine hump and we will spend this next week getting me over my HTML5/CSS3 hump.

Thanks for reading,
-Clay

Tuesday, April 22, 2014

Combining Efforts Post #14

So I last decided to work on the off-line portion of the game:  UI, start/login screen, asset loading, etc...

As I started diving into a completely new version of the UI and map panning I ran into some really weird CSS problems with my z-index and mouse event handlers.  Somehow my event listeners aren't tied to the correct DOM element even though I'm working my way through a fairly good tutorial (that of course works just fine).

I'm not the only one hitting "critical mass" roadblocks or perhaps just project burnout?  One of the teams making an Android game is having engine usability issues and with my recent foray into game engines we both have skill sets the other team currently needs.  So our teams will spend the next week or so helping each other get our projects over this next little hump.  I think both of our groups are also at the point where we just need some new creative life breathed into us.

Oh.  It's the Parts & Portals game group (Daniel, Jacky and Jaron).

So the goal for my project for the week remains the same as it did for the past few weeks.  I'll be explaining in more detail where I'm at technically in the client thread.

Thanks for reading.

-Clay  

Tuesday, April 8, 2014

Decisions for moving forward. Post #13

After some careful evaluation we realized we weren't as far in the hole as we thought we were.  Yes the client still has a long way to come and we need it for play-testing.  But Zach has made pretty good progress on an ugly temp client in Elm that we will use to test vision, pathfinding and a few other "critical systems".

Once the Elm client is mocked up enough to show units and some basic terrain we can start testing.
Granted it won't be a visual feast but it will get the job done so we can keep moving forward with server logic.

Which means I will keep working on the 3D JS client.  I am going back to the Babylon JS engine to experiment with their object loader.  Now That I have some real JavaScript chops I am going to re-evaluate it's usability.  I'm pretty sure after using ThreeJS on it's own for the past two months that it was just my noob-ness causing my problems.

Side note:  I've heard some really good things about Visual Studio's JavaScript intellisense so I'll be checking that out this week as well.  It also has TypeScript support (which I'm only partially curious about but will give a look).

Currently I am working on the BabylonJS model loader and terrain generation examples, looking into how they will translate/compose with the ThreeJS implementation we already have.

Side note 2:  I have been informed that I once (maybe even more than once) promised videos of progress.  Sorry about being a liar but I won't be able to get to videos until after I get more done on the client.  I will put some videos up as soon as I have something worth showing.


So, goals for this week are:
   
     Clay:

     Get into the BabylonJS loader code and understand it's use properties.

     Get a simple scene loaded with a couple of units and a few buildings.
     (off-line, no server communication.  Well...  ideally it'd be spawning from the server)

     Zach:
 
     Getting Elm client to a critical testing point.

     Test vision on the Elm client.

   
Thanks for reading,
-Clay

Tuesday, April 1, 2014

Spring Quarter Refresher. Post #12

I broke it.

Not sure how.

But the client is most certainly, broken.

Just after getting things all piped up properly I broke the UI somehow when refactoring the button layout and somehow reduced the FPS to 2-8 or so.  Yup.

Put simply.  We might just be in too deep for a two man team with our time constraints.  The only way I can figure to lower the water level in the boat is to cut back on graphics as we aren't willing to sacrifice functionality or playability.  Additionally, it is fairly straight forward for us to add more dimensionality to the graphics because the overall logic will always remain 2.5D.

Zach and I will spend this next week tearing down all of our expectations and building a new super clean SAP model/design.  Granted, it feels like this will be a process of upheaval and chaos but it is really just the next step in creating a slick, maintainable end-product.

With our connection success we have proved that our framework does work.  The excitement of having a communicating framework has sparked debate about simplifying the client in order to speed up the iteration process.  We are actually both in agreement about the fact that simplification needs to be done (yet again), and are currently just debating which of the graphical components must make it into the SAP.

It seems we forgot to weight graphic workload as heavily as we should have.  I believe it was partly do to the artist in me not wanting to sacrifice all the pretty polygons.

Once we find the minimum balance between iconographic communication and speed of iteration we will be unstoppable.


Here's to a great quarter.

Thanks for reading,
Clay Francisco




Sunday, March 16, 2014

Connection Success! Now the fun begins. Post #11

So last night Zach and I got the client and server connected and talking.  He has teams logging on and spawning the two default units we have.  I think he had 5 teams with 10 units.

Of course we ran into cross-origin resource errors (that I'll explain in the Client thread) with my end but as soon as I make a few minor changes to allow the server to request graphics from my computer (a feature we'll need if we ever want to have downloadable skins) we'll be up and running, developing through iterative testing. We are pretty excited right now.

I don't have any screen shots to share because Zach's computer is the one with the Haskell server working.
We are meeting up on Tues. and should get all that stuff up then.

He did put a .exe up on our Git so that I can run our server on my end but because I don't have the proper modules yet so I wouldn't be able to edit the server.  If you know about Haskell and Cabal hell then you know why this is and why I'm not super excited to get the platform working on my end.

It must and will happen in the next couple weeks though, if for no other reason than it's time.  We both need to be working on both sides of the code base, at least in a limited fashion where we need to be able to share and examine each others code remotely and in real-time.

That's really all I have to report in this thread.  I'm off to update the Client thread now.

Thanks for reading,
-Clay



Wednesday, March 5, 2014

Distractions... Post #10

This past week was slower going than I wanted it to be, and it was all my fault.  I got a (sorely needed) new Asus laptop with Windows 8 and spent far too many hours setting up my new development environment and forcing an Ubuntu partition onto it.  Again, I must shoulder some of the blame for the delays because I have been a faithful Mac user for the past 5 years.  My impending graduation, and the buzz about Win8 had brought to my attention that my once quite adequate PC skills had started to dwindle.

While Windows 8 cannot be named the sole culprit for this weeks delays, it most certainly played it's part.  In the interest of not turning this into a bash-on-Windows post I will only mention the single most annoying feature I came across.

When you swipe, left-to-right, over the area of the track-pad where the buttons reside it "swipes-in" the MS store (whatever it's called).  To back out you have to press "Win" then click on your desktop lifetile(?).

When you swipe, right-to-left, it "swipes-in" the control panel.  This only takes clicking on your application or desktop to go back to whatever you were doing and is emulating touch functionality so I understand why it's setup that way.  However, it is pretty annoying and it took me a couple days to even figure out HOW I was making it happen.  I kept thinking I must have been pressing a key down as well or something.

Which begs the question; "Is that the only way to access the control panel on a non touch screen?"
If the answer is no; "Then why is it so hard to find the hot-key command to bring it up?"

These problems are of course minor annoyances that I eventually turned off but unfortunately Win8 users now know these come from a family of feature oddities strewn throughout the system.   Which is really too bad because I like the new Flat-UI design and how it works on the touch screen.  I really think it's a great interface for a tablet.  It's just too bad you don't have a clearer and easier way to adjust how many of the touch features the OS is implementing on real computers.

Anyway...

Back to the project.

The only thing I succeeded in implementing was some minor refactoring of the GUI layout and some really bad animation and "onHover" events working in CSS3.  I guess this means I did finally figure out that it would be way too expensive to do ray-casting to full 3D WebGL buttons.

Although, now that I think about it there may be a good way to attach a new canvas element that has the UI/HUD layer on it, and because it would be static compared to screen coordinates,  you might be able to cache the objects and just keep them "unprojected" on the screen in 2D space.  I'm pretty sure this is how caching is done for marquee selection for a stationary camera view.   Hmmm.... I'll have to look into that later.

Sorry that was a kind of technical tangent.

I'm currently in the process of creating the structure of: Game Object, Entity super class, Unit & Building sub-classes.  I'm using the structure from SimJS, the ultra light "game framework" package (literally 6 .js files) from WebGL Up and Running.

I really like the simple structure of his "SimObject" class and aside from some outdated loaders (that do work with his examples, but mine always got an error about using a Vector3D vs Vertex3 that came from inside three.min.js which meant I was asking it to do something in an old format and I tracked it down to one of the loaders but could never fix it so I just started over), it is a solid foundation.  I think anyone new to game programming (but perhaps not programming in general) can benefit from taking a good look at his super simple but totally complete game model.

ughh... I'm pretty sure that was another technical tangent and I really don't wan't to move this post.  oh well.

I'm out of steam anyway.
That's what I've been up to, thanks for reading.
-Clay Francisco

Tuesday, February 25, 2014

Changing the Blog Structure Post #9

So you may have noticed that this Blog has grown a few new threads.  This is because this main game thread didn't have the technical info that I originally wanted to be here.

This thread will remain the overview thread it has become and we have shipped the more technical stuff the the model and view/controller threads.

So back to the good stuff.  With the model loader now working correctly I can move on to the more critical "slave" logic for unit movement/animation control.  We are starting with just basic ID, (x,y,z), and facing direction info to show input handling from the model (via the server).

Zach has a little more "glue code" to write for the binary format parser (on the client side) before we can actually hook up our server and client but we are only one layer away from connection so we are both pretty excited to get some models moving with server commands.

Here is a screenshot of my models loaded up with their textures.



Thanks for reading,
Clay Francisco.

Wednesday, February 12, 2014

Progress Recap Post #8

This post will be a progress reports of sorts.  Really it will just be a signpost for us to catalog where we are at this point in time but even more so, an overview of how we got here.

Initial Concept: Summer 2013
  - Insane brainstorming about the coolest cross-genre experience ever.

Solid Concept:  Fall 2013
  - An RTS style combat sim in an RPG setting.
  - Main cross-genre components ->
            - Players recruit a "party" (a la RPGs) instead of
              building an army (par usual RTSs).
            - Units are initially NPCs; distinct characters that can
              be equipped, have unique "level" or XP,
              and are found in towns and villages.
            - In game items will be like RPG items
              (they can be scrapped for coin, traded, etc...)
            - A sim environment:  flora and fauna with
              aggressive and passive behaviors.

            - All other game aspects will be taken from the RTS genre.

Leads to:
  - Research on cross-platform gaming options.

 - Side problem *
             - Figure out a UI that makes it so RTSs on a tablet aren't so simplistic.
                i.e.  make the tablet RTS experience closer to the desktop experience.

             - Goal -  achieve 80-90% of the desktop functionality (hotkeys, control groups, etc...)

               (may have a good handle on this problem...  need time to experiment)

Cross-platform Options:     
Browser or Java (or port it to all the platforms!!!   yea right)

  - Java:  A great option.  The main reason we didn't go with this option was
              because of the nature of the 3D engine we wanted to use for it.
              There were several other options for lower-level frameworks that
              we decided to pass on for various reasons that are preferential
              not technical.

              In the end we decided we didn't want users to have to download
              our game.  Browser it is.

  - Javascript:  The option we went with.  Because; WebGL.
                       It just looks so cool. Additionally there is a lot of great
                       documentation out there for Javascript frameworks (I think it's)
                       because it has such a quick iteration time.

Implementation:  CURRENT
                              February 2014 
  Toolset:
  - 3D framework: Three JS
  - (Possible) workflow tools: Yoman, Node.js, Require.js, Backbone.js
  - IDE: Sublime Text 2
  - Development Browser:  Chrome

  - Books:  WebGL Up and Running; Tony Parisi,
                 Pro HTML5 Games; Aditva Ravi Shankar,
                 Learning HTML Game Programming; James L. Williams

  Game Framework:
  - Client-Server model with MVC components

  - Server: Haskell, because it has great concurrency control.  This should
    allow us to farm out the game logic to the host, which will free up the
    client to only work on the graphics.  This is a concern because of Javascript's
    single threaded nature.

 - Client:  Javascript, it's a great way to get our game out to as many people
    as possible AND it gives us a game with which we can test our ideas
    about a better RTS interface for tablets.  Javascript has great touch/swipe
    libraries.

  Tasks at Hand:
  - Finish UI mockup
  - Get textures packed into models for importing
  - Finish custom binary communication protocol (this should save us
    TONS of bandwidth allowing us to really push the amount of data we
     send about gamestate)
  - Complete the initial scene (models loaded and responding to picking events)

  Tasks Completed:
  - Basic models: male, female, weapons, armor, a few buildings and 3 vehicles
  - Worked through Three JS tutorials up through model loading.
     Networking portion will be next
  - Empty logic framework for server


PS:  Here's just another screen shot to show how the models are coming along






Timeline Post #7

In the interest of greater academic rigor; here is our rough timeline for the game.


Scrounge World time line:
as of 02-11-14:


week 1.6
-start the binary parser for the clientside (data unpacking).
-getting models loaded with their associated textures.
week 1.7
-finish GameObject class and first level of subclasses (NPCs, Units, Buildings, etc...).
week 1.8
-finish UI “mockup” that will have basic mouseclick event handling.
week 1.9
-have basic scene set up with dynamic entity spawning.
week 1.10
-have basic functionality for server/client message passing.


-experiment with rigging over the break to see how hard getting animations to
work will be


week 2.1
-demonstrate Unit behaviours and “ownership”.
week 2.2
-more unit behaviour (sim-animals / bandits)
week 2.3
-more unit behaviour
week 2.4
-Units need to have basic behaviours by now (i.e. auto attacking, healing, etc...).
week 2.5
-vehicles as ITEMS not as units.
week 2.6
week 2.7
-be done with our SAP so we can implement some of our stretch goals
week 2.8
-tech-tree,
week 2.9
-procedural terrain generation
week 2.10

-Play it!

Monday, February 3, 2014

Vehicles and Mounts!!! Post #6.2

With the idea of modular units I'm trying to create some models that will reflect the blending of the Mutant and Human tech paths.  These are my first attempts.




Sunday, February 2, 2014

WEAPONS!!! Post #6.1

Weapons!!!!  Yay!!!
Low poly assets are coming along.

Armor!!!!




Back to the 3D. "Who you callin' chicken?" Post #6

Zach spent this last week creating an alliance system for the game.  All RTSs need a way to deal with multi-person teams; how resources and units are shared among teammates.  We've been leaning towards less control of your team's resources and equipment for a more "free trade" kind of mechanic.  As in you can "pass" units and resources to people on your team but couldn't use their stuff unless/until they GAVE you control.  No take backs though, that's just too hard.

I have been working on getting some 3D models sketched out because my teammates like to watch me suffer (not that 3D isn't the best)... Hao ;P

So we are plowing ahead with 3D even if it kills us.
Below is a preview of the low-poly male and female we will be using for our default NPCs.

The male was the character I started with because I wanted him to be the "base" size.  I then "shaved down" the model to get the female to match the basic shape.
 

I also had to give the female some kind of distinguishing marker because there body types were so similar from far away.  Of course they need to be if we are going to use the same models for weapons and armor.  

I had some difficulty trying to model a female that was the same height and width as the male while still looking feminine.  I also didn't want the female to be super thin and weak looking on the other hand because the NPCs will be a 50-50 mix with NO difference in their "stats" (they have identical data members and functions).  I guess the clearest way to say this is the server logic doesn't know about gender.  It's just something we do on the client because I think it's cool to have randomly gendered units. 
   
Hopefully I'll be able to pull it off.  The proof will be in the pudding I guess.  

Anyway, I hope the ponytail isn't too silly but I couldn't think of anything else. 


Right now they aren't rigged and don't have any textures but I'm going to build some weapons, armor and a couple other assets before I get to that stage.  I think we will be able to use the "naked" models as place holders and ramp up the detail (animations and textures) as the game starts coming together.

This would be do to the "emptiness" of our framework.  Since we have to code all the functionality we want to have as a "mod" anyway, we can create a minimal movement/behavior model for our game and then add animation functionality etc... as needed.  The reason we designed it this way was to give us the ability to abandon graphics after the SAP stage in order to focus on NPC AI behavior.  Which is what we all think will be the fun part.

Thanks far reading,  more pics to come soon.

-Clay Francisco