Montag, 16. August 2010

666

When I looked at the cover of my Doom³ Edition, the number 666 came in mind when I looked at the pentagram.

666, known as the number of the beast. Even Iron Maiden gave this biblish the number a tribute. A number with some very strange properties. Let me give you some examples:

1) Roman numerals are based on seven symbols: I V X L C D M
Now use the first 6 symbols and add them: I + V + X + L + C + D
= 1 + 5 + 10 + 50 + 100 + 500
= 666
(ok, everyone with a little knowledge of mathematics can see that this isn't really strange. Roman numerals are decimal with a base of 10 and a help-base of 5 and because 1+5=6, 10+60=60 and 100+500=600, we have this strange looking result).

2) We take a look at the first nine numbers: 123456789
Let's insert some "+" to see if we may reach a result of 666:
666 =1+2+3+4+567+89
and
666 = 123+456+78+9
strange...

3) ...maybe it works with 987654321, too:
666 = 9+87+6+543+21

4) and here is another example for a calculation with this strange number:
1^6-2^6+3^6 = 666

5) Let's make it a bit more difficult...
The 666 is equal to the sum of the squares of the first 7 primes
2²+3²+5²+7²+11²+13²+17²=666
(that's a bit more curious...)

6) Let's stay at the primes. Now it's getting scary:
A.W.Johnson made the apocalyptic magic square. It's 6x6 rows.
The sum of each row horizontal and vertical, every diagonal and every half diagonal have the sum 666.
All 36 numbers are primes and all primes are different. Try to beat this...
+                             +
     3  107    5  131  109  311
     7  331  193   11   83   41
   103   53   71   89  151  199
   113   61   97  197  167   31
   367   13  173   59   17   37
    73  101  127  179  139   47
+                             +

7) Well, let's stay at the magic squares. Rudolf Ondrejka constructed a magic square made of numeral palindromes:
232  313  121
111  222  333
323  131  212
The sum of every row is the palindrome 666.

8) When you think it couldn't be more strange, Dr.Ondreika found another magic square:
320  169  138  39
26  151  208  281
195  294   13  164
125  52  307  182
mmh...doesn't look very interesting. But:
  • every row is in sum 666
  • every column is in sum 666
  • the diagonales are in sum 666
  • all halfdiagonales (169+26+307+164) are in sum 666
  • and (I told you it's strange) the numbers in the corners of all four 3x3 sub-squares (320+138+13+195) are in sum 666, the numbers in the corners of all 2x4 sub-squares are 666, too and at last all four numbers in the corners of our strange magic square are 666 in sum.
You think we are finish with this? No ;-)
On each number of this square, calculate modulo 9 and the resulting square is:
5  7  3  3
8  7  1  2
6  6  4  2
8  7  1  2
What do we have now? Look at the third column. Yes, that's Pi (3,141).
The fourth column has the 666 hidden (3x222) and the third row, too (6/6/4+2).

9) Killed your brain? A simple last one: write all numbers from 1 to 36 in a 6x6 square.
If you calculate 1+2+3+4+5+...+36 the result is 666.

I could go on and on with stuff like this...but the only question I'm thinking about is:
Was the 666 chosen as the number of the beast because you can do all these strange things with this number, or can you do all these strange things with this number because it's the number of the beast?
Sounds to me like the hen and egg problem...


Next post will be part four of my tutorial...I promise ;-)

PS: a beer for everyone who finds out what's strange at the post time...

Donnerstag, 24. Juni 2010

Did you know...

...that the supernatural 1st person shooter Wolfenstein is the sequel of the award winning, ass kickin' Return to Castle Wolfenstein? I'm sure you know. Both titles are based on Wolfenstein 3D, one of the very first 3D 1st person shooters, developed by id Software in 1992.

But did you know that Castle Wolfenstein was not the idea of id Software? The Castle Wolfenstein within a World War II scenario was designed by Muse Software back in 1981 - 11 years before Wolfenstein 3D - and released under the title Castle Wolfenstein. The game was developed for Apple II and later ported to C64, DOS and Atari. Designer was Silas Warner.
The sequel Beyond Castle Wolfenstein was released three years later in 1984.

