http://www.odditycinema.com

http://developer.yahoo.com/flash/maps/

1. Akismet

Owned by Automattic (thanks again Matt!), Akismet automatically deals with spam postings to blogs by auto indexing and removing them.http://akismet.com/

2. Gravatar

A really cool avatar tool which allows die hard bloggers to store their avatar on a single server and auto fetch it for your blog. Also part of the Automattic family. http://site.gravatar.com/

3. Exec-PHP

This cool little tool allows you to post PHP code into pages or posts and execute it. http://www.soeren-weber.net/post/2005/08/18/50/

4. CG-FlashyTitles

Seriously cool method of implimenting Shaun Inman’s SIFR technique which allows "on-the-fly" replacement of text with Flash text.http://www.chait.net/index.php?p=310

5. wp-notable

Allows users to quickly add your pages and posts to social bookmarking websites such as Digg. http://www.calevans.com/view.php/page/notable

6. Feedburner Feed Replacement

Posts custom feeds to Feedburner while creating custom feeds. http://www.orderedlist.com/articles/wordpress_feedburner_plugin/

7. HighSlide

Not really a plugin but an extremely cool piece of JavaScript. The HighSlide script is used to create zoom in graphics throughout my site. http://vikjavev.no/highslide/

8. Semiologic Dofollow

Corrects a nasty little problem with WordPress by instructing Google (and other search engines) to follow links. http://www.semiologic.com/software/wp-fixes/dofollow/

9. Semiologic Frame Buster

Stops other websites from loading your blog into a frame.http://www.semiologic.com/software/wp-fixes/frame-buster/

10. Semiologic Search Reloaded

Improved search functions for WordPress. http://www.semiologic.com/software/wp-fixes/search-reloaded/

Web Domains

First off, a successful website needs a domain name. In my case, my domain is thisismyurl.com and it’s broken into two parts. The actual name “thisismyurl” and the Top Level Domain (TLD) which is the “com” portion of my name. Many people confuse the “www” as part of the domain, but really it’s what is called a sub-domain and can be literally anything that I want it to be.

A TLD can be .com, .net, .org or literally dozens of other options including country specific such as .ca or .co.uk. Many people also like to use country specific domains for special purposes such as the .tv domain which is really for the country of Tuvalu but can be used (for a fee) by anybody. Selecting the right TLD is important for artists as it says a lot about your business for example, if you are located in Toronto Canada you may like to use the .to TLD but the .la TLD makes little sense unless you’re in LA. Whenever possible, the .com TLD is still the best to purchase.

The next step in picking your domain name is to pick the name itself. Most common names are taken, as are a lot of combinations that you’d love to have so you have to be creative when coming up with domain names but be careful some companies take part in what’s called Front-Running which is basically a scam where they register domain names that are searched for and then hold the names for random. I use GoDaddy for my searches, to the best of my knowledge they’re legit.

Once you’ve picked your domain name and your TLD it’s time to register your domain. As I said, I use GoDaddy but there are hundreds of options out there, price should be a deciding factor for you as there’s very little else to judge the services based upon.

Web Hosting

Once you have a domain name, you need to start looking at web hosting. Web hosting is basically renting a small part of another computer that’s always connected to the Internet. Really there’s a lot more to it than that but basically … it’s a place for your website to live on the Internet.

For the past few years I have used BlueHost as my web host of choice. There’s a lot of reasons for this but basically, they’re fast, they’re friendly and they’re reliable. As an artist you should be focussed on your craft, not your hosting and BlueHost takes care of all the little problems for you.

Once you’ve signed up with BlueHost or your host of choice, you’ll have to tell GoDaddy where your website is located … think of it as forwarding your mail. Log into GoDaddy and click on the Domains option. Under “My Domains” you’ll find an option for Name Servers. You need to click the option for Custom Name Servers and replace the existing with “ns1.bluehost.com” and “ns2.bluehost.com”. This will tell GoDaddy that anybody coming to your domain should really go to BlueHost who will figure out what to do with you.

