This will be quick and easy tutorial but I need to be sure you guys know that you can add materials to your UMG widgets.

Just one simple goal:

• Make health and armor bar more attractive,

This Tutorial has been created using Unreal Engine 4.8.2. 
Make sure you are working on the same version of the engine.

Every time you see texture reference in your widgets you can assign material instead of texture. When working on UMG Material be sure that:

• It’s Unlit,
• It’s using Translucent or Masked or Additive blend mode,
• It won’t be heavy. Basically HUD is displayed always on screen and it’s taking lot of space. Translucent materials are heavy even on PC,

There are some limitations to be aware of:

• Customising UV will look weird on hi-end Mobile even if you are using customised UV channels,
• Customising UV won’t be seen on low-end Mobile devices. For example if you are animating texture it won’t be animating on device,
• Material parameters won’t work, but as far I can know Epic is working on it,
• World Position Offset isn’t working,

So basically if you are working on PC game you could use 100% power of UMG materials but when working on mobile game keep in mind that some features aren’t supported!

Thanks to materials you are able to create cool effects for your UI. Good example is Crysis shield:

It can be done using UMG and materials without a problem.

IMPROVING HEALTH BAR

Let’s start by improving health bar. Create material from progress bar fill texture.

Material is really simple. Just panner animation added to BeamPulse texture.

Now go back to your UMG widget and assign this material to fill image.

And that’s all!

IMPROVING ARMOR BAR

Do the same thing as with health bar material.

Here is the result: