keskiviikko 25. tammikuuta 2017

3DS MAX & UNITY - Animation

NAV16AP

3. jakso lukuvuonna 2016-2017

Now we’re going to create two animations in 3DS Max for the same character and import those to Unity.

First start by creating and animating your character in 3DS Max. Create two animations for the character: idle & walking. Do these animations in the same timeline. After you have finished the first animation start animating the second after that in the timeline.


When you are finished export the model as fbx to Unity. Select your model and go to rig tab in inspector. Select legacy as the animation type.


In unity drag your character to the scene. Open the animation window when your character is selected. This shows all movement in the same animation. Next to the animation name it says read only. This means you can’t make changes to that animation so both idle & walk will play after another.

To get two different animations you can switch, you need to slice the full animation. Select the frames you want to include in the new animation and press ctrl + c. This will copy the frames. 


Then create new animation by clicking with the right mouse button in the project folder choosing create -> animation. 

Click the animation so that it’s active and go to the animation window. Press ctrl + v to paste the frames to the new animation.


Do the same thing for the second animation so that you have two separate animations.

To use these animations in a character you need to create animator for the character if there isn’t one already. Create animation inside the character inspector as well as in project folder. Remember to choose the controller you have created in the inspector.



After that open the animator window. 


Create two states named idle & walk. Select correct motion for each state and do transitions between them.


Create a Boolean parameter called move. 


Now you can add walking condition in the idle state. Remember to use bool true for it. Do the same for the walking animation but choose bool false this time.


Now the character has two animations only thing left is to activate those in proper FSMs. Create FSM for the character that controls the animations. You need to have installed Playmaker for this.


In the start state use action get key down 4 times. Create event called move and use W, A, S and D as key on the get key down action and event walk_animation in the send event section. Create set animator bool action and your move parameter in it.



Then create a new state. In this state use action get key up 4 times. Use same buttons and in event section use finished as transition. Create set animator bool action and choose again the move parameter. Put checkmark in the value section so that it will be true when player presses any of the movement keys.


Now you can test your animation in the game window. When no key is pressed the idle animation should be playing. When any of the WASD keys is pressed it should change the animation to walking.

sunnuntai 22. tammikuuta 2017

PHOTOSHOP - Matte painting

NAV16AP

3. jakso lukuvuonna 2016-2017

BRIEF HISTORY OF MATTE PAINTING

Matte painting is a way to create image that combines different image elements into a one final piece. It has been used in the film industry since late 1800s. Back then they used cut-out cards to create back grounds for live action. The technique was revolutionized when Norman Dawn started using painted glass placed between the camera and live action. It was then possible to add things into the scene that did not belong there.  Matte shot was used in films like King Kong (1933), Cleopatra (1963) and Indiana Jones: Raiders of the Lost Ark (1981).

Today matte painting is alive and well but uses digital images instead of painting on glass. In the 1990s the first film to use digitally composited live-action footage was Die Hard 2 (1990) in which the traditional glass matte painted picture was photographed and scanned to computer.

Now digital images are created with 3D models and environments with matte painted textures to allow camera movement in the scene. Still simplest matte paintings are 2D digitally created images in which the camera is stationary during the sequence.

WHAT IS MATTE PAINTING

Matte painting is easy to understand but hard to master. Basically it’s tricking the viewer believing he or she is seeing the real thing when actually most parts are created digitally. It’s important that the created image is as realistic as possible. For example, almost everything you see in The Lord of the Rings movie is created digitally but the viewer rarely questions the authenticity of the scenes in the movie.

Matte painting is also used in video games but mostly for the cinematics or posters/marketing material. Sometimes it can be used for day and night cycle or as backdrops.

Matte painting is not simply joining few photos together. It’s an intricate piece in which the artist has well though depth of field, lightning, scale and composition. Every piece in the final must work together seamlessly and this is a challenge for even the most experienced artist.

TIPS AND TRICKS

SIZE

First you’ll need to decide the size of your matte painting. It’s wise to work on a file that is 150%/200% of the final size. In that way the imperfections will get minimized and it will be easier to get rid of hand painted look when the final image is sized down.

GRAIN

Most hand painted pieces will stand out from the original photo used because it lacks the grain of the original image. In Photoshop this can be added later to the hand painted parts by using filters. From the filter gallery you can use either film grain or grain. Also add noise will work on some cases. Apply the grain effect to a layer filled 50% gray and set the blending mode to overlay. Test with the layers opacity to get desired effect.

CLONE STAMP

Clone stamp tool is an effective way to remove unwanted things in a picture. Select the tool and then select area you want to use as stamp by holding alt and clicking the area. You can also change the size of your stamp when needed. Then simply click the area you want to add the stamp to.

PATCH TOOL

Another tool that works in a similar way is the patch tool. Select the area you want to change and drag the patch to an area you want to appear in the patched selection. You can also use this effectively when combined with clone stamp, some hand painting and mixing brush.



REFERENCES

It’s important to have as many references as possible. So take photos whenever you can in different places, perspectives and lighting. Remember when later combining different pictures not to force two images together although you might have a great idea in real not all photos fit and you must recognize which will go together and which won’t.

LAYER MASK AND CLIPPING MASK

Layer mask can be created by clicking the mask on from the lower right corner. It is the most convenient way to erase something you don’t want in a picture without erasing it straight from the picture. If you have the layer mask and remove it then the original picture is still intact.