Websites

So now that you have a domain and hosting, you’re ready to have a website. There are literally thousands of ways to have a website and no one method is better than any other. In my opinion, the easiest way for a young artist to get on the website bandwagon is to install something called WordPress from the BlueHost control panel. Click Fantastico in your control panel to access the installer and walk though the steps to add WordPress to your base directory. In about a minute, you’ll have a world class, professional blog.

If you want something more custom, there are literally thousands of WordPress themes on the internet, you can hire a great (and local) web designer or you can learn to code your own. There are even companies who will turn your Photoshop artwork into WordPress themes for a small fee.

Summary

We’ve covered the technical matters of adding your website to the Internet in this post from the basics of registering a domain name to setting up a simple hosting and website account. Next time, I’ll introduce you to the secret art of self promotion on the web and how you can turn your simple website into easy cash.

Step One - Backup

It may sound silly but the first thing I do is click on the file folder icon under Files and select Reveal in Finder which opens the folder on my hard drive. I back this folder up completely but copy and pasting it to my desktop.

Step Two - Recache

Under the Site menu I select Advanced > Recreate Site Cache to make sure I have the most up-to-date data about my site.

Step Three - Web Documents

Now here’s where Dreamweaver gets sexy. In your File list, simple start selecting files that you think are suspect and hit the delete key. If they’re linked anywhere in the site, Dreamweaver will warn you that the file is links … and you don’t want to delete it. I do this with whole groups of files to save time, if it doesn’t let me delete them then I know at least one file is still live.

Step Four - Graphics

Once I’ve cleared out the Files list, I move onto images and start doing the same things. If the image is found in a web document, it will warn you before deleting this but an even better way to do it is to use the Copy dependent files option on the original files. This option is seriously cool … set your Remote folder to a new folder on your desktop and then back in the file list, select all your files but not the images folder. Now, upload your website to the remote folder. Dreamweaver will ask you if you want to include dependent files which includes any CSS, JavaScript, rich media or images that are included on the pages. The resulting folder will contain everything you need to upload to a website but none of the junk.

This tutorial is a very basic introduction to the Torque Game Builder engine and it’s also my first tutorial for the package, the resulting Code Free Pong For Mac and Windows game can be downloaded and played on Mac and Windows or you can download the Source Code directly to follow along.

Getting Started

Let’s get started by opening the Torque Game Builder and creating a new game called Pong. It will be an empty game to start with, so we’re going to have to import a couple of static graphics to get us started. I’ve already build the paddles and ball for your game, so you can download these files to get started without having to build them yourself. Now let’s import the files by switching to the Create panel and selecting the Create New icon () to import each of the two files.

The next step is to setup our game by importing some predefined files and is going to require that we first quit Torque Game Builder and save our level (I called mine LevelOne). Since Torque doesn’t recognize files added to the directory once it has started, we have to quit TGB for a few moments.

In your file manager, lets move the whole behaviors folder from our desktop to the appropriate folder which in my case is ../Pong/game/. We want to replace the existing behavior folder with the preprogrammed behaviors supplied by Garage Games. Once those files are copied, we can reload Torque Game Builder and continue building Pong by loading our previous game and then selecting File > Open Level or using the keyboard shortcut Control - O to load our existing level.

Setting Up the Ball

What we want to do now is drag the ball graphic into the middle of our screen and drop it, this will create a single white dot which will act as our ball. Switch from the Create Panel to the Edit Panel and look down the list until you see the Scripting tab, open it and lets name this object “ball” and then open the Collision tab. We want to set the ball to Send and Receive Collisions by clicking the appropriate check boxes. Once that’s done let’s switch the Collision Response to BOUNCE.

