Tutorial:Content:Rendering setup

From FIFE development wiki
Jump to: navigation, search

Introduction

Rendering setup is one of the most important aspects when creating pre-rendered sprites as it has great control over the final outcome. Among other things it controls the perspective as well as affects the mood or visual style of the sprites. The overall importance of the rendering setup is the reason you should spend enough time making a proper rendering setup for your project. The good news is, you only have to do it one time, because once you get the rendering setup right, you are already halfway to creating great sprites.

Setting the camera

Deciding on the perspective

First thing to do is decide on what kind of perspective you want for your project. FIFE comes with a nice tool for experimenting with different views, called geometry_twister. You can find it in the Folder.png <FIFE>/tools folder. Note that you will need active python 2.6 installed to use it. It's simple to use and also comes with all the instructions on how to use it. Once you find a view you like, remember the values as you'll need them in the next step.

Geometry twister.png

These are the relations between different camera values in geometry twister, FIFE and Blender:

  • Tilting value in geometry twister = negative tilt value in FIFE = RotX value in Blender
  • Rotation value in geometry twister = rotation value in FIFE = RotZ value in Blender
  • Bounding box values in geometry twister refer to width and height of your basic ground tile. In Blender this corresponds to the render size, though these values are not alpha and omega, since some tiles can be "taller" and sprites can usually also go outside their tile's bounding box.

In Blender

We'll start from scratch. Select all and delete it. Now create a new camera at the starting position and with no rotation. Move the camera 10 units upwards, along the z axis. Set the 3d cursor as the pivot and also make sure the 3d cursor is at default position. If it's not, do this by pressing shift+c.

Rendering camera1.png


Go to side view and now you can rotate the camera around the x axis. By this you will control the "tilt" camera value in FIFE. If you open up the "Transform properties" panel, you will be able to see the exact values for your camera's rotation.

Rendering camera2.png


Now go to 3d view and rotate the camera around the z axis, and the value will correspond to "rotation" camera value in FIFE.

Rendering camera3.png

Now go to camera panel and turn on orthographic. The scale value is where you will control the "zoom". Moving the camera in 3d space will not affect the zoom level. However, if the camera is too close to your model and intersects it, you can move the camera further away by moving it along its local z axis in 3d window.

Rendering camera settings.png

The scale value should be 5.657 to render exactly one default plane (2x2 blender units) at the default location. If you change the rendering value by factor of 2 or 1.5, then this value of 5.657 should also be changed by the same factor. This will keep the rendered sprites of the same size in pixels as they were on the smaller render.

This is the source I used for this last piece of information: http://www.tt-forums.net/viewtopic.php?p=354614#p354614

Rendering settings

Go to scene buttons and make sure the following settings are, well, set.

Rendering settings.png
  • OSA is antialiasing
  • Premul makes Blender render with transparent background
  • Box is one of the filters for anti-aliasing, the default Gauss produces too blurry results so you should change it
  • PNG is the output format and RGBA means it will be saved with all the colours + alpha channel
  • SizeX and SizeY are self-explanatory, the values shown here are not necessarily the ones you have to use


Setting the lights

With lights, we have quite a few more options. We can have more than one light and these can be of five different types. I will only show you one approach here and give you some general guidelines, because options here are really many and a lot of this is also general knowledge on lights which you can learn elsewhere.

You will need a test object with a completely white material to test the settings. It's easier for me to give you the .blend file so you can see what testing object I used and how I positioned the lights instead of posting screenshots and procedures how and where to create those lights. The following steps are then an explanation how and why the current settings were used, so use the provided file along with the steps for the best learning result.

http://wiki.fifengine.net/images/9/9c/Rendering_setup.zip


Main light

As the title suggests this will be your main light and it will provide the most luminosity for your scene. The lamp type should be Sun and not casting any shadows. In addition I changed its colour to a very, very pale yellow to make the light more sun-like.

Sun lamp UI.png


Now observe your test object and pay special attention to the brightest, most illuminated area (hint: it's on the sphere). That area should be white, but it shouldn't be too large. If it's not white (1), it means your setting is too dark and thus you will have trouble getting brighter tones. If the exposed, white area is too large (3) & (4), it means you will loose surface information. (2) is of course the balanced setting we want.

Sun lamp energy.png


Shadow light

This light is used when you want to control the shadow separately from the main light which can be rather handy. Simply duplicate your main light and rename it to something more meaningful, so you'll be able to find it later if need be. Change the light type to spot and in Shadow and Spot panel, turn on Only Shad, this will make the light cast only shadow and not affect the luminosity of the rendered objects. The stronger the energy of the light, the stronger the shadow and vice versa. You can also play with SpotSi and SpotBi values to control the softness of the shadow. Also make sure either Buf. Shadow or Ray Shadow are enabled, or the light won't cast any shadows.

Shadow lamp UI.png
Shadow lamp results.png


On this example, you should observe the cast shadows and how the lamp's energy affects how dark the shadows are.


Ambient light

Usually the dark parts of your model will be too dark and to get a better result we will use an ambient light. This light will represent all the light that in nature bounces of various surfaces and scatters to create milder contrasts. This light will be coming from below and aim primarily at the darker parts. The lamp type is Hemi, it should have no specular enabled and a very low energy value, around 0.10 - 0.20 (though other values could also work, these are just aproximations). The ambient light shouldn't be too strong or the darkest parts won't be dark enough.

Ambient light UI.png
Ambient lamp results.png


You will generally not need to use an ambient light if you'll be using ambient occlusion (see next section).


Ambient Occlusion

Ambient occlusion, or AO, is a nice and easy way to add quality and life to your rendering setup, if you didn't quite get there when playing with the other lights. In Blender, you can find it under Shading -> World Buttons. It's easy to use, but takes quite some toll on the rendering speed. If you want to learn more please visit Blender's wiki for that http://wiki.blender.org/index.php/Manual/Ambient_Occlusion . Just one note, when you enable AO, the whole rendering setup will probably become too bright. To compensate you can either lower the energy of the lights you made earlier, or lower the energy of AO.

Ambient occlusion results.png


  • (1) is the default setting with no ambient occlusion
  • (2) is how pure ambient occlusion looks like
  • (3) is the combined effect without changing any values
  • (4) is the combined effect with adjusted values for a more proper result. Sun lamp energy is reduced to 0.9, the Hemi lamp is deleted, AO energy is set to 0.7 and the Shadow lamp energy is reduced to 1.4

You can see the result is quite nice, but it takes quite a bit longer to render than without AO so it's your choice whether to use it or not.


Final touches and testing

For a better organization of your setup, create an empty at default location with no rotation and then parent the camera and the lights to it. This way you will be able to rotate or re-size or move the whole rig with less effort. In addition, for every light you have go to Object buttons -> Draw panel -> Draw Extra and enable Name. This will display the names of your lamps in the 3d window and it will be easier for you to find them.

You can also test your setting with different materials and colours to confirm that it really works as it should. Here I tested how strong and vibrant colours behave under this rendering setup and I'm rather happy with the result :)

Render colour test.png

Further information regarding the lighting can be found here http://wiki.blender.org/index.php/Manual/Lighting_Rigs

Special Cases

If you, due to some nostalgic desire, want to make that weird (but oh holy, don'tthinkmeasblasphemious) Ultima 7 perspective, you can even do that. Here the camera must have no rotation and has to be above everything you'll render. Now use a lattice to deform the models themselves so they tilt to the top-left corner when you're looking through the camera. Note to self: explain how to use lattice to deform geometry.


(Not sure if this also works with armatures and animations)