Video Games Development

Unreal Engine 4 – How manage Materials

Unreal Engine 4 – How manage Materials

Cut / Copy / Paste Materials – Current Project

Inside a project with:

Content Browser>
– MyFolder
– StarterContent/Materials/M_Basic_Floor>

1. RMB over a material, choose Rename/Delete/Duplicate
2. DRAG AND DROP the material from thumbnail area to ‘MyFolder’, a menu appears Copy Here/Move Here

Migrate Materials – To Another Project

First organize the folder and subfolder structures, example:

Content Browser>
– MyLibrary
– – Brick (put shader material here)
– – Metal (put shader material here)
– – Glass (put shader material here)
– – Textures (put All textures here, some shaders will share same textures)

Content Browser>
– MyFolder
– StarterContent/Materials/M_Basic_Floor>

1. RMB over a material (or a folder), choose Asset Actions> Migrate…> Select the ‘Content’ folder of another project.

NOTICE: point to ‘Content’ folder or the engine will give you an error message.

NOTICE: this tool automatic migrates all dependencies.

NOTICE: Migrate reconstructs ALL the folder and subfolder structure

By |Unreal Engine, Video Games Development|Commenti disabilitati su Unreal Engine 4 – How manage Materials
Read More

Unreal Engine 4 – How to create Materials – Basic Tutorial

Unreal Engine 4 – How to create Materials – Basic Tutorial

Materials are assets applied to meshes, contributing to a scene’s visual aesthetic.

Flat Color Material

1. Run Unreal Engine 4

2. Content Browser> Add New> Material> rename it ‘MyMaterial’, the asterisk means that it is non saved yet.

3. Content Browser> Save All

4. Double Click on ‘MyMaterial’ thumbnail, the Material Editor will be opened
.

NOTICE the Main Material Node for ‘MyMaterial’ in the middle.

The hotkeys are:
– 1,2,3,4: create 1-4 Vector Constant Node
– U: UV Coordinates
– T: Texture Samples Node
– S,V Scalar parameter, Vector Parameter
– A,D,M: Add, Divide, Multiply

– LMB: drag selection box
– RMB: pan
– Mouse Wheel: zoomin/out

5. RIGHT COLUMN> Constants> Constant3Vector (3Vector means RGB, 4Vector means RGBA)

– RMB over Constant3Vector to Delete, Cut, Copy, Duplicate etc…
– DOUBLE LMB to options, set R=255 G=000 B=000

6. Connect Constant3Vector to Base Color

7. TOP TOOLBAR> ‘Apply’ to apply the mod to material inside Content Browser

8. TOP TOOLBAR> ‘Save’ to save the asset, it is the same of Content Browser> Save All

A Rock Material – Diffuse and Normal

Shader Type

1. Click over ‘MyMaterial’ Main Material Node, it will turn to yellow, now it is selected

2. LEFT COLUMN> Material> Shading Model> Subsurface, MyMaterial pins changes

Color

3. RIGHT COLUMN> Texture> Texture Sample, drag and drop it in the working area

4. LMB over Texture Sample, LEFT COLUMN> notice ‘Material Expression Texture Base’

5. Content Browser> DRAG AND DROP a color texture over ‘Material Expression Texture Base’ slot

6. Connect Texture Sample (the diffuse map)> white pin TO MyMaterial> Base Color pin

Normal

7. Repeat from point 3 to 5 for Normal Map

8. Connect Texture Sample (the normal map)> white pin TO MyMaterial> Normal Color pin

Constant Nodes

For italian people; sono semplicemente delle costanti numeriche, ad esempio collego un Constant node con valore 0.5 a Opacity per avere un materiale trasparente al 50%.

1. RIGHT COLUMN> DRAG 3 ‘Constant’ and 1 ‘Constant3Vector’

2. DOUBLE LMB over:
– Constant, LEFT COLUMN set 0
– Constant, LEFT COLUMN set 0.8
– Constant, LEFT COLUMN set 0.95
– Constant3Vector, LEFT COLUMN set RED 255 0 0

3. Make the connections

Constant (0)-> Specular
Constant (0.8)-> Roughness
Constant (0.95)-> Opacity
Constant3Vector (RED) -> Sub Surface Color

Assign a material to a mesh (Actor) in the scene

Content Browser> DRAG AND DROP the Material over the mesh in the 3D Viewport

OR

RIGHT COLUMN> World Outliner> select the mesh> RIGHT COLUMN> Details> Materials> use the dropdown menu to assign material

Ref: https://docs.unrealengine.com/latest/INT/Engine/Content/QuickStart/2/index.html

By |Unreal Engine, Video Games Development|Commenti disabilitati su Unreal Engine 4 – How to create Materials – Basic Tutorial
Read More

Unity – DateTime – JS

DateTime with Unity3D and Javascript


#pragma strict

var oraOggi : String;
var dataOggi : String;

function Start () {
	SystemData();
}

function Update () {

}

