[web] Game in HTML

Started by
14 comments, last by Phytoplankton 14 years, 2 months ago
Hey everyone! A little story: When the Playstation Portable got released in Europe in 2005, it was a couple of months behind on the release in the US. The US version of the PSP was hacked pretty fast, enabling PSP owners to run emulators and homebrew games on their PSP. The European version got released with a new firmware (firmware v2.00) where it was not possible to hack the system like the older versions in the US. To make the rest of the world download this new firmware too, they added a new feature to the PSP: a web browser (no flash support). So for most PSP owners outside Europe there was a dilemma: continue to use a hacked firmware to be able to play homebrew games or download the new firmware and get internet access with a web browser. Most stayed with the hacked version because there where already a lot of cool homebrew games and applications available. In the months after the release of the European PSP hacking this new firmware was big news. You had hacking teams who tried everything; a lot of rumors where going around and in the end there were a lot of frustration too. So one day I was reading an article about hacking the PSP and I started to wonder; instead of hacking the system, why not use it instead? For me the logic thing to look at was the web browser and that’s why I started thinking if it was possible to make a game in HTML that runs on the PSP web browser. A basic adventure game looked like the most logic thing to make, but I really wanted to make something that didn’t feel like a glorified website. I wanted to make something that was nothing more than a couple of pages linked together but looked like a game and felt like a game. I worked on an idea for 2 days and I was pretty happy with the result. It’s a game where you are inside a labyrinth and your goal is to escape. I tried to put as much in it as I could in 2 days, some of the features: - 2 complete levels - intro and menu screen (credits, instructions) - 2 difficulty settings - complete freedom how you navigate through the labyrinth - ending conditions with replay option - basics of interaction with the environment (opening a door) That’s all done by linking around 200 html pages together (5mb) in a certain way, nothing more nothing less. The fun part is that it works on my PSP What followed next was something I didn’t expect. I had posted this html game on the forums of the biggest Belgian game website Telenet Games (now 9lives.be) and one of the crew members of that website saw it and made it front-page news of the website Other website started to pick this up and on one of them (pspupdates.com) it got downloaded 5000 times in the first day. That’s not something I expected from a crappy not-so-fun HTML games. I got mixed reactions; most ofcourse where disappointed when they tried it, others congratulated me on being the first to make a homebrew game for the firmware and actually "trying" to make something. There was even a guy who claimed my 'game' bricked his PSP xD Why do I bring this up? In a couple of weeks I'll have to start doing research related to games and gamedesign for school, and I have to write a paper about it. I've been thinking a lot about what I could research, and as a student gamedesign I want to learn something about the basics of gamedesign and what exactly a game is. To do this I came back on this question I asked myself a couple of years ago; "Is it possible to make a game with HTML only?" No &#106avascript, PHP, no flash, only basic HTML. So why do I think this question is interesting? Because it makes you think about what a 'game' is exactly. It brings you back to the absolute basics of gamedesign by giving you a limited amount of things to work with, and it makes you think how you can make a game with something that’s not made for this at all. So in this paper I want to address a couple of questions: How much input can a "player" give in a HTML based game? How complex can you make the "gameplay"? Are there any games to be found that only use HTML? In what fields is a HTML game usefull? What is a game exactly, and most importantly what is "gameplay"? When working with limited resources how important is artwork to make something feel/look like a game? Besides trying to answer these questions I would like to make a tech-demo with some ideas I have related to this, because I want to challenge myself and try something that looks impossible and I want to try something that has never been done before. I joined this forum and made this topic because I would like to get some info on this subject. What do you guys think about this? How "possible" is it in your opinion to make a game? What type of games are possible? Whats been done before?
Advertisement
I heard someone once wrote a Hockey game in HTML.
Sounds like you are talking about a Choose Your Own Adventure story in electronic form.

Stripping out the the additional electronic interactivity, that's what I see at the core. Am I wrong?
Yeah something like 'gamebook' is an obvious option, but I would like to explore other possibilities too, if possible. Another one would be where you have to explore an environment where different objects are clickable; doing so in the right combination brings you to the next environment (page).

