Posts Tagged ‘html5’
Anti-(SO/PI)PA Game finished.
In my spare time yesterday and today I created a game in HTML5, It’s officialy is my second one, but the first one isnt realy a game so I say this is my first “real” game created using HTML5/JS/CSS3.
I used:
- Sublime Text 2
- The Gimp
- Some internet browsers.
JS vs AS3
Now I created a game in JavaScript I can say what I like more. For me AS3 is much better to create a game with at the moment. Maybe it will change in future but for now it is slow, and it is not easy to script with (At some point is is fun). However by using CSS3 you can make some thing easier.
My entry: http://www.ludumdare.com/compo/sopajam/?action=preview&uid=4506
Corné
A form of monotheism – postmortem
Having been away and sick I didn’t get a chance to write this, but I’ll do so now(with a little over 24 hours to spare)
Let’s get started then. Not with the beginning, that’s what is expected, let’s go for a random order.
“A form of monotheism” a silly name, thought of in the last 30 minutes as a better-than-nothing name. It surprisingly works and fits the mechanics of the game. You’re an exterior force with equal control over everything in the game world. You can chose sides, be impartial, have some work for the benefit of others and so on.
The original idea was to have the player be some fellow that clones himself amd tweaks said clones to accomplish some end (repopulate the planet, fight off aliens/ zombies/ in-laws) but someone already had that idea. Can’t remember who.
The second idea was to make a platformer and beat the theme into it with a stick. Since I forgot to make a platformer framework before the compo, I decided that’d take too long so I dropped it.
Back to square 1.
I wanted the player to start with one individual, and have the ability to spawn more and breed a populaton. That took too long, so I ended up spawning a whole bunch right from the start.
Species and similarity
What you’ll notice is that creatures are divided into specias: humins, cats, rats, and llamas (the llamas were supposed to be centaurs but I gave up on that) . Each individual also has an empathy-o-meter/ similarity-rating, the color under them. The more you interact with an individual the more that changes. New creatures get one based on their parents.
Breeding and killing
Creatures of different genders and the same species will produce an offspring if they are similar enough AND one or both of them are assigned as breeders. This is mostly to avoid population floods encountered in early testing.
You might wonder why breeding and killing are in the same subcategory. Because they both depend on similarity. If two creatures are too dissimilar they’ll want each other dead(regardless of species). If you keep a similar population confined and breeding you’ll notice that eventually they’ll start killing each other to keep ‘strange’ ones away. Much like history isn’t it?
Social commentary much?
Yes. The only time when you can be sure things won’t be killing each other is when there is only one left. Hence alone. After I finished the game I was left disgusted. I unwillingly made a game about racist intolerant cartoony critters that strip the land of resources and kill eachother because the color under their feet is different. You know: like real people. The relative accuracy of my ‘simulation’ was even confirmed by someone who actually bothered studying these things.
Anyway
The good is working with processing and making html5. A lot easier than I thought.
The bad was not getting to add sound effects, which I knew how to do, and making a cheap hack to loop music. Uneven distribution of resources and a lot of other gameplay and balance tweaks.
The achievements: The end game, when you have a single individual left, a single species left, or one individual of each species. A total of 7. I don’t think anybody got any.
Want to give it a try? knock yourself out:
http://www.ludumdare.com/compo/ludum-dare-22/?action=rate&uid=5432
Greeble – HOLIDAY EDITION
Merry Christmas – Happy Holidays! Just for fun, here is the snowy SANTA version of my LD22 game, Greeble. Can you revive all your Santa Claus clones? Can you find the Christmas Kitty? It was made in HTML5 and runs at 60fps in all recently updated browsers. Enjoy! Hope your holidays are filled with friends, family and fun!
Far From Home Postmortem
This was my very first Ludem Dare and also my very first original game!
Read my detailed postmortem to see how a novice approaches game development for the first time. I’d love to get real feedback and advice from some of you more experienced developers. Thank you Ludem Dare for pushing me to finally do something I’ve wanted to do for a very long time.
Greeble – an HTML5 game – postmortem
Greeble is an HTML5 game where you are the captain of a crashed spaceship. You are ALONE but need some help to survive. Collect the cryo-keys to activate the stasis pods in order to free your friends.
What went right?
Was very familiar with my tools, both engine, language and art creation pipeline. The amazing JAWSJS game engine was a breeze to work with. Had a very easy time making the art, since my level editor was just photoshop. Enjoyed screenshotsaturday, twitter and google+ as a means to stay motivated. I did well in the time-management arena, and planned ahead of time. I used placeholder art during programming and coded everything first in an ugly room with rectangles for characters. Only after the first day (when all coding was done) did I dive into the art, so I had tons of time to make it real puuurdy. I spent 75% of the time on the art and was feature-complete the coding by noon on Saturday. Total time spent on the game: 14 hours.
What went wrong?
Ran out of time before I could add sound effects. No user instructions or intro. No GUI. Had to cut features and simplify to finish on time. Got a bit stressed about it on the last day, racing to finish. Drawing the level took more time than I predicted. Overall, had TONS of fun regardless.
About the game:
Features pixel-perfect, non-grid platforming, bounce-pads, transparent glass tubes, a fun retro “scan line” effect, silly AI followers and A KITTEN. Your objective is to navigate to the exit where you will be rewarded with a trampoline party!
Use the ARROW KEYS to move around. Try to find a way to revive all your friends (including the hidden secret kitten, which signifies my enthusiastic participation in the “kitten challenge”) so you can all bounce on the trampoline at the end.
I had so much fun making this game. I even had time to hang out with friends, go for a hike, and decorate my house for the holidays! There is a lot of room for improvement but overall I’m really happy with the final product. Created using ippa lix’s wonderful jawsjs game engine.
The word “greeble” comes from the original Star Wars ILM special effects artists who used the term to describe generic “tech” bits and pieces that adorn sci-fi hulls. There are thousands of greebles in this game’s level art.
How it was made: I drew two “techno” textures as the base texture for all the world platforms (one brown and one silver). These patterns were covered in “greebles” (panels, buttons, wires, lines, etc.) In photoshop, I made opacity maps for each and turned everything transparent. Then, I drew the game map itself by drawing black and white pixels on the alpha (opacity) channel so that certain parts of these materials would become opaque. An effect filter that added a little emboss to the edges completed the look.
In the game engine, the entire world map is one gigantic .PNG image, which is layered on top of two parallax-scrolling background tiles (set to move slower than the foreground). The retro “scanlines” effect is merely another overlay image that sits on top of everything.
This is the entire map image I drew, as used in the game (click to zoom in):
… and this is the scanlines overlay I created:
Making “Greeble” was very inspiring. I now have an HTML5 platformer game engine that allows me to create freeform worlds in photoshop. No tiles or level data files required!
Ludum Dare is so much FUN. It is amazing what you can accomplish in a speed-coding weekend.
alone with myself – final version