function SystemData(){
var t: System.DateTime = System.DateTime.Now;

     oraOggi = String.Format("{0:D2}:{1:D2}:{2:D2}", t.Hour, t.Minute, t.Second);
     Debug.Log(oraOggi); // in the Console 13:20:09

     dataOggi = String.Format("{0:D2}-{1:D2}-{2:D2}", t.Day, t.Month, t.Year);
     Debug.Log(dataOggi); // in the Console 22-09-15

}// END SystemData()
By |Unity3D, Video Games Development|Commenti disabilitati su Unity – DateTime – JS
Read More

Unity UI – 16:9 Responsive

Unity UI – 16:9 Responsive

How to create in Unity a 16:9 responsive interface using UI components.

Really really easy be responsive with last UI components.

1. Create a 2D Project

2. Game window, set 16:9 / Maximize on Play

Create your own graphic button

3. This is our image

custom-button

4. MAIN TOP MENU> Assets> Import New Asset> custom-button.png
NB: PNG is RGBA, your button can have a alpha channel inside, ready to use in Unity.

Project> custom-button> Inspector> Texture Type> Sprite (2D and UI)> click ‘Apply’
NB: you have to load your image as Sprite or it can not be used in UI elements

5. MAIN TOP MENU> GameObject> UI> Button

In the scene there are:
– Main Camera

– Canvas
— Button
— Text (the text of the button)

-> EventSystem

6. Hierarchy> Button> Inspector>

>Image (Script)
– Source Image: Project DRAG AND DROP custom-button over here
– Image Type: Simple

>Rect Transform
– Width 100 / Height 100 we need a square to maintain the correct aspect ratio.

7. Hierarchy> Button/Text> Inspector> Text (Script), remove the text ‘Button’

Understand Responsivity in Unity

CASE 1

8. Hierarchy> Canvas> Canvas Scaler (Script)> Constant Pixel Size

Play

The size of the button does not change even the screen is bigger

CASE 2

8. Hierarchy> Canvas> Canvas Scaler (Script)> Scale With Screen Size

Play

The size of the button will change with the Screen Size

Set Canvas Scaler (Script)> Reference Resolution: 1920×1080

By |Unity3D, Video Games Development|Commenti disabilitati su Unity UI – 16:9 Responsive
Read More

Unity – Custom UI Button Graphics

Unity – Custom UI Button Graphics

How to load your own graphic to create a custom UI Button.

1. Create a 2D Project

Simple Graphic Button

This is our image

custom-button

2. MAIN TOP MENU> Assets> Import New Asset> custom-button.png
NB: PNG is RGBA, your button can have a alpha channel inside, ready to use in Unity.

Project> custom-button> Inspector> Texture Type> Sprite (2D and UI)> click ‘Apply’
NB: you have to load your image as Sprite or it can not be used in UI elements

3. MAIN TOP MENU> GameObject> UI> Button

In the scene there are:
– Main Camera

– Canvas
— Button
— Text (the text of the button)

-> EventSystem

4. Hierarchy> Button> Inspector>

>Image (Script)
– Source Image: Project DRAG AND DROP custom-button over here
– Image Type: Simple

>Rect Transform
– Width 100 / Height 100 we need a square to maintain the correct aspect ratio.

5. Hierarchy> Button/Text> Inspector> Text (Script), remove the text ‘Button’

DONE!

Invisible Button

Use a PNG graphics completely transparent.

Setup Effects

6. Hierarchy> Button> Inspector> Button (Script)
– Interactable: check
– Transition: Color Tint
– Normal Color> 255,255,255 use the original color of the graphic
– Highlighted Color> 255,0,0 on mouse over red color will be added

Play

Swap Between 2 Buttons

How to swap between custom graphics

custom-button

custom-button-swap

2. MAIN TOP MENU> Assets> Import New Asset> custom-button.png
NB: PNG is RGBA, your button can have a alpha channel inside, ready to use in Unity.

Project> custom-button> Inspector> Texture Type> Sprite (2D and UI)> click ‘Apply’
NB: you have to load your image as Sprite or it can not be used in UI elements

Do the same with custom-button-swap.png

3. MAIN TOP MENU> GameObject> UI> Button

In the scene there are:
– Main Camera

– Canvas
— Button
— Text (the text of the button)

-> EventSystem

4. Hierarchy> Button> Inspector>

>Image (Script)
– Source Image: Project DRAG AND DROP custom-button over here
– Image Type: Simple

>Rect Transform
– Width 100 / Height 100 we need a square to maintain the correct aspect ratio.

5. Hierarchy> Button/Text> Inspector> Text (Script), remove the text ‘Button’

6. Hierarchy> Button> Inspector> Button (Script)
– Interactable: check
– Transition: Sprite Swap
– Highlighted Sprite: Project DRAG AND DROP custom-button-swap over here

Play

By |Unity3D, Video Games Development|Commenti disabilitati su Unity – Custom UI Button Graphics
Read More