In a place where your fantasy can roam free, there won't be any boundaries to what your imagination can create.
Misha’s Tech Playground
graphics, fun and code play
I'm crazy - but who cares? My ideas are constantly dwelling and this is the place for them to pour out and form into something good. Only active participation will ultimately make this place come to life.
Is JavaScript enough for browser based games
Most Browsergames these days are done with Flash. Sure, Flash is a nice technology and it has lots of benefits over X3D, Quicktime, Silverlight and others. The main reason Flash is used for games though is because it has a huge market penetration. Somewhere around 98% if you believe in Adobe’s statistics.
That there is another, mostly underestimated player is a fact that this article want’s to shed some light on. (more…)
Tags: code performance, pbbg
Level Editor Redux
I have dedicated more of my sparse spare time and refined my level editor quite a little bit.
I have found some very cool and useful information about tile based games on the net this week and parts of it are already directly influencing the current codebase. The latest somewhat stable version is 0.92b which rectifies some problems with Firefox 2 and implements all features listed as current. Once I have a chance to cleanup the code I’ll make it available for download in a new post.
The current development milestone is 0.95a which incorporates already some of the planned features.
It still has to go a long way to be complete but the progress is going well. (more…)
Tags: Games, level editor, tile graphics
Generating Tile Maps
About nine months ago I discovered Open Sword Group’s Pixen a really neat image editor for OS X, perfectly suited for Pixel Art. I was working on my BA thesis by that time and investigated the possibility of tile based graphics for the thesis project.
Though it turned out that tiles were not feasible. However this application and the sites I discovered through my research had sparked fond memories of long lost games and an idea was planted.
For a couple of months now I am working on my very own little game project. Initially I was trying to use RepTile to create my maps. But after trying to contact the author without getting any response it seems the project is abandoned. Though the concept of this little application is still neat.
It works like any other tile map generator in the way that you can paint your map using the tiles you provide. A great addition however is that you can already assign properties to map tiles. For example, the stone wall is not walkable and the grass has less movement cost than the dirt . You get what I mean.
As badly as I wished to use this little program, I am no Cocoa programmer and can therefore not ad features I need.
But luckily I can do JavaScript and this seems to be the perfect playing field for it. Since tile based games are mostly web related, why not create the maps straight in the browser. So I took the great RepTile idea and moved it over to JavaScript and the outcome was this (click to see the full image):
The generator is working and can perform the basic tasks of painting tiles and assigning properties to them. Clicking the generate button will present you an xml file which you can use with an appropriate engine (such as the one I am working on). However, the code is a bit messy right now.
But if there’s enough interest I’ll clean it up and post it here.
P.S. The tiles used in this screenshot aren’t mine. Danc made them. Anyone interested can find the link in the Sprites, Sprites, Sprites post.
Tags: Games, level editor, tile graphics
Sprites, Sprites, Sprites
This is a repost of some posts to my old website from May to June 2007
Animated Sprites and Tile Mapping with Javascript
Based on a previous post about Javascript Sprite Animation I decided a while back to create a little tile map and have a sprite move about it using keyboard controls.
Below is the original context:
Yesterday while surfing the net I found some very cool tile graphics. Luckily Danc the creator of these graphics released them to the open public. These will prove a rich learning resource for me.
Anyone who is interested might visit his blog at lostgarden.com
The game tiles are available from this post > more free game graphics
Javascript Sprite Animation with Tiles
* * *
Javascript Sprite Shading Algorithm
My curiosity led me to try my hand at simulating a light source with Javascript. While I had done this previously to fake a 3d lighting effect (use this link for the JS version) with just 5 layered graphics, I wanted to try a different approach this time.
My goal was to create the illusion of a light source fading with distance - much like a point light source, a light bulb for example.
The algorithm or one that is similar was probably used in tile based games that tried to simulate light sources. Some that I played myself were “Jagged Alliance 2″ and the original X-Com strategy games.
To see the algorithm in action click the link below:
Javascript Sprite Shading Algorithm
Tags: Games, lighting, tile graphics
Javascript Sprite Animation
How To Use Javascript To Animate
This is a repost from playground.3d-m.de from May 19th, 2007
Coded up in about 10 minutes, this is just a test to check the performance of script based animation. The sprite consists only of one continuos image strip which is animated using a Javascript Interval.
So Why No Animated GIF?
Well, first of all this image is a PNG – but it could be a JPG or any other format also. Further this could be used to make extremely efficient rollovers because there is no need to load two separate images. And finally, it was just plain fun to make it
What wasn’t so much fun was the PNG behavior in IE 6. But using an ugly css hack and slightly more difficult DOM tree it works in IE 5.5+ also.
Link: javascript sprite animation
Tags: Games, tile graphics
Fake 3d Lighting Tutorial Part 1
How to create Graphics for Isometric Tile Games
This is a repost from my old playground website from May 19th, 2007.
Contents:
- Introduction
- Modeling The Object
- Scene And Model Preparation
- Adjusting The Render Frame
- Setting Up The Camera
- Adding Light
- Rendering
- Post Processing
- Final Thoughts
Introduction
I thought that it is about time I am doing a tutorial for modo. I have often stated I would eventually do one, now I am here to deliver.
In this tutorial I am introducing a technique to use modo to create sprites for tile based games. These sprites can then be used to generate a fake 3d lighting effect within the game, without the need for real 3d calculations. But that is part of a later tutorial really, today I just want to focus on the scene lighting, object and camera setup.
The results of this mini series can be used in traditional isometric tile games or adapted in other games as well. Right now this technique is in experimental stage, but I have made some demonstrators. One uses Javascript and the other uses Actionscript inside a flash movie:
- Flash movie
- Javascript implementation (currently no IE
and Opera, sorry) - download tutorial files (zip archive)
Tags: Games, isometric, lighting, modo, Rendering, tile graphics
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