Ok final version uploaded, libraries updated with the bugs found during the weekend, some donuts eaten … time to rest for the week to come !!
don’t forget to play the final version here : http://www.ludumdare.com/compo/ludum-dare-22/?action=preview&uid=825
cheers !!
final progress video
now its time pack everything and publish the final version !!!!
good weekend of coding, drawing, coding, testing …
Phares, WIP 005
I’ve got some behaviours going, I got almost all the art ready I just need to draw a few other hell dwellers, and I’ve already have a idea for the core mechanic
(FINALLY, I was going nuts).
alone with myself – progress, almost there !!
this is getting close to the end !!, add the main screen, story screen changed the game over, killed some minor bugs of the viewport, now missing the soundtrack, sound effects and build the final map.
go go go !!
First LD22 update
It’s been many hours since Ludum Dare #22 started. To be honest, I was really hoping for teleportation.
So, just a recap, i’m doing a browser game using javascript/canvas. I want to do something darker than i’m used to.
This is where i’m at at the moment http://www.stickymill.com/alone/alone_v0.01.html
Screenshot gallery http://imgur.com/a/6jLGr
What i’ll be using
- Language: Javascript / HTML5 Canvas
- Art: Adobe Illustrator / Adobe Photoshop
- Audio: If there is audio, i’ll be using sfxr and any modifications to that with Audacity
- Base Code / Libraries:
Asset Manager from the Google I/O presentation for pre-loading images.
My base template - Screenshots: I’ll set up to take periodic screenshots, a word of warning though, I can’t guarantee it will be completely SFW
Ludum Dare 22 – Nogbog in.
“I’m in” video saved, cat got in the way, all good.
I’ll be using HTML5/Javascript/Canvas. Using Chrome, may have to install Firefox and IE to check compatibility.
Also it just occurred to me that my WordPress name and my handle are not the same.
I am nogbog aka Colin Capurso
I am in for my second LD!
First time was really fun, so taking part again would be twice as fun!
I was going to use FlashDevelop with Actionscript 3 and AIR framework, but I need more practice before I can rapidly create games with it.
So instead, I am going to use:
Hand drawn graphics using Systemax PaintTool SAI, animated with SmithMicro Anime Studio 8,
music and sound effects using Fruity Loops, possibly with using freeware instrument samples to compose simple tracks, plus original sound effects and voice (if necessary)
GameMaker HTML5 for overall development using my game codebase.
Windows version will be surely available and HTML5 as well -if there are no annoying performance issues and code compatibility problems.
My codebase is nearly fully polished & will be posted before the compo begins.
To play my first Ludum Dare entry, go here: http://www.ludumdare.com/compo/ludum-dare-21/?action=preview&uid=5234
I’m in
I’m in again. Having learned nothing from crashing and burning last time, I’m going to (attempt) to learn a new environment and language as I go (Get Moai/Lua). (original choice of technologies abandoned as it’s too hard to embed in the browser) I’m using Javascript and the HTML5 Canvas, no external game libraries, (depending on the theme) only programmatically generated graphics, and only a limited knowledge of web technologies.
Expect some unplayable, cryptic piece of crap to follow.
Buy a framework to a developer for only $1
Wednesday, October 5th, 2011 5:13 am…this my unexpected goal: buy the Impact framework http://impactjs.com
My name is Floriaen and I am actually writing a HTML5 game during my free time.
Of course, instead of sleep.
I am on Twitter: @floriaen there is some goodies inside!