Now let’s take a quick look at what we’ve done here and make sure we understand it all. An understanding of the Torque basics will help us progress through the next part of the tutorial. We dragged a copy of the ball graphic into the picture, then we selected it and clicked Edit. Under that menu, we changed its name to ball. Next, we told it that the ball could both be hit and hit other things. Finally, we told it that when something hits it, the proper response is to bounce.

Adding Behaviors

In Torque a Behavior is a preprogrammed set of instructions used to help us get our games up and running faster, the team at GarageGames includes a variety of Behaviors in the TGB kit and we’re going to use them to create Pong. There are two behaviors we want to setup for our ball.

First, let’s add the Random Velocity behavior which will give our ball a random start angle at the beginning of the game. To add this, lets open the Behavior tab and use the pulldown menu to located it. Once that’s done, we’re going use the green + beside the menu to add it to our ball. If you’d like you can now preview the game and watch your ball spin wildly out of control in a random direction.

Back in Torque, we want to give your ball life and the ability for it to “die” so lets add the Takes Damage behavior and set its maximum number of lives to 19 since a game of Pong can only ever go to a maximum of 19 points.

Setting the World Limits

Now the ball can take damage and it can also bounce but we need to make the ball stay on screen so lets take a look at the World Limits tab and our limit mode to BOUNCE, this will ensure that if the ball hits the edges of the world it will bounce back.

To set the actual World Limits we have two options, we can type the appropriate world limit numbers into the box or we can do it graphically by rolling our mouse over the ball until we see an icon representing the World Limits. If we click onto that icon the screen will zoom out slightly and present you with a lightly shaded box. This box is your World Limits and represents where the call is allowed to travel in the game. Resize the box so the top and bottom are at the top and bottom of the outermost green box (which is the edges of our game screen) and do the same for the left and right but instead of being exactly on the edges, lets add a little space to let the ball fall off our screen. When you hit the Enter key, you’re returned to your game preview mode and you’ll see that the values in World Limits now represent the values of the box you resized.

My box has a Min. Bounds of X = -60 and Y = -38, the Max. Bounds are X = 60 and Y = 38. This represents the furthest from the center of the screen my ball is allowed to travel before it bounces and if you’d like to see it in action you can now preview the game which will show your ball randomly bouncing off the top and bottom of the screen as well as disappearing on the left and right but eventually bouncing back into the frame.

Killing the Ball

Our game is coming along great but the problem is obvious, when the ball goes off the left and the right side of our screen, the ball needs to die so lets drag a paddle in from the Create menu and then switch back to Edit. This isn’t really going to be a paddle but I want to show you how we can use the same graphic for multiple purposes in Torque Game Builder.

First, lets resize our paddle to stretch from the top of the outermost green line to the bottom of the outermost green line. Let’s go to the Scene Object tab where we should clean up the killzone values by setting it to Position Y = 0 (which will center it vertically) and set it’s X = 5 which puts it just to the right of our ball. I’m also going to set the Width = 1 and a Height = 80 to make sure it’s bigger than my World Limits. Under the Physics tab we want to check the option Immovable which will ensure the the ball doesn’t push it around.

That’s a great start but now we need to actually kill the ball. Let’s quickly switch to our Collision tab and tell Torque that this new object can Send Collisions but can’t Receive Collisions.

Under the Behaviors tab we want to add the Deals Damage behavior and we want to set the strength of the damage to 1 and deselect the deleteOnHit option. Now our wall deals 1 point of damage each time the ball hits it but it won’t disappear regardless of how many times it’s hit.

Let’s go back to our ball now by selecting it and make sure it’s in the center of the screen by changing our Scene Object settings to a Position of X = 0 and Y = 0. You can now preview the game and watch the ball die each time it hits the killzone wall.

Lets now move our killzone to it’s proper location but before we do, we want to copy it using the keyboard short cut Control - C and paste a new one with the keyboard shortcut Control - V. The first killzone should be moved to Position X = -55 and the second killzone will be at Position X = 55. Now both killzones are off the screen to the left and right but still within the World Limits we set previously. If you test your game the ball will now bounce off the top and bottom of the screen but respawn when it goes past the left and right edges of the screen.