After Muse Software closed down in 1987, id Software bought the rights for Castle Wolfenstein to create their first 1st person shooter - Wolfenstein 3D.

Mittwoch, 23. Juni 2010

Browsergame Tutorial - Part III

Browsergame Tutorial - Part III
User Management

A big difference between a browsergame and a tiny flashgame on a webpage is the opportunity for players to play against other players. This means real interaction between all players and not only different names in a highscore list. With this in mind, it's necessary to implement a user management to store a lot of user data in our database.
Let's start collecting information we want to store for each user:
  1. User ID. Each user should have a unique ID that will be our primary key in the user table of our database
  2. Unique user name. All players should be shown by name in the game
  3. Password. For the login, each user needs a password.
  4. E-Mail address. For the opportunity to contact the player, we need an E-Mail address.
  5. Date of registration. For statistics, it's nice to have a registration date stored in the database.
  6. Last login. To filter out dead accounts, we should add a field for the last login date.

Ok, enough information for now. We can add more fields we need to our user table later.

Now open your database administration tool and add your first table to the game database. I call my table players. The fieldnames/fieldtypes are:
  • userid (INT) - primary, autoincrement
  • username (varchar 64)
  • password (varchar 40)
  • email (varchar 255)
  • date_reg (INT)
  • date_login (INT)
Next we need a form for players to signup:

register.php
<?PHP

$content = "
    <form action=\"./register.php\" method=\"post\">
   
        <b>Registration</b><br><br>
   
           <table border=\"0\" cellspacing=\"0\" cellpadding=\"3\">
           <tr>
           <td width=\"40%\" valign=\"bottom\">Player name:</td>
           <td><input type=\"text\" name=\"playername\" class=\"form\" value=\"$name\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">Password:</td>
           <td><input type=\"password\" name=\"password1\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">Confirm Password:</td>
           <td><input type=\"password\" name=\"password2\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">E-Mail address:</td>
           <td><input type=\"text\" name=\"emailaddy\" value=\"$email\"></td>
           </tr>
           <tr>
           <td colspan=\"2\"><input type=\"submit\" value=\"register\"></td>
           </tr>
           </table>
     </form>
    ";
?>

Next we must extend this script to process the data. As you see, the form sends the data to the same script, so the whole registration will be handled by this script.
I used differend variable names for the POST variables and the local variables (ex. emailaddy and email). I recommend this for two reasons. On older php versions, local variables can be injected by GET variables and to prevent SQL injection, your variables should not give a hint how your database fields are named.

So, what to do? Any idea? Right. We must implement the following steps:

take the POST reguest
check information
write to database or generate error
forward the user to the game page

We should also think about, how the server should store the user data while the player is logged in. The php session management can be your solution. I'll store the playername as session variable.

This could be done like this:

register.php
<?PHP
session_start();

require"./template/settings.php";
require"./template/mysqlconnect.php";


//initialize other vars
$error = "";


// *** take the POST reguest ***
//check if playername is submitted
if( isset($_POST['playername']) ){
    //if so, fetch all POST var
    $name  = $_POST['playername'];
    $pw1   = $_POST['password'];
    $pw2   = $_POST['password2'];
    $email = $_POST['emailaddy'];


     // *** check information / generate error *** 
    if( empty($name) ){$error = "Please choose a player name";}
    elseif( empty($pw1) ){$error = "Please choose a password";}
    elseif( empty($pw2) ){$error = "Please confirm your password";}
    elseif( $pw1 != $pw2 ){$error = "Your passwords does not match";}
    elseif( empty($email) ){$error = "Please enter an E-Mail address";}
    else{
   
        //turn password into an MD5 string
        $pw1 = md5($pw1);
   
        //timestamp
        $timestamp = time();
   
        // *** write to database ***
        $query = "INSERT INTO players (username, password, email, date_reg,     date_login) VALUES ('$name', '$pw1', '$email', '$timestamp', '$timestamp')";
    mysql_query($query);
   
        //register session variable
        $_SESSION['name'] = $name;
   
        //forward to game
        header("Location: ./index.php");die;

}

 }else{
    //if not, initialize empty local vars
    $name  = "";
    $pw1   = "";
    $pw2   = "";
    $email = "";
}