Thanks.
HTML5 / Javascript gamedev postmortem
So I chose to make a game with HTML5 / Javascript using the JawsJS html5 gamelib.
I used the <canvas>-tag since I wanted to make a freeform level with pixelperfect collisions, basically I made the whole thing in graphics gale, could as well have done it in paintbrush.
The new HTML5 <canvas> tag makes it easy to get the data in raw format, basically an array with RGBA values. From there on it’s to check collisions.. 1 pixel at the feet is a decent start.
The most annoying thing is probably the audio-formats that’s supported for the new <audio>-tag.
Safari doesn’t play OGGs for some lame reason, and Firefox doesn’t do MP3s. So all audio has to be provided in 2 formats.. also you wan’t detection at asset-loading time etc. I could have lived without that cruft.
Otherwise Javascript has become amazingly fast, I think V8 is faster then ruby and python. All browsers come with good debugging possibilites.
Javascript doesn’t have the traditional classes and inheritence, but rather prototypical inheritence.. which can be confusing at first.
What I love is the dynamic nature of objects in Javascript.. basically all objects are big key-value storages (hashes).
So you can whenever you want just set a new flag/property on whatever object.
/* Player.dead has never been defined or used at this point */
if(player.dead) { … do sometting …} // won’t throw any error.. played.dead will just return undefined
player.dead = true
if(player.dead) { … do something .. } // played.dead is now true and code will be executed
The biggest upside with javascript is ofcourse ppl not having to download anything. No virus-scan etc etc. Just instant gaming. And the big players are making the javascript engines faster on a daily basis.
Play my Javascript game here:
http://www.ludumdare.com/compo/ludum-dare-21/?action=preview&uid=108
Here’s a teaser-shot from the game, you start in the “west prison
” and have to find your way out of a huge castle.
Game engine is working…
It took me an hour and a half to come up with anything to fit the theme of ”ESCAPE” but once I forced myself to sit down with a marker and a piece of paper, I soon had a simple little thumbnail sketch of what I wanted to make. I’m using an ultra-simplistic concept that fits the theme and I’m quite happy with it. As my first progress report, I’m happy to say that I’ve finished implementing the basic gameplay mechanic. I’m using HTML5 and box2dweb and am creating a physics puzzler for web, windows exe and android (compiled to .apk using PhoneGap). It took me about two hours to code the entire thing from scratch. I’d never tried any work with box2d before, and I stumbled with bodies and fixtures and sensors but I’m really happy to say that my basic gameplay testbed and proof-of-concept is complete: we have a “main character” that can bounce around and the engine detects when you touch a “key” which unlocks a “door”.
This means that I am “done” the low level engine and have the rest of the weekend to make it look pretty!
Maybe in
Not quite sure if I’m in, 50% certain I can get enough time to try. Then I also need to be inspired by the theme, 40% chance since I’ve got trouble with that recently. Now when it comes to getting done on time, I’d give me a 5% chance, I really suck at that. Finally this would be my first Ludum Dare, which adds another factor of 10% on success chance. These completely made up numbers leave me with a 0.1% chance of success, hooray for that.
I thought about using Ogre/SDL+OGL and a custom toolset I’ve built together with a friend of mine, but decided agaist that because I can’t do anything web-based this way (at least not until Ogre gets NaCl support). For now I’m using play’N (which was known as forplay until the recent name change and is still in alpha stage). While I might have to write code in Java I already have in my C++-toolbox, being able to easily export the game to HTML5 is worth a lot for me.
jsGameSoup cross browser Javascript game engine
Hey LD48ers,
Just wanted to post a quick heads-up about my cross-browser Javascript game dev library, jsGameSoup.
I think you will find it a very quick way to make a game and get it in front of players! For example, I made this demo in a few hours.
Have fun!
Contrasaurus Launch Successful!
The Contrasaurus launch was a big success yesterday, getting onto both the front page of Hacker News and the Programming Reddit. We even got 57 Facebook likes!

