Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon
12. January 2016

 

In Part One of our level creation in Blender tutorial series, we created a skybox to define the boundaries of our game level.  In this tutorial we are going to create the terrain for our level.  You will probably be surprised by just how much we can accomplish with almost zero effort.

 

Creating a Height Map

First we need a height map.  A height map is a remarkably simple concept that has been around for ages.  Essentially you are defining the height of a grid of terrain using a simple gray scale image.  You can create this image a couple of different ways.  First you can simply fire up any image editor, even MS Paint, and draw the texture.  The blacker the pixels, the lower the corresponding terrain, while a white pixel is as high as possible.  In addition to painting by hand there are several applications free and commercial that are capable of exporting a height map for you.  Examples include Terragen, Bryce and Geovox although there are many more.

 

For this example I’m simply going to use Paint.Net, but any image editing program would work fine.  Create a new image, while not a requirement, power of 2 ( 512x512, 1024x512, etc ) textures generally perform best.  Next set the base colour to 128/128/128 RBG, like so:

image 

Use the bucket fill tool to fill the entire image with this color.  This will be the neutral value, the resulting terrain will neither be elevated nor depressed.

 

You can then vary the grayscale by either raising/lowering all RGB values ( aka 43,43,43 or 250,250,250 ) or by sliding the V slider under HSV.  Remember, darker the colour, lower the terrain, lighter the colour, higher the terrain. 

 

In the end, I painted this rather simplistic height map.

heightmap

 

This will result in a high border around a pit of utter and complete dispair... muhahahaha.

 

Displacement in Blender

 

Now that we have a height map, it’s time to put it to use.  The good news is, this process is remarkably simple.  First we need something to apply the height map.  A height map needs an underlying mesh to apply to and if there aren’t sufficient vertices to be displaced by the height map, your results aren’t going to be very good.  This means we need a large flat surface with a decent amount of detail...  We need a plane.

I’m building on our scene from Part 1.  Set the 3d cursor to the origin, then create a new Plane via Add->Mesh->Plane.

image

 

Your scene should now look something like this:

image

 

Now we simply want to scale the Plane to the appropriate size, which is going to be entirely dependent on your skybox dimensions.  I personally scaled by a factor of 10.  After scaling it, we need to add details.  To do so, in edit mode, simply apply a subdivision (W->Subdivide)

image

 

Each time you perform this, you will double the mesh density.  I preformed it about a half a dozen times, resulting in a mesh with 32K triangles, which seems about appropriate.

image

While you are here you might as well UV unwrap your plane (U->U).  Also switch to Smooth shading:

image

Or your terrain is going to look VERY edgy and not at all organic.

 

Ok, now that we have our plane to deform, we need to load in our height map.  It doesn’t really matter where you add the texture, but I will go ahead and attach it to our plane.  Switch over to the textures tab, add a new image texture and load our heightmap.  It might make sense to rename it heightmap so it doesn’t get confusing, but you don’t have to:

image

 

Don’t bother setting UV coordinates, we aren’t going to be displaying this texture.

 

Now, in Object mode, with your Plane selected add a Displace modifier:

image

 

Now select your image in the texture field, change Texture Coordinates to UV, then select the UVMap.  If you don’t have the option, you didn’t UV Unwrap earlier!

image

 

Our height map will now be applied to our terrain:

image

 

Now we can use the Strength value of the Displace modifier to determine the strength of the height map on the displacement:

HeightMapInBlender

 

The Video

 

Back To Part One  ||  On To Part Three

Art Design


12. January 2016

 

This tutorial covers the basics of creating game levels in Blender.  There are a set of companion videos on YouTube that cover the same topics.  We will be looking first at creating a skybox to define the boundaries and skyline of our game.  Next we create the terrain of the game using a displacement map and a height map texture.  Finally we show how to paint the terrain using multiple textures.  I assume you have prior experience using Blender.  If you do not, this text based or this video based Blender tutorial series will teach you everything you need to know to follow along here.

 

Creating a Skybox

A skybox is pretty much exactly what it sounds like, a box flipped inside out with a 360 degree sky texture applied to it.  That said, it is quite common to remove one side of the box (the floor) as it is generally never seen.   There are two approaches to the texture map used to texture the inside of the skybox.  First we can use a single texture in the shape of a lower case T.  Or we can use a separate texture for each face of the box.  The advantages of the first approach are a) it’s easier b) it uses less texture memory.  The advantage of the second approach is much higher quality textures.  We will take the first approach in this example, but if there is enough demand I can do a tutorial covering the second method.

 

