HACKER Q&A
📣 guuggye

What Technologies Are Used for Google Doodle Champion Island Games?


https://www.google.com/doodles/doodle-champion-island-games-begin

What technologies could be used to create that JRPG game in a browser?

Is it fundamentally very different from other frontend web development?


  👤 scanny Accepted Answer ✓
Looks like CannonJS [0] and CreateJS [1] are being used according to the Chrome dev tools "sources" section. If you look under "hplogo-complex" on the page it seems there a bunch of sprite sheets loaded.

Still not sure how it is all pieced together; I was under the impression that cannon was used in 3d. Would be great to hear more detail on this!

edit: a link to one of the JS files running it, seems to have references to all the in-game text, characters, animation states, ect. : https://www.google.com/logos/2020/kitsune/rc6/kitsune20.js

0]https://schteppe.github.io/cannon.js/ 1]https://createjs.com/


👤 cableshaft
Here's a 'Behind the Doodle' about creating the game, and at one point I see they're using what I think is Adobe Animate for the level design and sprite animation (it says Animate in the top left bar), but beyond that, I didn't notice anything that might give a hint as to what the game's tech stack might be.

Might be Haxe, since it's kind of a successor to Flash like Animate is, and there's a Haxe library to support the Adobe Animate texture atlas format. Haxe games also tend to have retro pixel art styles.

https://www.youtube.com/watch?v=hy7tHQUR3TM

The video is pretty interesting and has a lot of concept art and storyboarding in it, btw, I recommend checking it out.


👤 modeless

👤 GuB-42
Just look at Crosscode.

Not officially a browser game but it uses nw.js (a framework similar to Electron) and the demo is playable in a browser.

It is a full, top down action-RPG with 30-80h of content that I highly recommend. The devs made some live streams during development.


👤 IamaNico
no se

👤 Nydhal
Javascript. That's all I can say.