I’m actually mostly interested in games where every game state is a page on its own. This way its possible for an 'avatar' to run around in an environment where every movement is actually a different html page where one object (in this case the avatar) changed its position. In the PSP game I talked about my 'avatar' was always in the center of the page, while the environment around it moved. Of course to make something like this there’s a lot of work, but the result is pretty exciting for something in html.

To see whats possible you have to look at the 'input' possibilities of the player. The most obvious one is the possibility to click on something.
other things I can think of:
- The possibility of using a scroll => reveling hidden parts, could be a puzzle if you add different scrolling planes next to each other.
- The possibility to edit the url => by giving hints in the gameplay to what url would bring you to the next 'level' (page)
- Even the possibility for the player to edit the source code, ofcourse you might wonder if this is really interesting and fun.

what other input/interaction would be possible?
For those interested, this was the PSP 'game' in HTML I made a couple of years ago:

Escaper Game


start.html is the first 'page'

To make it work on PSP:
-You need 7 MB on your PSP memory stick.
-Unrar the rar file to the ROOT of your PSP's memory stick its the topmost folder,
it has no name, it houses everything on the stick.
-Once unrared, you should see a "escaper" folder in the root directory
-To run this game, go into your Web Browser and type: file:escaper/start.html
Add this adress to your bookmarks so you can use the bookmark to start the game the next time.
HTML can basically be used to simulate finite automata. Basically anything you can do with a finite automaton, you can do with HTML. I don't want to go into too much detail about the theory of computing here, but a finite automata is essentially composed of a finite number of states, which have "transitions" to other states based on some input.

You could do a full-fledged RPG game with inventory, quests, monster combat, leveling, etc. in just HTML if you REALLY wanted to. You could have a whole bunch of different pages with filenames based on the state that page represents, eg: www.foo.com/game/states/char_prog_1_5_3_7_9_3-inv_90_45_23_12_65-hp_100-mana_67-NPCs_65*43*29_ and so on and so on... The main problem being that there is a RIDICULOUSLY huge set of states and transitions you would have to make. You could obviously use a programming language to generate all the HTML files, but the space they take up would still be EXTREMELY large.

Obviously with just HTML there is no possibility for multiplayer games. You could theoretically have "AI" that makes a move in response to player input, but it would be limited to hardcoded actions for each node in the game's state space. For something like chess that would be extremely impractical, but it would be manageable for tic-tac-toe or something.
Check out the first gameplay video from my javascript/PHP RTS game
I was going to say use the <canvas> tag in html5 until I saw &#106avascript was not allowed. You are kinda stuck with the choose your own adventure type thing then since you only have links at your disposal.
Yeah the 'finite automata' concept you talk about gives you a lot of possibilities but as you say it's just not practical. Still I think there's other possibilities, I have some puzzle-game ideas by using scrolls, I'm probably going to explore that a bit.

So what if &#106avascript was allowed, how far would you be able to go with that?<br><br><!--EDIT--><span class=editedby><!--/EDIT-->[Edited by - Betelgeuze01 on January 21, 2010 4:46:35 PM]<!--EDIT--></span><!--/EDIT-->
&#106avascript is Turing Complete, so you're pretty much only limited by system resources at that point. Of course, you can't do any multiplayer stuff with &#106avascript unless you want to use something to code the server.
Check out the first gameplay video from my javascript/PHP RTS game
When did pointless wastes of time and exciting possibilities converge? You could simulate a lot of things by trying to make a game in HTML, but I can also shovel my walk way tonight with a spoon. Wrong tool for the wrong job.

There are proper technologies for browser games, such as Flash, &#106avascript, Java, SilverLight, Unity Web Plugin, etc... Use one of those instead, and stop trying to push a square peg into a round hole.

Zipping 5000 HTML pages together isn't a game. It's 5000 text documents sitting in a folder.

This topic is closed to new replies.

Advertisement