Setting Up the Paddle

Now let’s switch back to the Create panel and drag a paddle into the screen. We want to use the same practices we used above to name this paddle “paddlep”. Under the Scene Object tab we will set the Position to X = 45 and Y = 0 which centers the paddle vertically and places it on the right hand side of our screen. Under the Collision tab we want to make this object Send Collision and Physics but not receive either. These are all fairly similar to what we did for our killzone so far but now I want to add the World Limits for our paddle by settings it’s Min. Bounds to X = 44 and Y = -40, it’s Max. Bounds should be X = 46 and Y = 40, this will set the area our paddle can move. We also want to change the Limit Mode to BOUNCE which will cause it to bounce when it hits the edges.

Adding movement to our paddle is easy with the Torque Game Builder, let’s add the Behavior Thruster Control and change the horizontalThrust to 0 and the verticalTrust to 50. This will cause the paddle to move up and down but lack the power to move left and right. Previewing the game now will let you bounce the ball off the paddle if you’re lucky enough for it to come your way.

Adding another Paddle

As will the killzones, we want to copy and paste the paddle and change it’s Scene Object settings to a Position of X = -45 and Y = 0. The World Zones need to also be changed to Min. Bounds to X = -44 and Y = -40, it’s Max. Bounds should be X = -46 and Y = 40. Remember to rename the paddle to paddlec, to reflect that this is the computers paddle.

Selecting the Thruster Control in the Behaviors panel will allow us to remove it so that we can add the behavior Move Toward Object, and we can set the object to ball using the pulldown menu with a speed of 50.

In Summary

So now we have a simple version of Pong using the Torque Game Builder. It’s pretty straight forward really, we need a ball which knows the size of the world it’s allowed in and it needs to bounce if it hits them. If it hits the sides of that world, it needs to die and if it hits the paddles it needs to bounce.

We’ve done all this without writing a single snippet of code and created a very simple game in about 20 minutes. There are a lot of neat tricks you can learn by experimenting with this tutorial, for example you could change this into a two player game easily by skipping the last step and changing the input keys or you could get rid of the keys altogether and have the players paddle follow the mouse using a behavior.

What’s Next?

This is a simple version of Pong with very little function and it’s designed as a tutorial for the Torque Game Builder but we could easily expand upon the game by adding more modern graphics, a score board and of course fixing the respawn point so it’s always in the middle of the screen.

Next weekend I’ll put together a new version of Pong with TGB using the scripting features. If you have any questions, please feel free to get in touch with me.

In the mean time, you can download the Code Free Pong For Mac and Windows and play it for yourself.

So lets get started by loading Torque Game Builder and creating a new project (or loading an existing one). Once it’s opened we want to open the GUI Builder (GUI stands for Graphic User Interface) using the menu Project > GUI Builder or hitting the keyboard shortcut key F10. Once the GUI builder is opened, we are going to add a new GUI by using the menu File > New GIU which will pop up a dialog box allowing you to name your GUI, I want to name mine “ggSplash” because it’s going to be used to load the Garage Game Splash screen. Next we want to set the GUI Class and because it’s a simple fade in we’re going to use the GuiFadeinBitmapCtrl which will do most of the heavy lifting for us. Click Create to create the splash screen.

So this is where the Torque Game Builder GUI Builder gets a little tricky for novice developers, in the upper left hand corner of your newly create splash screen is an object tree which will contain the newly create GUI object with the fancy name GuiFadeinBitmapCtrl, click it to access the property menu below and you will see several options that you can set.

General > faceinTime - How long will it take to fade it in milliseconds (1000 = 1 second)

General > waitTime - How long will it last in milliseconds (1000 = 1 second)