We received quite a bit of feedback, some positive, some negative, a lot of it useful. We also received a donation!
Something I wish I had done earlier would be to write down my expectations and try and guess what kinds of feedback we would receive, then compare that to the actual feedback and try and improve my intuition for what players care about. It is all too easy for ones mind to pretend it knew it all along once the evidence is in, so next time I’ll be sure to write down my hypotheses.
Another thing I learned is that not all feedback is equal. Some tells more about the player than the game. There will always be negative feedback and trying to modify the game too much to accommodate it may, in some cases, dilute the experience such that no one really loves it. On the flipside though, be sure that there is actual real positive feedback supporting the tradeoffs you are making. Our main one was that we chose to emphasize “being an awesome dinosaur, crushing your enemies” above “having balanced and tactical gameplay”. That’s not to say that there is no balance or tactics, just that “being an awesome dinosaur” came first in our priorities. In some cases it caused the gameplay to suffer and in an ideal world where we have infinite time the game would be extremely excellent in both regards.
The feedback we received often mirrored that choice. The players for whom “being an awesome dinosaur” was important really loved the experience. The more hardcore players who didn’t care about “being an awesome dinosaur” and wanted more complex and tactical gameplay were often disappointed. Some striking examples:
The gameplay literally consists of the character holding down the left mouse button and holding the right key. Once you get the jetpack you pretty much can’t die. The level design is non-existant, as every level (that I’ve played so far) is just a flat surface with enemies being constantly spawned on it. Overall, I think that you need to work on this game a lot. Currently, I’d say that it’s too boring, and few people will play it past the third level.
I can’t even begin to describe the awesomeness of controlling a jetpack powered dinosaur wielding twin chainsaws while fighting communists all to the midi-encoded tunes of Lady Gaga. The plotline was truly amazing, I totally didn’t see the ending coming.
Another interesting decision was that we chose to go the HTML5 route, rather than using an “established” platform like Flash. I think that, for us, it was the right decision. We don’t have much Flash experience, and if we’ll need to learn a new platform anyway we might as well go for one that appears to be rising rather than one that appears to have plateaued.
There are still tons of problems with HTML5 today, primarily cross browser audio, and crazy nearly impossible to reproduce crash bugs, as well as the standard cross browser web crap. The biggest pain was all the crash reports of running the game in Chrome, even though that’s the environment where for us, in development, it worked nearly perfectly. Additionally it was pretty much unplayable in FF, except on super-powerful computers, had control issues in Opera, only usable in IE via Chrome Tab, and crash reports on any of the browsers were not uncommon. This is the biggest issue right now with HTML5 but it is an issue that is currently being resolved and hopefully quickly.
In the end though the actual technology doesn’t matter at all to the player. The only thing that matters is that they can play the game reliably and enjoy the experience without issues.
the best flash game i have EVER seen play it http://contrasaur.us/








