The Making of Unreal Nano

Json (Joohansson)
Oct 30, 2020 · 7 min read
Image for post
Image for post

Welcome a behind the scenes tour of unreal.nanos.cc. Starting using Unreal Engine 4 from scratch can be daunting at first, but once you learn the basics, it’s an excellent tool for bringing ideas to life! There wasn’t anything I couldn’t pick up quickly from the extensive collection of helpful video tutorials available on Youtube.

The Landscape

I used World Machine Basic, a free application for creating heightmaps that can later be imported to UE4. The resolution is not the best in the free version (513x513) but sufficient for the job. With lots of tweaking and tuning of parameters, I ended up with this flowchart.

Image for post
Image for post

With a layout generator defined with some polygons and shapes, I was able to create a mountain ridge where the sun would set in the west, and leaving space for a lake to be carved out later in the middle.

Image for post
Image for post

It rendered out like this:

Image for post
Image for post
Image for post
Image for post

A broader second landscape was then generated to cover some far distance mountains, outside the first one.

Image for post
Image for post

Exported as a heightmap, tweaked in an image editor and imported to UE4.

Image for post
Image for post
Landscape heightmap
Image for post
Image for post
Landscape in UE4 with material applied
Image for post
Image for post
Large render with the small landscape in the centre

Before adding water material, I applied the landscape material using the brushify.io kit with forest pack.

Image for post
Image for post

Foliage, Trees and Water

I applied a custom grass layer using brushify and several grass assets from various places, including the city park kit and optimized grass lib.

Image for post
Image for post

The water was custom-made, based on a combination of the brushify water and city park water. I also applied a planar reflection layer on top of it to get that high-quality reflection you see in the cinematic trailer. The underwater volume was constructed by a physics volume, so the character knows when to swim, and separate post-processing volume for visuals.

Image for post
Image for post

The rest of the foliage and trees also came from the city park kit and placed using mostly procedural functions. I utilized the UE proceduralFoliageVolumes for natural distribution, with a handful of custom placements added by myself.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
One of the procedural volumes
Image for post
Image for post
Example of one procedural tree and lifespan

A lot of effort went into the remaining light setup and main post-processing volume. The light setup is basically a skySphere, a directional light (sun), skylight, skyAtmosphere and exponentialHeightFog. Resulting in this landscape.

Image for post
Image for post
Final light setup

Objects, Places and Fire

I used the barn and hut from the city pack and the countryside pack and also created a fireplace, with custom fire, based on this fire package and some other meshes.

Image for post
Image for post
Image for post
Image for post
Image for post
Image for post
The fire FX
Image for post
Image for post
The spooky barn

The jetty is also a modification of one of the assets from the city park pack, and the boat was given a wiggle-function to make it sit more realistically in the water.

Image for post
Image for post
Image for post
Image for post
Boat wiggle function based on randomized X and Y sinus curves

Game Logics

Image for post
Image for post
Options menu
Image for post
Image for post
Option menu logic

The character logic had to be modified a bit as well with custom sword light, camera switch, position save/load, and other improvements.

Image for post
Image for post
Character logic

The Nano tree is another custom feature with 18 lights fully programmable with websocket listener from the Nano plugin. The lights will animate when a new transaction is sent to a specific account, and a QR is displayed to the user when they come near the wooden sign.

Image for post
Image for post
Image for post
Image for post
Tree logic sequencer

Where each light intensity is controlled over time like this.

Image for post
Image for post
Tree light intensity time function

QR generator and websocket listener from the main blueprint.

Image for post
Image for post

The Nano transaction visualizer is a custom function I got help from Nano plugin designer and developer Wesley Shillingford to create. It spawns spheres with different sizes based on the transaction amount. It assigns different materials to them based on the transaction type, and all transactions are taken from the live Nano network.

Image for post
Image for post
Nano Transaction Visualizer at 200 transactions per second

The local fog clouds that can be found in the level are based on a particle system which spawns volumetric type material instances.

Image for post
Image for post
Local fog cloud
Image for post
Image for post
Cloud with volumetric light replicated from the fire

The 175 sound actors were placed out with care to give a natural audio feeling.

Image for post
Image for post
Sound sources

VR, Multiplayer and Cinematics

Image for post
Image for post
Calculated nav mesh

Also made a little VR game to show the possibilities.

Image for post
Image for post
VR tower game with real physics simulation

Multiplayer support was added with some additional logic to handle character names and server communication and the game server was compiled to run in Linux.

Image for post
Image for post
Example: Rotate the name label above the character to always face the players

The final step was to make the cinematic trailer, which involved programming various camera paths and render out the result in 4k resolution. I then combined all clips and synced audio from the scene.

Image for post
Image for post
Final sequence
Image for post
Image for post
One of the camera rigs (not included in the final movie)

The most advanced shot was probably the character animation where the player location had to match both the feet animation speed and position of the beach, with a camera to run along with it. Turned out fine I think!

Image for post
Image for post
Character animation
Image for post
Image for post
Running character final result

Time to play!

Nano

The best place for all of the latest Nano updates…

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store