The Game Plan: Minimum Viable Product

Leave a comment Standard

In the previous posts we talked about how to create a budget for your game, some helpful tips if you’re not a programmer and finally we went over the best ways to help you in getting started. Now it’s time to talk about actually making something you can actually call the game.

What is a Minimum Viable Product (MVP)?

The idea of a MVP is to take the core mechanics of your game without any thrills or bells and whistles and put them to the test. This helps you get a working product and make iterations on it if you notice something doesn’t work the way you intended or just isn’t fun to play. This is also a huge way to save time and energy if say, that feature you spent months making graphics and 3D models and sounds for isn’t actually all that fun and you end up just tossing it out later.

How do I decide what is MVP?

First let’s take time to look at the features you wrote down when you were getting started. Now go through your list and take everything out that isn’t 100% essential to a base line working game. This usually includes things like, energy booster packs or power ups or multiple levels, or more advanced variations on a more basic feature. This also includes most graphics and 3D models and sounds and sound effects. While those are nice to have most times they are not actually essential to a working, playable game. Take pong for instance, you can play the core mechanics of the game with square pixel art just as well as you can with a 3D soccer ball with trail effects and a flashy background of a soccer field with soccer goals and kicking sounds every type you hit the ball. The core mechanics of the game remain the same despite the addition of the graphics and sounds and sound effects.

Prioritize speed and working game mechanics over quality

Since your MVP is essentially your playground to test out your game ideas we don’t want to spend thousands of hours perfecting something before we can even figure out if it’s going to work well enough or not. That means your super special spin kick with high quality physics computations isn’t all that important when you realize enemies are too hard to kill or the level isn’t playable or your character can die too easily.

Instead use this time to make something ugly, crappy, and even glitchy as long as the core game mechanics are in place and working. This will start to give you a feel for how what you’re making will actually play. It will tell you right away if something is too hard, or a level is too short, or your character is jumping too high or not high enough, or that your quest system is impossible to complete.

For a lot of people this kind of thing makes them feel “icky” and instead they strive right away for the “perfect, glitch free” game right from the start. This will lead you down the rabbit hole of not good enoughs. The character’s movement isn’t good enough, or the colors aren’t good enough, or the music, etc, etc. Striving for perfection at this stage is a totally moot point when you don’t even know if your base line is even worth putting the time and effort into it.

MVP done? Now it’s time for feedback!

Once you have some semblance of an MVP it’s time for you to get feedback. I like to get feedback as soon as possible that what it’s easier to change things that I may have missed earlier in the process when there are fewer things to take into account in the big picture of the gameplay.

Feedback is also a great way to find issues you hadn’t considered such as the speed of this level gives me a headache or I can’t tell the difference between an ally or enemy. It will also help you figure out what other people think about the game and if they find it fun to play or not. After all, no one wants to spend time playing a game if they don’t think it’s fun, or it’s too hard to learn, or it’s too slow/fast to keep their attention. That

Word of Advice on MVP Feedback

Don’t ignore constructive criticism even if it’s not what you want to hear. That doesn’t mean you have to change or add anything anyone has ever asks you for — it means you need to take those things into consideration going forward. Ignore the feedback that focus on your aesthetics — at least initially — because you can always change and fix those later and an MVP really shouldn’t focus on graphics at this point. Core mechanics and gameplay are much harder to tackle and fix once you’ve invested lots of time and energy into them.

Advertisements

XAMPP: Learn PHP & MySQL Without Online Hosting!!

Comment 1 Standard

One of the questions I get most frequently is what I use to make my SIM games. My answer is always the same, PHP and MySQL. Let’s say you wanted to learn these languages, so you find some tutorials and start reading. Only now you realize you need somewhere to practice what you’ve learned. Hosting can be expensive, especially for hosts that come with PHP/MySQL for someone who only wants to play around with the languages and isn’t looking to develop an entire website.

XAMPP is your solution. XAMPP is developed by Apache Friends and it will let you write and test PHP code as well as create and manging your own database. The best thing about it, its FREE!!

Go to this website: http://www.apachefriends.org/en/xampp.html and download XAMPP for your operating system. Once you’ve downloaded it run the installer (Windows machines) or follow the directions to get it setup (Linux machines).