So first we need a skybox texture or textures.  Generally theses are a sequence of seamless textures representing the front, back, left, right, top and optionally bottom textures in the scene.  For this example I am actually using a cool procedural galaxy skybox generator available here.  Play with the random seed until you get a value you like.  To have it generate a t-shaped texture, make sure that Unified Texture is selected:

image

 

The end result I am working with looks like this:

skybox

 

Ok, now that we have our skybox texture, let’s fire up Blender.  The default scene is surprisingly EXACTLY what we want.  All we need is a simple cube, like so:

image

 

With the cube selected, switch into Edit mode and in the tools (T) panel select Shading/UVs then Flip Direction.

image

This reverses the normals of each face in our cube, effectively turning it inside out.

 

Now we need to mark edges to unwrap the UVs.  Switch to Edge select mode and select the following edges:

image

 

Then, still under Shading/UVs, click the Mark Seam button.

image

 

Next select the entire object (A) then click Unwrap.  In the UV/Image Editor, it should look like:

image

 

Perfect, now we just need to import our texture.  In the Material tab of the Properties panel, we first want to enable Shadeless:

image

 

Shadeless prevents the lighting of the scene from interacting with the material, which for a skybox is exactly what we want, otherwise it would be far too dark and unevenly lit.

Now switch over to the textures tab, add an image texture, load our generated skybox texture, then make sure mapping is set to UV, like so:

image

 

In the UV Image editor, with all of the faces of our cube still selected, make our texture active, then using a combination of rotation and scaling, align the UVs to the texture map:

image

 

That’s it, your skybox is now complete.  Of course you probably want to scale it up to a huge size so it envelops your entire scene.

image

 

If you have any unsightly seams, your UV maps is probably off the texture ever so slightly.

 

The Video Version


 

On To Part Two – Terrain

Art Design


11. January 2016

 

Out of the box Unreal Engine 4 has support for C++ and Blueprints.  This leaves a bit of a gap for people that want more of a scripting experience but don’t want to work in a visual language like Blueprints.  Of course we have full source code access and Unreal Engine has solid plugin support so it was only natural for a few third party languages to pop up.  What follows is the list of external programming language options for developing in Unreal Engine.

 

JavaScript

Probably the best supported language alternative, there are two major implementations of JavaScript for UE4:

 

Unreal.JS

Released by NCSoft, the folks behind the popular Guild Wars RPG series, this plugin adds JavaScript support via the V8 engine.  Impressive in it’s scope, it includes CommonJS module support, .d.ts files for Intellisense support, a Jade like templating engine, live reload as well as access to the entire Unreal SDK.

 

Flathead

Another implementation of JavaScript via the V8 engine.  Older, small in scope and less supported, so probably best to go with Unreal.JS.

 

C#/.NET

This one is a bit tricky.  There was an early leader in an implementation by Xamarin, until licensing differences killed that project.  The only other alternative is currently Windows only.

 

Mono for Unreal Engine

Sadly no longer under development because of licensing issues, this version is outdated, requiring Unreal Engine 4.4 and a Xamarin license to deploy.

 

Klawr

Currently the best bet for C# development using the Unreal Engine but sadly confined to Windows only.  In the authors own words “This project is still highly experimental, and not very useful (though it's getting there)”.  It’s open source and hosted on Github if you wanted to contribute.

 

Haxe

There is one project looking to add Haxe language support to Unreal Engine.  Fortunately it’s pretty far along.

 

Unreal.hx

Fully supporting subclassing UActor and Blueprints, the Haxe code compiles directly to C++ code leaving minimal overhead.  This implemetnation gives access to the entire Unreal Engine API.

 

Other

 

Rust

Slightly different than the other languages on the list, this project implements a simple plugin enables you to link a 3rd party Rust library to C++ in Unreal Engine.

 

SkookumScript

A custom scripting language for Unreal Engine (and other game engine) development, SkookumScript is in their own words “SkookumScript is a text-based programming language for creating performance-critical, real-time gameplay. It is now available as a free turn-key plugin for Unreal Engine 4 (UE4)”.  SkookumScript was used to create the game Sleeping Dogs.

 

 

No doubt there are languages I’ve missed, so if you know of one at is in at least a runnable state, please leave a comment below and I will add it.  I am somewhat shocked that I couldn’t find a Lua plugin at this point! 

Programming


11. January 2016

 

… however the ultimate question of price remains unanswered.  In an interview on the Guardian, HTC CEO Cher Wang announced the February 29th pre-order date, with wider commercials sales beginning in April.  Perhaps of more interest from the interview is just how much HTC is betting the company on Virtual Reality.  Suddenly HTCs involvement with VR seems a great deal more…  significant.

 

