#browserquest

[timetocode]

I’ve got it so that extremely large maps can now be loaded from Tiled Map Editor into a game rendered with Pixi.js. I had to write my own loader that converted Tiled maps into spatial grids. Then I used the same culling/rendering logic that I use for all tile-based games on this blog. So it was a big improvement overall.. for the 1000x1000 maps the rendering is like 200,000% faster than it was with the other loaders (apples and oranges, I guess). The other cool thing that comes from exposing the map data in-game is that I can now make a layer that stores the collision logic, shown in blue on the second screen capture. This is pretty handy as it allows me to quickly just draw the collisions right on the map instead of writing some tedious logic about which tile types are collidable. The same thing could be used for all kinds of things, like a layer containing the locations of monster spawners... though if there were too many things like that I would trim them from the clientside version of the maps.

After I finish this demo and nengi beta 2, I hope to bring some of this workflow over to the battle royale game. Tiled is very handy, though it stores information quite verbosely. I’ve noticed that gzip can compress the maps by 90-99%. For the battle royale game it isn’t an easy fit. I’m using a procedural island generator and have destructible buildings as well as working under a tighter performance window.  I’ll have to write some sort of converter... But I think writing a converter will be less work than maintaining my map editor.

[freegameplanet]

BrowserQuest is an easily accessible massively multiplayer browser based Zelda-style mini-action RPG that allows you to team up with other players, slay monsters, collect cool loot and battle bosses!

Read More & Play The Full Game, Free (Browser)

[timetocode]

6 screenshots of the nengi beta 2 demo (unreleased, WIP)

I’m using Tiled Map Editor, a spritesheet from BrowserQuest, and Pixi.js. I’m not too good at actually making the maps yet, but I’m getting better.

It is a magical experience to go from the map editor, which is essentially a drawing program, to refreshing the browser and seeing my new additions to the world immediately. I could get used to this type of workflow... it is very content-centric, but it is wildly productive. I feel like I could make a very elaborate environment in just a few days. That said this isn’t my usual type of game with procedural terrain generation and destructible buildings. I’m sure I’ll eventually figure out how to hybridize these methods.

This is the first game intended to show a multi-instance world. A player will be able to walk around on the overworld (which is an instance), or walk into a cave and explore the underworld (which is another instance). The overworld and underworld will exist as two separate nengi instances and can be hosted in a very flexible ways. In the simplest case, the overworld and underworld can live together within the same server. But with nothing more than an ip:port:id these instances could be separated to two different machines. There could be one of each instance, or a thousand of each instance. There could be ten players, or there could be ten thousand players. The remaining limitation is how many players can fit in a single instance -- which depends heavily on what the game actually is and what hardware it is running on, but for nengi can be in the range of 50-300 players . So I hope some people wanna make some MMOs! And I’m talking about real MMOs, not just “we have a lot of players that exist in totally separate servers and can’t meet each other” -- nah, that’s a very loose meaning of mmo and was already easy to make in nengi beta 1. This time the players can actually walk/portal/teleport/travel-by-some-means from any part of the game world to any other part, even though the game world is potentially an aggregate of multiple servers.

I’d also like to mention that these instances can be created and associated in very dynamic or very static ways. We could just open one overworld instance and one underworld instance and say that the cave in the overworld goes to the underworld, and that the ladder in the underworld goes to the overworld. Or we could be fancy and create a server that goes to the cloud and turns on whichever instances we need and wires them up a bit abstractly. It could create an overworld instance.. and then when it starts to get full of players it could create an ‘overworld2′ instance and send players there instead. When a player in overworld2 walks into the cave to the underworld, perhaps the instance asks our fancy server where it should go. Maybe the the cave goes to underworld1, or underworld2, or underworld305, or somewhere totally illogical. It is entirely up to the developer how these things go together.

Edit: sources

http://www.pixijs.com/

http://www.mapeditor.org/

https://github.com/beeglebug/pixi-tiled

http://browserquest.mozilla.org/

https://github.com/mozilla/BrowserQuest

https://opengameart.org/content/browserquest-sprites-and-tiles

[timetocode]

 Trying out Tiled ( http://www.mapeditor.org/ )

The sprites come from the game BrowserQuest ( http://browserquest.mozilla.org/ ) and specifically the artist Guillaume Lecollinet ( https://twitter.com/glecollinet ).

BrowserQuest became an open source project for Mozilla to showcase websockets, localStorage, and HTML5 audio. Basically it was showing that a browser could finally make a real-time multiplayer game (without some plugin).

My interest comes in seeing if I can get Tiled to play nicely with Pixi.js and nengi (it doesn’t want to play with pixi, yet). If so, I’ll have some nice art, a tribute to a classic, and a much-requested demonstration of a tile-based game. I’m sure this particular template would be a preferred starting point for quite a few nengi games.

I also wouldn’t mind using Tiled myself, when I’m doing mockups or creating somewhat static sections of maps (like the houses for my recent game). The format isn’t perfect, but it is pretty flexible.. and at worst I’d convert the data to another format. 

[timetocode]

Video with 100 bots. Recording added some lag, but the original was okay with either 60 or 144 fps. Graphics are open source from browserquest.

[ivelashigaru]

Browserquest - Die ??? Achievements

[encodest]

Confession: I have played BrowserQuest and I have unlocked every achievement possible without pause for a break. It is that good.

It's an awesome massively multiplayer adventure game done using HTML5 canvas (powered by WebSockets). It was built by teams at Little Workshop and Mozilla. And it’s all done in glorious HTML5 and JavaScript.

Even better, it’s open-source with the source code on GitHub!

[gamelearning-blog]

BrowserQuest