Clipping mask only affects the layer it’s clipped on to. This will be useful when working with multiple layers and only wanting to change specific things in each layer separately. Clipping mask can be created by right clicking the layer you want to use as clipping mask and then choosing the option create clipping mask.




TASK:

Create matte painting landscape in Photoshop by using at least two different photos and hand painting. You can draw some inspiration from other talented matte painters such as David Luong who has done matte painting for several different Blizzard Entertainment games. Browse his work: http://www.davidluong.net/art-portfolio/

keskiviikko 18. tammikuuta 2017

UNITY & 3DS MAX - heightmap

NAV16AP & NAV15AP

3. jakso lukuvuonna 2016-2017

Heightmap is a greyscale image in which white color represents maximum height and black color represent minimum height. The concept is similar to normal mapping and can be used with normal maps to create extra definition.

Heighmaps can also be used to make 3D terrains. We’re going to make one in 3DS Max as well as in Unity.

HEIGHTMAP IN UNITY

Unity wants to import the heightmap in raw format. You can create your own heightmap in Photoshop. The most simple way to test this is by using filter render clouds. This creates a greyscale image that can be used as heightmap.



When you save the image remember to save it in Photoshop raw format. Choose non-interleaved order in the save settings under save channels in. This way the image will create normal bumpy terrain without jagged edges.


Next create terrain in Unity. Go to the settings button and choose import raw. Choose your photshop raw file. 


In the pop up window select correct size for width and height and decide your terrains size. Now you should have terrain created by the heightmap image. You can still make adjustments to it with other terrain tools and paint texture.


HEIGHTMAP IN 3DS MAX

You can use the same heightmap that you created in Photoshop for Unity in 3DS Max. You need to save the heightmap in jpg so that 3DS Max will recognize it.

Start by creating plane. Size for it can be for example 500 x 500. Add about 100 length and width segments. The amount of segments will affect on how much detail the terrain will have.



Then add a modifier called displace. 


In the image bitmap sections choose your heightmap image. Now the 3DS Max will take the color difference and use it as a height difference.


You can change the strength of the height difference by changing the number under displacement parameter/strength. In this image the strength was 100.


You can make changes after that but at least you have a decent base to work on. 


Next add texture to your model. Paint suitable texture in Photoshop using heighmap as guidelines. After adding texture to the model you are done.


Now you can export your model as fbx and use it in Unity.

TASK: Create your own heightmap and a texture for it in Photoshop. Create terrain with these instructions in 3DS Max and in Unity.

maanantai 16. tammikuuta 2017

UNITY 3D - Terrain

NAV16AP

3. jakso lukuvuonna 2016-2017

Let's take a look at the terrain tool in Unity. This time the objective is to create your own outdoor terrain. First create a new Unity project in 3D mode. The Unity terrain tool can be found in the top tool bar under the Game object -> 3D object tabs. Choose terrain and Unity will automatically create a game area for you.

As you can see the terrain is completely black. This can be fixed by adding some light into your scene. Choose directional light from the light tab under game object tab. This light will simulate the sun/moon.

Now there are many options in the terrain object. First tool is used for raising or lowering terrain. This is done with a brush that has different properties. You can change the size and opacity of the brush. You can also decide which kind of brush you want to use. Now start creating your terrain. To raise terrain simply paint it by clicking on the flat terrain. To lower the terrain use shift + right click.





Next tool in the terrain object is paint height which is quite similar to the raise terrain tool. This has additional options in which you can determine the height painted. There is also flatten option in which you can flatten the terrain to the desired height.



The smooth height tool is used to even the altitude differences. It also has options for different brushes as well as brush size and opacity.




After you have created the terrain you want it's time to put some texture to it. This is done with paint texture tool. For this you're going to need textures to paint on. These can be done in Photoshop but make sure that your textures are tileable. This makes your terrain to appear consistent. If you want to do different types of grounds.



Next there is an option for tree painting. First you must assign a tree to paint into terrain. Click the edit trees button and choose add tree. Select tree prefab you want to use. There are built in trees for you to test but it's always better to create your own trees in 3ds Max.



After you have selected the tree type new settings for the tree painting appear. Again you can select brush size that affects the area trees will be painted in. You can also affect how dense the painted trees will be and the height variation of the trees. Shift clicking will remove trees while only right clicking will add them.


The mass place trees button will place trees all over the terrain. You can still add or remove trees with the brush tool after this.

Next button is for little details in the terrain such as grass and rocks.


If you want to add grass to the terrain then select edit details button and add grass texture. Select texture you want to use. Again there are built in grass textures but you can also make your own. There are few settings for the grass such as height and color. Noise spread will control the size of the alternating patches. If the billboard option is selected then the grass will always face the camera.


The add detail mesh can be used for rocks and other 3D objects. This will take a prefab you choose and generate them with properties you have selected. Most important setting in this is the render mode. If you select grass then the object will be flattened into 2D image. With the option vertex lit the object will be rendered as solid, vertex lit object.



Last tool is the settings for terrain. Here most of the settings are quite clear. Base map distance means the max distance where terrain textures are shown at full resolution.

In the detail object and tree settings there are three settings for distance: detail distance, tree distance and billboard start. These will define how far from the main camera the objects and trees will be culled and trees changed to billboard images.

Lastly there is an option for importing and exporting raw. This allows you to set or save heightmap to an image file. You can use your own greyscale heightmap Photoshop file to create detailed terrain.


TASK: Create your own terrain with the terrain tool. Use at least two different textures to paint the terrain. Put some grass and trees in suitable places. Model a rock in 3ds Max and use it with details tool.