Once you have it installed you’ll need to turn it on before you can use it. Navigate to the folder where you installed it. You’ll see two programs, one called XAMPP_START and the other called XAMPP_STOP. Every time you want to run XAMPP you need to click on XAMPP_START. Make sure you turn it off before you turn off the computer, otherwise you may get a startup error the next time you try to use it. It’s not going to keep XAMPP from working but its annoying (and has a really loud beeping noise).

Now that XAMPP is on you can make sure it installed correctly. Open a browser window (Internet Explorer, FireFox, Opera, Netscape, whatever you like most). In the address bar type in: http://localhost

One thing to understand here. You don’t have to be online for XAMPP to work. In fact that’s what makes it so powerful. Now you can test all your files and programs right from your computer at home even if you don’t have Internet access.

If you’ve installed XAMPP correctly you’ll see an orange and white screen that shows some demo programs. Take a look through them, there’s a few neat things. You’ll also see information about what’s currently running. One of the great things about XAMPP is that you can switch from php version 4 to php version 5. This is extremely useful for people who want to switch over scripts from one version to another. That way you can iron out any problems you have and fix them before you switch.

The next question is, where do you put your files to test things? Easy. Navigate to where you installed XAMPP. You’ll see a folder called htdocs. All of your php should go in that folder. For convience, its easier to make a folder called testing inside of htdocs because you’ll end up with a lot of stuff in there and all the demo programs are in there too.

So inside {XAMPP_install_path}/htdocs/testing you can now write and test your code! Let’s say you make a file called helloword.php inside of testing. That means it’s {XAMPP_install_path}/htdocs/testing/helloworld.php. To view this file open a browser window and type in: http://localhost/testing/helloword.php

Presto! Your php works!

But there’s one other thing that’s essential. MySQL. XAMPP comes with phpMyAdmin, which you may or may not be familiar with. It helps you setup all of your databases with a graphical interface. To get to it start XAMPP then go to http://localhost/phpmyadmin

So there you have it. Now you know how to get XAMPP, install it, start/stop it, add files so you can see them, and access phpMyAdmin to help you setup your databases.

And you didn’t need to pay for hosting 🙂

Now, are you ready to learn some PHP? Read our three part Learn PHP tutorial to get you started in the right direction. Try putting some of the example code into your helloworld.php file and see what happens.

AJAX Tutorial: Hangman Game (no database required)

Comments 6 Standard

Last year I made an PHP tutorial of an OOP Hangman game (no database required) for a Siminar I spoke at. This year as a part of my new Game Tutorial Series I’m adding a new tutorial to my collection. This tutorial will teach you how to modify the PHP hangman game we created and add some AJAX to it using jQuery so we don’t have to refresh the page every time we guess a new letter or start a new game. If you haven’t followed along with the original PHP tutorial I would strongly suggest you do as I won’t touch on anything introduced in the last one.

Download the Working Source Code
.zip archive

Getting jQuery

First thing is first we’ll need to get the jQuery library before we start updating any code. For those of you that don’t know, jQuery is code library that makes doing JavaScript quick and pretty painless. You can download or link to a copy offered on a Content Delivery Network (CDN) like Google Code. Personally I recommend downloading a copy if you’re going to post this game on a high traffic/visibility website. Sometimes if you link to a copy of jQuery on a CDN your site can experience lag and/or delays if the CDN is slow and your game won’t work at all if the CDN is down. On the other hand if you have a small website or limited space to store your files then there’s no need to download a copy of jQuery, linking to it is a better option. In this tutorial I’ve downloaded and included the jQuery file in the js folder of the .zip archive.

Setting Up For AJAX

Because we want our game to display using AJAX we need to create a new JavaScript file called hangman.js. This is what we’ll use to make all of our AJAX calls and respond to the player’s input.

Now that we have two JavaScript files we have to update our index.php file so it knows both of those JavaScript files are necessary to run the game. In the <head> tag, under the link to our stylesheet, we add two lines of code that tell our browser to load our JavaScript files:

<head>
        <title>Hangman</title>
        <link rel="stylesheet" type="text/css" href="inc/style.css" />
        <script language="Javascript" src="js/jquery-1.7.1.min.js"></script>
        <script language="Javascript" src="js/hangman.js"></script>
</head>

We also need to remove our $_SESSION[‘game’][‘hangman’] check from the top of our index file. Our AJAX calls will be running the game so it’s no longer necessary here. However we leave the session_start() at the top of the page so that if the player accidentally refreshes the page they don’t loose the game they had in progress.

Next we remove the code  inside of our <div id=”content”> and set that aside for later because we’ll need to use parts of it in our AJAX. In it’s place we’re going to enter a loading message. This is what the page will display before the AJAX calls have finished processing.

