Scaleform HUD/UI questions

UMG is coming which will be blueprint binding to Slate, it will be experimental in 4.4, you can check it out now in 4.3 by starting editor with -umg but might be unusable. If you want easy UI fast and right now you need 3rd part stuff, Scaleform uses Flash, but theres also Cohirent UI which use HTML.

Hello!
I am a new developer using Unreal, and i’m wondering if Scaleform is worth the effort and money to buy. The Scalefrom Dev Centre requires a company email to register, and since I dont have one, I will have to buy one from google. But anyway, my question is basically that I want to create a nice menu and UI. I am not a programmer and Slate looks very complicated and ‘programmy’, however Scaleform looks way more visual and easier to use. I wanted to have a 3D UI like borderlands and it cannot be achieved in Slate. So I want to know if down the road (maybe in a new version of Unreal) it will be included in an update of some sort. Also how does Scalefrom work with UE4, is it a plugin? Or some sort of script? Also are there any tutorials on Scaleform with UE4, there are many for UDK but almost none for UE4! I have also heard about a visual editor for Slate, if this is true, when is it getting released and is it a better alternative to Scalefrom? Please keep your response simple as I am very new to game development and I do not understand complex/confusing terms. Thanks in advance

Does UMG support 3D UI’s?

Im not sure, theres 2D elements for now. Wont be supprice if they add 3d transforms for ui elements later on

Ok thanks anyway, so the UMG is a complete transformation from code to blueprint for Slate? And also any ideas when 4.4 will be released (probably will be a while since 4.3 just released?).

UMG is giving you access to slate from blueprint level, you make widget blueprints in which insted of Components in Actor blueprints you have UI editor and elements of UI are like components and you code there behavior with blueprint

So far epic doing monthly releses so 4.4 will be August/September

I also just checked how umg look like in 4.3 and its now a lot more usable, it feels like Android UI system in which youn place widgets on layout widgets, it do only 2D for now. Ofcorse its not recommanded to use in real project but you can play around with it

Ok thank you!

I create the menus using Blueprint , where using proper logic and texture combination you can create pretty much anything. For custom textures for buttons , I create the styles in WPF XAML , save the style as diffuse and opacity images , and then import those textures in UE, then use blueprint and add hitboxes , and click , mouse over functionalities to create events, along with custom text and materials. This works pretty nicely for me.

We have a lot of cool features in the pipeline. Currently working on 2D transforms so that any widget can have 2D rotation/translation/shear/scale applied to it. That will work anywhere in Slate (inside and outside of viewports). We’re also going to add 3D transforms, but that will probably only work in game viewports. Widgets will also be able to have materials applied to them, which is pretty neat.

Hey,

I create the styles in WPF XAML , save the style as diffuse and opacity images

I’m really interested in how you save the style as images ?

Thanks

Hi , currently I am defining a style in xaml , say a button with my custom style , placed inside a border or a canvas , giving it a name and using the below code to save it as image

RenderTargetBitmap targetBitmap =
new RenderTargetBitmap((int)inkCanvas1.ActualWidth,
(int)inkCanvas1.ActualHeight,
96d, 96d,
PixelFormats.Default);
targetBitmap.Render(inkCanvas1);

BmpBitmapEncoder encoder = new BmpBitmapEncoder();
encoder.Frames.Add(BitmapFrame.Create(targetBitmap));

// save file to disk
FileStream fs = File.Open(fileName, FileMode.OpenOrCreate);
encoder.Save(fs);

But I am creating a more optimized and generalized code where you can write any xaml style in runtime , preview it , and then save it. Let me finish the code and I will share the application with you. Meanwhile you can test the above code.

Yes please add the 3D transforms it’s really missing for cool looking HUDs

Thank you for your answers and good job for this trick !

Anyway, using Adobe Fireworks or something similar (a free/cheaper alternative) would do the work or you do think working with Xaml/Blend is better ?

Using any object oriented programming language , you can achieve desired result , however , I dont have experience in Adobe Firewarks, so not sure how easily you can achieve this , but using xaml, it is convenient , or you can use any graphics editor like photoshop to create desired result, or Render to Texture to create texture from rendered 3d model in 3ds max.