Design Post Update

This image shows a finished Paused screen.

Step 1:

Before you open Unreal Engine go to http://www.dafont.com/ for download a font suitable for your game. One you download extract the file and installed ttf file. Copy the ttf file and paste in C:\Program Files(Program Files (x86))\Unreal Engine(Epic Games)\4.5(engine version)\Engine\Content\Slate\Fonts

After when you installed font open Unreal Engine. Content Browser is located in folder “Game” create new folder for User interface screens call it “UI”. In UI folder press right mouse bottom and select “User Interface” option then select “Widget Blueprint” in order to save press right click on widget blueprint and select save. Then double click on the widget blueprint to enter to edit menu.

This image show where you should create folder for User Interface.

This image shows where you should create Widget Blueprint.

Step 2:

On left top corner of the screen there is a folder called “Palette” expand “Common” select “Text Box” hold and drag on canvas or you can hold and drag on canvas under [Root] but make sure that you put on canvas.

This image shows Pause Screen editor.

This image shows canvas for screen.

Steps 3:

If you select text box then on the top right side of User Interface editor you can see “Details” options. Chose “Layout (Canvas Panel Slot) and press on Anchors and choose the middle. You can mess around and change “Style”, “Appearance” and other options. In “Content” option you can type the heading of your title.

This image shows options for Pause Screen.

This image show Text Block applied on canvas.

This image shows Text Block operation.

This image shows text applied on canvas.

Completed wood texture

1. Find a good image - flat, straight on, not patchy,  etc. See good and bad examples below.

Bad Image for a texture - not flat/straight on

Good Image for a texture - straight on with no patchy areas

2. Open image in Photoshop, crop the image to keep only the area you want and resize to a size to the power of two, best options are 128, 256, 512 ,1024 - square or rectangular. For example 512 x 512 pixels or 256 x 512 pixels.







3. Go to filter->Other-> Offset. Input a horizontal and vertical value of half the image sizes you set in step 2. So if your image is 512 x 512 pixels set the horizontal and vertical offsets to 256 pixels. What this does is take the central areas of the image and move them to the edges thus meaning the texture will line up perfectly with itself when it is 'tiled'. However, on the other hand it also leaves an unsightly, messy looking area over and across the image; this is what we need to fix next.

4. Use the clone stamp tool (alt + click to define a source point then click to clone from that point, brush will show a preview in newer versions of Photoshop) to remove the lines or fix the messy area left by the offset. Tip: use as large a brush size as possible, around 1/5 the size of the image and a hardness level between 0 and 25 for unpatterned textures such as soil, sand, grass etc. and between 25 and 50 for patterned textures like bricks, tiles etc.

Texture before cloning began - obvious lines

Texture after cloning - lines gone but blurry areas

5. Use the sharpen tool to fix any blurring that the clone stamp tool may have caused.

Texture after sharpening - blurred areas gone

6. Add a hue and saturation adjustment layer and set saturation to"-100". This will show up any patchy areas or obviously variations in light and dark within the image. These will need to be softened or else the texture will have recurring patchy areas when tiled.

7. To fix any variations in light and dark first use the dodge tool, targeting shadows, to lighten any overly dark areas. Next use the burn tool, targeting highlights, to darken any overly light areas.

Before use of dodge and burn tools - some patchy areas

After dodge and burn - more consistent hue

8. Now use any of the image > adjustment tools to add or change the colours or intensity of the texture, or in this images case add colour to the planks to match the knots in the wood.

Texture after colour has been added using the image > adjustment s tools

9. Now test how the textures 'tiles' on a canvas double the height and width of the texture. For example create a 1024 x 1024 size canvas to 'test tile' a 512 x 512 size texture. Duplicate the texture until you have 4 of them and line them up to fill the canvas. Are there any obviously repeating patterns? if so return to the texture to fix it - if not save the texture file.

4 textures 'tiled' side by side - no obvious seams or patches

10. 

To save the texture, go to file > save as and select .TGA file (truevision targa) and then choose the 32 bit option when prompted. Congratulations you have just created a seamless, tileable texture.

If you are using the texture in a 3D application then there is a little more work. For almost all 3D applications a the texture you have just created is still incomplete. A 'normal' file or 'heightmap' for the texture is still required. The quickest and easiest way to do this is using an application called CrazyBump.

Use crazy bump to create the 'normal' and if necessary (depending on the application you need the texture for) the occlusion, specularity and displacement files too. Once again save the files as .TGA (truevision targa) and choose the 32 bit option.