<body>
        <div id="content">
        <center>Loading Hangman.... please wait.</center>
        </div>
</body>

Writing the Hangman.js File

Now it’s time to jump into jQuery and AJAX.

$(document).ready(function() {

    //start the game when the page loads
    playGame();

});

jQuery uses a special function to check when the page has finished loading. Anything you put inside of this function will run as soon as the page is loaded, or in response to something someone has done on the page, like mouse clicks or using the keyboard. For this tutorial all we need it to do is call our AJAX function that will load and display the game to the content div on our index.php file.

/***
* Purpose: play hangman
* Preconditions: none
* Postconditions: new game has started or existing game is in play
***/
function playGame()
{
    $.ajax({
        url: 'ajax/index.php',
        data: {type: 'playGame'},
        success: function( data ) {
            $("#content").html(data);
        }
    });
}

Inside of our playGame() function we use AJAX to tell the browser to load our ajax file and send it some data (the type of action we’re doing, whether or not to start a new game, the letter the player guessed). Then we use a success callback function to load the results of our ajax call onto the page. A callback function is a function that runs as a result of being called by another process. In this case our callback function, success,  is loading the data we’ve retrieved through AJAX and putting it into the content div’s HTML property.

/***
* Purpose: guess a letter
* Preconditions: none
* Postconditions: game status updated
***/
function guessLetter()
{
    //make sure they've entered something into the box
    if (!$("#letter").val()) {
        alert("You must enter a letter.");
        return;
    }

    //check to make sure they've entered a letter
    if (!isLetter($("#letter").val())) {
        alert("This is not a letter. Please enter a letter.");

        //clear out the value in the input box
        $("#letter").val("");
        return;
    }

    //if it was a letter then submit the guess
    $.ajax({
        url: 'ajax/index.php',
        data: {type: 'playGame', letter: $("#letter").val()},
        success: function( data ) {
            $("#content").html(data);
        }
    });
}

/***
* Purpose: check to see if a value is a letter
* Preconditions: value to check
* Postconditions: returns true if this is a letter
***/
function isLetter(value)
{
    var lettersOnly = /^[a-zA-Z]+$/;

    //check to make sure there are no numbers and the value isn't more than 1 characters
    if(value.match(lettersOnly) && value.length == 1)
        return true;

    //otherwise this isn't a letter
    return false;
}

If we want to respond to someone trying to guess a letter we use a fairly similar process. Our guessLetter function checks to make sure the player has entered a value into our letter input box, then checks to make sure the value inside of it is really a letter, and finally uses an AJAX call to update the game by passing it the letter entered.

/***
* Purpose: start a brand new game
* Preconditions: none
* Postconditions: new game has started
***/
function newGame()
{
    $.ajax({
        url: 'ajax/index.php',
        data: {type: 'playGame', newgame: true},
        success: function( data ) {
            $("#content").html(data);
        }
    });
}

The last piece of our ajax file is the newGame function. When the game is over we want to make sure we use AJAX to update the game state and then refresh the page to a new game.

Writing the AJAX File

Now that our JavaScript file will send AJAX requests we need to write the file on the other end of the request — the file that responds to the data we’re sending it. Create a new folder and name is ajax. Inside of it make an index.php file. Inside of the file put the following:

<?php
//include the required OOP files
require_once('../oop/class.game.php');
require_once('../oop/class.hangman.php');

//this will keep the game data as they make a new ajax request
session_start();

//respond to AJAX requests
echo doAction($_GET);

function doAction($getdata)
{
    switch ($_GET['type'])
    {
        case "playGame":
            return playGame($getdata);
        default:
            return "Invalid option selected.";
    }
}

/***
* Purpose: Display and play the game
* Preconditions: a game exists
* Postconditions: the current game is displayed to the screen
***/
function playGame($getdata)
{    
    //if they haven't started a game yet let's load one
    if (!$_SESSION['game']['hangman'])
        $_SESSION['game']['hangman'] = new hangman();

    echo "<h2>Let's Play Hangman!</h2>";
    $_SESSION['game']['hangman']->playGame($getdata);
}

In this file we have two functions, doAction and playGame. Both functions take the $_GET data sent by our AJAX calls and do various things depending on the data sent to them. doAction is run every time this ajax file loads. It decides which function it needs to call, depending on the type we’ve sent it, and then returns the result to the screen.

