The hacking game from NieR: Automata

I’ve really loved to play Nier: Automata this year. So much that I’ve decided to implement a mini game from the title as a WebGL application. I’ve used it to showcase the new THREE.InstancedMesh class and certain features from our AI engine Yuka like OBBs for collision detection.

In Nier: Automata you can play an android called 9S who is capable to hack other androids or robots. The hacking procedure is represented as a mini game where you have to destroy one or more opponent AI cores. It is similar to top down shooters but with minimalistic gameplay and graphics. I’ve not implemented the entire features of the real game (that would be crazy^^) but just the basic mechanics and simplified graphics. Right now, there are 14 small levels, I’ve planned to do at least 20 over time. However, it’s a fan project and open source so it would be cool if other devs get involved. The project is published at github.

Controls are quite easy (WASD + mouse) the actual gameplay should be intuitive (well it’s not from me but Platinum Games^^). Everything is work in progress and of course not comparable with the real game.

Interesting facts: The app uses no external 3D models. Only the geometry generators of three.js and a single procedurally generated geometry. The app also makes experimental use of the Gamepad API. When you plug-in a PS4 controller, you should be able to control the vehicle with the gamepad. However, menu navigation is not supported, yet.

The game is probably more fun if you played Nier: Automata. However, it’s a nice showcase for web-based games. I’m convinced with more time, more devs and a real budget, you could implement the game 1:1 compared to the PC or console version.

Start Game (requires Mouse+Keyboard)


BTW: This is how the official product looks like:


Very nice game!

About the mouse control, I’d like it to use only the X axis. Having to move the mouse towards the XY direction leaves me sometimes without physical space to move it anymore.

Looks pretty amazing. Love it. I feel rate of fire is a bit high, drop it by a half maybe.

Do you mean the fire rate is too high compared to the real game? Or in general?

1 Like

I feel both to be honest. It’s too easy right now, and also I don’t remember it being so fast in N:A

Great game ! Thanks for making it open-source.

I had an issue : the canvas outsizes my viewport, so I had the scrollbar visible.
When I used the arrows for the game, it scrolled the page up and down as well.
I use last Chrome.

BTW : Did you get the sound effects from the original game ? If not, where did you get them ?

Interesting. I can’t reproduce on Chrome/macOS. Let me verify the CSS. Are you on Windows?

More or less^^.

Also used some files from here.

Yes I am.

I tried again and I can’t reproduce myself !
I have no idea why it was different the first time…

1 Like

Excellent, job well done.

1 Like

Sweet! Completed it twice! Very fun!
Didn’t realize Yuka had OBBs implementation :open_mouth: I really should give it a try :smiley:

If the app had a level editor, it could be possible to let anyone make their own levels (aside from the “official ones” made by devs). With authentication, levels could be played and rated. Sort of like Happy Wheels I think? There could be a “Level of the Month”, based on rating, and maybe some implementation of a search engine to look for specific types of levels (for example [vs swarm]).

All this would make the game accessible to all Nier fans, not just Three.js devs :smiley:
and some people’s creativity can be really surprising!

Anyhow, great work @Mugen87! As well as an excellent showcase of Yuka! :partying_face:

PS. Are there any legal/copyrights issues when creating (and publishing to the web) open-source games based on already known media? Did you have to ask someone from N:A for permission?

1 Like

That is actually a great idea! However, developing a respective editor will require quite some work. At least for me, this is a bit out of scope for now^^.

No. I mean if somebody complains it’s no deal to remove it from github. But since it’s a non-commercial fan project (similar to drawings, memes or 3D models), I think it should be okay. It some sense, it’s advertisement for the game and an expression of honor to Platinum Games and Square Enix.

1 Like

This is great. I love Nier, though haven’t played in a while, so it’s hard to compare.

Just FYI, I tried it out with my gamepads, it works flawlessly with the steam controller, but my logitech gamepad does nothing, in either Direct-X mode or pretend X-Box mode. I’d expect compatibility problems with the steam controller, but the logitech controller usually works with anything, I will take a look at the code and see if there’s any obvious clues, but my first guess is that making it compatible with a PS controller might cause compatibility issues with DX and XB controllers.

You should think of a good homage name for this, what about “Near a Tomato”?

TBH, I did not expect it would work with other gamepads since the button layout varies from controller to controller. I’ve only tested with the PS4 one.

Awesome work, really enjoying it! The progression between levels is perfect!

1 Like

Love this ! Is +/- 60fps on mobile ?

I’ve never tested the app on mobile device since it relies on the PointerLock API. However, I suspect it runs at 60 FPS on mobile device from the last few years. The application is not demanding (no external 3D models, just one 32x32 sprite texture, mostly simple geometries and basic/lambert materials).

No need of instances in your game ?

What do you mean by that?

Are all your constructions, particles, mesh instances or simple objects?
And for animations are you using loop functions or tween.js ?