$content = "

    $error
   
    <form action=\"./register.php\" method=\"post\">
  
        <b>Registration</b><br><br>
  
           <table border=\"0\" cellspacing=\"0\" cellpadding=\"3\">
           <tr>
           <td width=\"40%\" valign=\"bottom\">Player name:</td>
           <td><input type=\"text\" name=\"playername\" class=\"form\" value=\"$name\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">Password:</td>
           <td><input type=\"password\" name=\"
password1\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">Confirm Password:</td>
           <td><input type=\"password\" name=\"
password2\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">E-Mail address:</td>
           <td><input type=\"text\" name=\"emailaddy\" value=\"$email\"></td>
           </tr>
           <tr>
           <td colspan=\"2\"><input type=\"submit\" value=\"register\"></td>
           </tr>
           </table>
     </form>
    ";
  
require"./template/template.php";
mysql_close($link);

?>

As you see, this is a real smal solution for a signup script. Maybe you want to add a little more. You should think about some importent functions:
  • a way of making your SQL statement injection save
  • check if the entered E-Mail is a valid address
  • exclude playernames like "F*cker", "Bitch" or "Hitler"
  • exclude trashmail addresses
  • send a mail to inform you for new signups
  • let the player agree terms and conditions or a disclaimer
  • add a confirmation script for closed-loop authentication
  • prevent session hijacking 
  • maybe you want to use https for submitting the data
But even if you add all this stuff, the best registration form is useless, if the player has no opportunity to login after registration.
Sounds evident...

So we must add a login page.
Oh oh, lot of work. We are already in part three of this tutorial and still not a single line of code for our game functions. Anyone likes to give up? Maybe you with your bored face? No? Ok, let's finish this part with the missing login page.

We need another form to submit the username and password. If you bought a certificate for https, you should use the save connection to submit the user data. In my example, I'll use a normal http connection.
When username and password are send, we must check our database if the password fits to the user. If everything is ok, we can register the session:

login.php
<?PHP
session_start();

require"./template/settings.php";
require"./template/mysqlconnect.php";

// *** take the POST reguest ***
//check if playername is submitted
if( isset($_POST['playername']) AND isset($_POST['password']) ){
    //if so, fetch all POST var
    $name  = $_POST['playername'];
    $pw    = $_POST['password'];

    $pw = md5($pw);
    
    //check User-Password combination in database
    $userid = 0;
    $query  = "SELECT * FROM players WHERE username='$name' AND password='$pw'";
    $result = mysql_query($query);
    $row    = mysql_fetch_array($result);
    $userid   = $row['userid'];    
    $username = $row['username'];    
    if( $userid > 0 ){
        
        //register session variables
        $_SESSION['userid'] = $userid;
        $_SESSION['username'] = $username;
        
        //Update last Login
        $ts = time();
        $query = "UPDATE players SET date_login='$ts' WHERE userid='$userid'";
        mysql_query($query);
        
        //forward to game
        header("Location: ./index.php");die;
        
    }

}

//initialize other vars
$error = "";
    
$content = "

    
    
    <form action=\"./login.php\" method=\"post\">
   
        <b>Login</b><br><br>
           $error
           <br><br>
           <table border=\"0\" cellspacing=\"0\" cellpadding=\"3\">
           <tr>
           <td width=\"40%\" valign=\"bottom\">Player name:</td>
           <td><input type=\"text\" name=\"playername\" class=\"form\"></td>
           </tr>
           <tr>
           <td width=\"40%\" valign=\"bottom\">Password:</td>
           <td><input type=\"password\" name=\"password\"></td>
           </tr>
           <tr>
           <td colspan=\"2\"><input type=\"submit\" value=\"login\"></td>
           </tr>
           </table>
     </form>
    ";
   
require"./template/template.php";
mysql_close($link);

?>