From the Telegraph article:

HTC will start taking pre-orders for Vive, its virtual reality headset, from February 29, its chief executive has confirmed.

Cher Wang told the Telegraph the company had chosen to refocus on virtual reality (VR) and away from smartphones, saying the company was now "more realistic".

Vive has been developed with game maker Valve, designed to fully immerse its wearer in their virtual environment while playing games. It will go on wider commercial sale in April, and will compete with Facebook-owned Oculus Rift and Sony's PlayStation VR as the technology finally enters the mainstream. Its price remains unknown.

 

From the linked interview:

When asked what went wrong, Wang doesn’t dodge the question. “Our flagship is in direct competition with several others, we have had some problems with it for two years,” she admits.

“I think the problem was competition – Apple, Xiaomi, these companies spend tons of money on communications and marketing, they pump a huge amount of investment into the market. There are a lot of Chinese competitors.”

--snip--

So will HTC finally fold up its smartphone business this year?

Wang doesn’t deny this as vehemently as expected. “Now we are more realistic. We feel that we should apply our best design to different type of sectors,” she says. “Yes, smartphones are important, but to create a natural extension to other connected devices like wearables and virtual reality is more important.”

 

I have been an HTC fan for several years, starting back with the HTC TYTN right up until the HTC One, which I recently gave up on and replaced with a Galaxy S6.  They are capable of making a high quality and innovation devices when they set their mind to it.  As I mentioned just a few days ago HTC has the opportunity to win the VR war before it begins.  Seeing now that they are basically betting the company on it, I can’t help but cheer for them.

GameDev News


11. January 2016

 

Today Paymentwall released an SDK for the popular game engine Unity that enables developers to accept payments directly within their application.  From the press release:

“We are very excited to release our Unity Integration to allow gamers to make in-game purchases in their local currency, and in their most preferred payment method,” said Jevin Tryon, Project Manager at Paymentwall. “As a result, game developers will be able to increase their revenue, and monetize their games all around the world, easily.

The ability to offer different payment methods and manage in-game purchases will allow developers to reach different markets worldwide and maximize their revenue. This is especially important as the global gaming market is expected to grow at a rate of 9.4% annually, and reach a revenue of 107 billion US dollars by 2017, according to the 2015 Global Games Market Report from Newzoo. Through the Paymentwall SDK, Unity will become the most wanted platform among game developers. In 2015, the number of developers using Unity reached a million, as compared to 60,000 developers in 2014, said Unity CEO John Riccitiello.

The Unity Editor comes with an array of tools for creating and enhancing graphics, animation, as well as 2D and 3D physics for games through effectors and colliders. Editor also supports C#, JavaScript, and Boo to help developers optimize user experience. To save time on game development and updates, Unity’s asset store offers ready-made plug-ins, models, extensions and services; which now includes Paymentwall SDK.

Developers will be able to level up the gaming experience through Paymentwall SDK. Their end-users can now pay for in-game purchases in a manner that is most convenient for them. The SDK also supports customization of the checkout page to reflect the look and feel of the game itself, contributing to a seamless user experience. Fraud protection and risk monitoring services are also part of it, to ensure safety for both end-users and developers in every transaction.

Unity checkout

Example of Paymentwall’s one-click checkout page for Unity

Unity developers will be able to increase their revenue with Paymentwall SDK, while providing their users a better experience within their games. The creation of Paymentwall SDK for Unity makes the game development platform an all-in-one solution for both new and existing developers that seek to earn money from their games.

This is actually different than the myriad of In App Purchase plugins out there, as ultimately IAP make use of the underlying store (Steam, Google Play Store or Apple Store) for processing the payment, while in this case PaymentWall is the processor.  I would actually be somewhat shocked if Apple would allow this past their terms and conditions given their previous attitude towards transactions done on the AppStore (AKA, they want a 30% cut of everything, from app sales to Netflix subscriptions or Amazon purchases).  In fact, I am almost positive that neither Google nor Apple would allow you to use this SDK with their app store, making this desktop only.  I suppose this system could be effective for people directly selling a game they want to monetize in app purchases on.

 

Paymentwall started life in 2010 as a way for developers to monetize Facebook applications, until Facebook effectively shut out outside providers a year later.   The name seems a bit odd to me, as I had always associated the expression “Pay Wall” as derogatory.

GameDev News


See More Tutorials on DevGa.me!

Month List