Now pull up that code I had you set aside earlier. We’re going to move that into our playGame function with a few adjustments. We no longer need the <form> tags around our game data. In addition instead of sending $_POST data to our hangman object we’re now sending $_GET data.  The $_GET data contains the information we were previously posting from the <form> tags. Since AJAX is refreshing what appears inside of our content div there’s no reason to use our <form> and $_POST variables anymore.

Last But Not Least

We’re almost done! Before we can view our handy work we need to open our hangman OOP file. Anywhere we had a $_POST statement we need to change that to a $_GET since we’re no longer using the $_POST variable.

Finally,  we need to update our new game and guess buttons so they run the newGame and playGame javascript functions we wrote earlier:

<input type=\"text\" name=\"letter\" value=\"\" size=\"2\" maxlength=\"1\" id=\"letter\" />
<input type=\"submit\" name=\"submit\" value=\"Guess\" onClick=\"guessLetter()\" />

<div id=\"start_game\"><input type=\"submit\" name=\"newgame\" value=\"New Game\" onClick=\"newGame()\" /></div>"

Conclusion

Well, that wasn’t so hard now was it? Try the working version to see what it’s like! In this tutorial we took our existing PHP Hangman game and modified it to use AJAX. If you play the game you’ll see the page no longer has to refresh each time you click the guess letter button or the new game button. To accomplish this we first downloaded jQuery, created a JavaScript file to make AJAX requests, wrote a file to return a response to our AJAX requests, and then updated our hangman class to use $_GET and our new JavaScript functions.

$30,000 in prizes for your Flash games

Comment 1 Standard

Adobe and FGL Present: Cell Your Game Contest

Maybe you’ve heard the news: the newest Android mobile OS fully supports Flash. Guess what that means? Now’s the time to break into a brand new market for Flash games! Adobe and FGL are proud to host a very special contest exclusively for members of FGL. Create or port a game for mobile Flash platforms and you could win fabulous prizes — not to mention open a whole new world of players and profit. There are over $30,000 in cash and prizes and 150 games will win at least $100. Go on, check it out!

To say that we are excited about this new Flash game market would be a huge understatement. We’ve created a new forum full of guides, FAQs, and support to help you take advantage of this new frontier. Adobe is providing us with the latest guidelines, APIs, and tools, and we’ll make them available to you here.

It’s not every day that you get a chance to get in on the ground floor of a new audience for your games. And you may already have a bunch of great games that fit the mobile platform. You can back-port your catalog, or you can create new games that take advantage of the special features of Android phones, such as the accelerometer and touchscreen.

You’ve got nothing to lose and tons of money to gain. Come on!

Super Mario Programming Competition

Leave a comment Standard

Do you want to program your own Super Mario bot, that makes use of the
latest AI techniques (or your favourite dirty hacks) to guide Mario
through challenging levels? Or do you want to create an automatic
procedural level generator, that creates new levels that provide
optimal entertainment for individual human players with particular
skills and preferences? http://www.marioai.org

Are you ready to compete with researchers and programmers from around the world?

The 2010 Mario AI Championship will be held in conjunction with three
international conferences: EvoGames (part of EvoStar), IEEE World
Congress on Computational Intelligence and IEEE Conference on
Computational Intelligence and Games.

The competition is the extended successor to last year’s Mario AI
competition, which attracted the attention of leading international
news media and from which the video of the winning entry has been
shown more than 600.000 times on YouTube.

This year, the competition has three tracks:
– Gameplay track, where the goal is to submit an agent that can make
Mario survive through a number of increasingly difficult levels. This
track is similar to last year’s competition, but includes much more
difficult levels. Organized by Sergey Karakovskiy and Julian Togelius.
– Learning track, where the agent needs to learn how to play a
particular level optimally during a number of attempts. Organized by
Sergey Karakovskiy and Julian Togelius.
– Level generation track, where competitors submit level generators,
that generate fun levels according to player metrics and other
software-provided specifications. The levels will be tested “live”
on-site during the associated conferences. Organized by Noor Shaker,
Julian Togelius and Georgios Yannakakis.

The deadline for the EvoStar edition of the championship is April 1st;
deadlines for the WCCI and CIG editions are yet to be set, but will be
close to the relevant conferences (July and September).

Read more and download source code:
http://www.marioai.org

Please note that participation in the conference is not restricted to
academic researchers; professionals and students are also encouraged
to participate. Also note that the competition makes for excellent
class projects. We’re looking forward to see your entry in the
competition!