My Blog screwed up the formatting a little bit, but I guess you'll be able to fix it or you'll make your own formatting.
Well, so far, everything is fine.
When you shake your head while reading this, you found out that not everything is fine ;-)
Two important parts are missing. First, we need to add a logout page, but this could be done very simple. The more important missing part is a check if a username is already registered. Right now, every player can register with the username "Zapp". Each Zapp will have a unique User-ID, but it looks very stupid in the highscore with double and triple usernames.
We need to add a query in the register.php, between 

//check if playername is submitted
and

// *** check information / generate error ***


    $userid = 0;
    $query  = "SELECT
userid FROM players WHERE username='$name'";
    $result = mysql_query($query);
    $row    = mysql_fetch_array($result);
    $
userid    = $row['userid'];   

Now we need to add a fifth elseif line in the // *** check information / generate error *** section, between the first and second line (check for username and password):
elseif( $userid > 0 ){$error = "Player name already registered";}

Now we are nearly finish with part 3 of our tutorial. Last script is our logout page:



logout.php
<?PHP
session_start();

// LOGOUT
unset($_SESSION['userid']);
unset($_SESSION['name']);
session_unset();
session_destroy();

header("Location: ./index.php");

?>

When you finish your work, it should look like this:


Register Page
Login Page
Logout Page

Montag, 14. Juni 2010

Browsergame Tutorial - Part II

Browsergame Tutorial - Part II
The Basics

Ready for part two? After some theorie and praising the gods in part one, we'll now start with some code for our game.

First of all, we should separate the design from the game code. Cause a tutorial is always limited in space and time, I choose a simple way to do this. Let's create a php script with simple HTML output as game template and save it as template.php in a subfolder called template. We'll add some designs later. It could look like this:

template.php
<?PHP
    echo("
    <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">
    <html>
    <head>
    <meta http-equiv=\"content-type\" content=\"text/html; charset=ISO-8859-1\">
    <meta http-equiv=\"Content-Style-Type\" content=\"text/css\">
    <meta name=\"keywords\"       content=\"Browsergame, Browsergame Tutorial, Hell on Roads\">
    <meta name=\"author\"         content=\"PlanetZapp\">
    <link rel=\"stylesheet\" type=\"text/css\" href=\"./template/gamestyle.css\">
    <title>Hell on Roads</title>
    </head>
    
    <body>
    <h1>Hell on Roads</h1>
    
        $content
        
    </body>
    </html>
    ");
?>

Don't forget a variable for our game output. I called it $content.
Now create a simple stylesheed and save it as named in the template.php:

gamestyle.css
h1 { font-size:19pt; margin-bottom:6px; }
h2 { font-size:16pt; margin-bottom:5px; }
h3 { font-size:14pt; margin-bottom:0px;}
h4 { font-size:12pt; margin-bottom:0px;}
li.normal {list-style-type:disc;}
pre.normal { color:#000000; }
body { color: #ffffff; background-color: #000000; }
body,div,h1,h2,h3,h4,p,ul,ol,li,dl,dt,dd,td,th,address,blockquote { font-family: Verdana,Arial,Helvetica,sans-serif; }
body,p,ul,ol,li,dl,dt,dd,td,th,address,blockquote { font-size:8pt;}
div { margin:0px; padding:0px;}
a {    color:#e59c40; font-weight:bold; text-decoration:none;}
a:link { color:#e59c40;    font-weight:bold; text-decoration:none;}
a:hover { color:#ababab; font-weight:bold; text-decoration:underline;}
a:visited {}


As good things are three, we need to add an index.php, for our first test. Don't forget to include your template at the end of the script. I use "require", but you can also use "incude":

index.php
<?PHP

    $content = "The new browsergame "Hell on Roads" in developement";
    
    require"./template/template.php";

?>


Test your output by calling the index.php in your browser (for local webservers http://127.0.0.1/mygameproject/index.php). It should look look this:

http://www.planetzapp.de/planetzapp/browsergame_tutorial/part02/index.php


Now it's time to bring in our MySQL database. To create the database, use any MySQL query tool. The most simple way to create, view and manipulate your database is phpmyadmin.
Create a new database called hellonroads (or whatever you like) and add a user that can SELECT, UPDATE, DELETE and INSERT in this database.
Here is the SQL statement to create the database. Execute it in the SQL-query window:
CREATE DATABASE `hellonroads` ;

To connect our game to the database, we need a script to build the connection. This could be done with this simple code:

mysqlconnect.php
<?PHP
    $mysqllink = mysql_connect("{$dbhost}", "{$dbuser}", "{$dbuserpw}")
    or die("Connection failed: " . mysql_error());
    
    mysql_select_db("{$db}") or die("Database selection failed");
?>


You can remove the die-statements later, but during developement it's good for debug.
As you see, I use variables for the database, host, user and password. This makes it easy to switch between differend databases, for example between the developement database and the public database.
Now we need to define and set our variables in a script called settings.php:

settings.php
<?PHP
    $dbhost   = 'localhost';      # your host where the database is located
    $db       = 'hellonroads';    # your database name
    $dbuser   = 'reader';# a database user that can select, insert, update, delete
    $dbuserpw = 'mypassword';    # the user's password
?>


I saved both scripts in the template folder, but it's up to you where to store it.
At last we must add both scripts to our index.php (note that the settings must be included before the database connect to have our variables filled) and close the database connection at the end of the script:

index.php
<?PHP

    require"./template/settings.php";
    require"./template/mysqlconnect.php";
    
    $content = "The new browsergame <b>Hell on Roads</b> in developement";
    
    require"./template/template.php";

    mysql_close($mysqllink);

?>


Well, we have separated script and template and build our database connection. I guess we are prepared for part three.

Mittwoch, 9. Juni 2010

Browsergame Tutorial - Part I

Well, I decided to write a tutorial how to make a browsergame. This tutorial will be primary for beginners, but I guess some experts out there will have fun, too and maybe learn a few things they have not thought about. 
The tutorial requires that you use your brain and turn your own ideas into script code. This is not a copy&paste tutorial to build the ass kicking browsergame you ever dreamed of.
Please do not repost this tutorial on other webpages, forums, on DVDs or in printed form. Please contact me if you like to publish the whole tutorial or parts of it.
Here we go...


Browsergame Tutorial - Part I
Some thoughts what we will do

First of all, I know we all have thousands of good ideas, how the best browsergame ever should look like. Have we? Sure, we have ;-)
Then let's start with a document. Yes, we are not going to start working on cool graphics or with an editor for script code, we must transform our ideas on a piece of paper. Sounds boring but it helps to keep the focus on the project and will show us if it's really a good idea.
I prefer Excel or any other table calculation application, for the first document - the Pitch Doc.
The Pitch Document is very popular in the game business and if you are a good writer, you can use it as reference when you knock at the door in the games industry. 
Ok, back to our browsergame. The dokument should contain at least six paragraphs you should think about:
  1. Management Summery
  2. Story
  3. Audience Analysis
  4. Market Analysis
  5. Gameplay
  6. Costs and Timeline
Let me explain all parts of our document in a few words:
The Management Summary is - as it says - for the management. If you give your document to someone who should produce your idea, this first part should give a detailed and easy to read overview of your idea. Keep in mind that these few sentences could open doors for you. 
The Story paragraph explains what the (browser)game is about and the Audience Analysis for what kind of players the game is focused on. The Market Analysis compares your idea with existing projects. What is outstanding in your idea, what does your browsergame have, that other games don't have? If you're planing a commercial (payed) browsergame, why do you think you will have success with your idea?
The next important part is the gameplay. Descripe what the player of your game can do, explain the movement/controlls, all look and feel.
With the Costs and Timeline you calculate how much money and time you and maybe some friends, business partners or co-workers must spend in realizing your idea.

The Pitch Doc should be one or two pages long. I prefer a one page document to have all facts in a view. 

One thing I havn't wrote about (yet) is the title. Because the title is very important for your game, take time to think about it more than two times. I always use a project title in the Pitch Document, that could be another than the final title. Best example was my last project. In the pitch doc I called it Orcs vs Elfs, but the final game was released under the title




You see, don't blow your mind with details you can think about later.

But now the tutorial example for a pitch doc. As I said in one of my first sentences, we have thousands of good ideas. Well...my idea...(15 Minutes later)...is a Rocker (Motorcycle) game:

Hell on Roads

Management Summery
The browsergame Hell on Roads is about the fictional life in the motorcyle scene. The goal is to be stronger, faster and cooler than other players. The game will be free to play with payable premium features.

Story
The player starts as a poor guy with a rusty, boring motorcycle. The goal is to get rich and cool and if the player likes, he can become a member of a motorcycle club. There are different ways to get money: legal or illegal. The player can deal with drugs and weapons or controll prostitution. The legal ways are working as a mechanic or building custom parts for motorcycles. All players can build their own motorcycles and drive drag races against each others. With raising experience of the players, they can build better cycles.

Audience Analysis
The main audience for the game are boys and men, ages from 15 to 35.

Market Analysis
Due to a lag of time I leave this part blank. Make a list of similar games you can find and list all major features of your game and the games you found in a table. It's perfect when your game has all major features of the other games and some features the other games don't have.

Gameplay
The game is controlled by mouse. All events and actions can be activated by mouse clicks.
List of actions the player can do:
- buy custom parts for the bike
- build and customize the bike
- go to work
- view highscore

Costs and Timeline
Resources needed:
1 php programmer
1 3D artist
1 web designer
The project can be realized in 10 weeks, with a minimum budget of 200$ for 3D content. Payment for the artists not included.




Ok, it's not perfect, but we have a doc we can work on...

Now let's talk about the programming language. Because we have the idea and also are the producer, we decide what the best way is to realize the project.

Flash seems to be the best solution for a biker game. You can add cool sounds and animations that let your game look cool and realistic.
But...yes there's a big but. Think about what kind of players play browsergames and where browsergames are played. Browsergames are very popular, because you can play them everywhere on any device with browser/internet connection and with any bandwidth. 
Sounds are sometimes cool, but in the case of a browsergame not a good choice. Think about the players who want to make a few clicks during work or while driving bus.
The more importent argument is that a browsergame is for many players the only solution to play a MMOG with a crappy modem or GPRS connection. You don't believe it? Let's make a short analysis of a similar example in the games world: World of Warcraft.
Since years, WoW is the leading online RPG with millions of players and billions of Dollars for Blizzard. In the past years, many online RPG titles came up, with much better graphics. But none of these games had the success of WoW. One of the main reasons for this is: the new titles need better and newer PCs with strong graphic cards and highspeed internet connections. The WoW engine runs on older PCs and even with a laggy 180ms pingtime internet connection. This is one reason (not the only one, but an important one), why many players keep on playing WoW.

If Flash is not the right solution, what else?
We need a HTML output and some skript language like php or Perl for the calculating stuff in the background. A database like MySQL or Oracle to store our values.
I decided to use php/MySQL for this project, cause MySQL is free and I don't have a snowboard - so no need to use Perl ;-)

For all beginners (our experts can skip these section):
We need an editor that supports SQL and php (the Windows Notepad Editor is a very bad choice) and a webserver with php support. If you don't have a webserver, Windows user can try http://www.apachefriends.org
For Linux, install the Apache2 Webserver that comes with most distributions.

Now, let's start with the most important part of any application. We call and praise the gods of php. Open your editor and save the following programm as hello.php in the htdocs folder of your webserver:

<?PHP

echo("Hello World");

?>

Open your browser, make sure your webserver is running and type http://127.0.0.1/hello.php
Your browser should now show Hello World.

Now you are prepared to realize your dream of your own browsergame.

Montag, 7. Juni 2010

zAppocalypse: Zapp has a Blog

Zapp finally reached the Blogger's world. If you're doing business over the internet, a blog seems to be important, as business cards are in Japan. Although my native language is German, I decided to write my posts in English, cause it's spoken by more people in the world. Please forgive me my (sometimes) atrocious English, but trust me, my Chinese and Spanish is much poorer.

My blog will be primary about what I know best and do best: gaming.