General > fadeouttime - How long to fade out in milliseconds (1000 = 1 second)

GuiBitmapCtrl > bitmap - The file that you want to use as your graphic

There’s also a whole lot of very technical elements to this control but unless you understand them, you’re best to trust GarageGames default values. Using the four above you can effect how the control shows your splash screen. Once you’re done playing with the settings, save the file as “ggSplash.gui” and we’re ready to move onto the really tricky part.

Unfortunately for novice users, there will be some programming to complete in this part of the tutorial but don’t panic, I’ll try to walk you through it gently. First, let’s load the GUI into the games memory. In order to do this we need to change the code of the main game file which can be found in your game directory. The file is called “main.cs” but be careful … there are two of them. The first is in your root directory, for example if your game is called MyGame it’s found in a folder called “MyGame”, within that folder there is another folder named “game”, we want to open the game folder and then load the main.cs file. The best way to know that you’ve got the right one is to make sure your file has a function named initializeProject() near the top (by default it’s on line 10).

Now, in that file we need to add a special line of code to tell your game that you’ve create a new GUI interface. To do that, we must add an exec statement, this special statement tells your game to execute special code. To do this, let’s change our initializeProject() function to look like this:

function initializeProject()

{

// Load up the in game gui.

exec(”~/gui/mainScreen.gui”);

exec(”~/gui/ggSplash.gui”);

// Exec game scripts.

exec(”./gameScripts/game.cs”);

// This is where the game starts. Right now, we are just starting the first level. You will

// want to expand this to load up a splash screen followed by a main menu depending on the

// specific needs of your game. Most likely, a menu button will start the actual game, which

// is where startGame should be called from.

startGame( expandFilename($Game::DefaultScene) );

}

You’ll notice that I only added one line to the code above, I’ve added exec(”~/gui/ggSplash.gui”); just below exec(”~/gui/mainScreen.gui”); what this is doing is really simple, it’s telling your game to load the mainScreen into memory and also to load the Garage Games Splash screen.

So now your game knows you have a new page but it’s going to need to know when to load it. To do this, I am going to replace the line startGame( expandFilename($Game::DefaultScene) ); with the new line loadSplashScreen(); which will now look like this:

function initializeProject()

{

// Load up the in game gui.

exec(”~/gui/mainScreen.gui”);

exec(”~/gui/ggSplash.gui”);

// Exec game scripts.

exec(”./gameScripts/game.cs”);

// This is where the game starts. Right now, we are just starting the first level. You will

// want to expand this to load up a splash screen followed by a main menu depending on the

// specific needs of your game. Most likely, a menu button will start the actual game, which

// is where startGame should be called from.

loadSplashScreen();

}

Once that’s done we need to create a new function for the code to call at startup. In programming a function is a little like a recipe, basically we can keep looking it up when we need it and it always does the same thing. The function that we need to create now will be called loadSplashScreen(); and will load our splash screen. Here’s the code:

function loadSplashScreen()

{

canvas.setContent(ggSplash);

schedule(100,0,checkSplashTime);

}

function checkSplashTime()

{

if (ggSplash.done)

startGame(expandFilename($Game::DefaultScene));

else

loadSplashScreen();

}

The second function is a helper for the first, what it’s doing here is setting the canvas (the screen) based on the values we laid out in the GUI Builder. Then, it’s checking every .1 second (100 milliseconds) to see if the process is done yet and if it is, it calls the default start screen for the game. Otherwise, it goes back and restarts the process of checking.

That’s it! That’s all there is to creating a splash screen in Torque Game Builder, not really complicated but a real pain for a novice coder. To give credit where credit is due, when I first started using TGB I used a great tutorial from http://www.videogamebiscuit.com to help me through some of the growing pains and most of my code above has evolved from there similar tutorial.

http://www.logoblog.org/

http://www.westciv.com/style_master/academy/hands_on_tutorial/index.html