Julian Togelius
Assistant Professor
IT University of Copenhagen
Rued Langgaards Vej 7, 2300 Copenhagen S, Denmark
mail: julian@togelius.com, web: http://julian.togelius.co

Video Game References: 3D Models, Degrees, Associations & Other Useful Links

Leave a comment Standard

I find that I visit so many different sites I can’t keep them straight and I can’t remember to update my delicious account. So I started adding them as resources on my main website when I found one I liked or wanted to go back to someday in the future. Here’s a list you may want to check them out for yourself. I’ve added my own comments and knowledge thrown into the mix:

Game Engines

Crystal Space 3D

Dark GDK

G3D Engine – good tool libraries, large free model collections

jMonkey Engine

Panda3D

Torque Engine – popular with independent developers

Unreal Engine – it’s a classic… now available for free.

MMO Specific

Unity 3D – in browser 3D MMO games, quickly gaining popularity as an engine. Has iPhone and Wii capabilities.

Big World Technology

Byond – not really an engine so much as a point and click game maker

Hero Engine

Irrlicht – i really like this one, runs fast, lightweight, nice toolset. Free. Showcase includes

Multiverse

Ogre 3D – i found this one to be way too complicated and not very well planned out. API was hard to use and understand if you want something you can just jump into and start programming.

Realm Crafter

Flash Specific

SmartFoxServer – Specifically for Flash MMOs.  I’ve chosen this one for an MMO I have in production. Free for up to 20 users, license required for 100, 500, and unlimited users ($300 – $3,000 dollars). Showcase games include Club Penguin, Atlantas and facebook’s app YoVille, and Build-a-Bear Workshop.

Red5 Server – Completely open source and free. If you’re looking to build on your own functionality this one is for you

Electro Server – Haven’t had a chance to play around with this one but it has a free 25 user version. Licenses for up to 500 – 200,000 users ($700 to $4,500+) — no unlimited license that I could find.  Showcase games include WebKinz, Nickeldeon and Barbie Let’s Chat.

3D Models

3D Cafe

3D Links

3D M3

3D Revolution

TurboSquid – largest collection of models made in Maya

WireCase

Quality 3D

Poitra – expensive but nice stuff

Exchange 3D

DAZ 3D

Archive 3D – all free models

3D Extras – free models

Amazing 3D

3D Software

Maya – industry leader, costs a fortune though

3Ds Max – also an industry leader but cheaper than Maya. Owned by the same company.

Blender – free, can integrate python and lua scripting. Good support community, so-so documentation.

Drawing & Art Software

Photoshop -leading graphic art software, if you don’t have this you might as well quit now…

Painter – exclusively for people drawing with tablets

Gimp – essentially a free version of photoshop

Associations

ECA – Electronic Consumers Association

ESA – Electronic Software Association

ESRB – Entertainment Software Rating Board

IGDA – International Game Developers Association

Artists

Geninne – artist in Mexico, I want her on one of my projects one day

Creative Thursday – artists post to a new topic every thursday, great way to find a diamond in the rough

Illustration Friday – same as Creative Thursday with a bigger following

Simon Reeves – freelance 3D artist. Has done several commercials so I doubt he’s cheap.

Sarah J How – worked with her on graphics for one of my pet games. Highly recommended. She was a texture/character artists for Deep Red Games, looks like she’s running her own studio now.

DeviantArt.com – tons of various artists. As a last resort you can probably find someone here.

SQL Tutorial: Easily Update Rows Based on Complex Joins

Comment 1 Standard

There are a lot of times I’d like to update hundreds of rows in a database based on a complex set of conditions. In doing a traditional update SQL statement there is no way to pull in joins and compare the values. My little cheat for this is to run a select statement that generates all the appropriate update statements. Then all you have to do is run the resulting SQL string.

For example: Lets say you have a car racing game. You added a new garage feature where members can sort their cars into the appropriate garage. By default you gave each member their own garage when you created the new feature. Now you want to update each car belonging to every member so that it is placed inside the appropriate garage. You could build something like the following.

select ("update cars set garage='" + G.id + "' where car_id='" +  C.id + "';") as SQL from garage G
inner join cars C on C.owner = G.owner

This would give you results along the lines of:

update cars set garage='2' where car_id='3421';
update cars set garage='2341' where car_id='133212';
update cars set garage='4452'' where car_id='98321';