Search Unity

The UI Team here at Unity has been hard at work getting the new UI system ready for release in Unity 4.6. While there’s still more work left to be done, we’ve been showing it off at recent conferences and we have hundreds of beta users working with it already. Now we’re ready to share an overview with you all.

In this video we do a walk-through of some of the key functions and workflows in the new UI, including:

  • The Canvas and how it can be used to create screen space or world space UIs.
  • The new layout and anchoring system.
  • An overview of the various UI graphics components and UI control components.
  • Examples of how the UI system integrates with animation tools.

We’re going to share more about the new UI system as we get closer to the release this summer. Let us know what you’re most eager to hear more about!

112 replies on “Overview of the New UI System”

[…] second in a series of reveal videos of the new UI tools coming soon in Unity 4.6, this time we show you a quick overview of creating […]

Just to echo what several have asked; is there any vague release date/range available?

We are in the midst of development and are starting to implement UI elements however we don’t want to start with a 3rd party or a custom GUI if uGUI will be available in the next few months.

Good job guys!

Very excited. Do we have an estimate of the release date? E.g 1-3 months type of thing?

I have a few games to release and I might postpone so I can do some funky stuff with them using this thing :).

We were very eager to adopt uGUI and 4.6 in general, but one issue we’re running into is that certain C# scripts that used to work in 4.5 don’t seem to be functional in 4.6. Is there a C# scripting reference for 4.6 available yet? Thanks!

@Tim, thanks for your quick response! Can you say anything about rendering quality, or about globalization support such as bi-directional text, special characters, etc.?

This looks fantastic! Things that we have needed for a while. Cant wait to get my hands on this. 2 thinks though, a) character spacing / kerning on text and b) bit map font support.

@Bob M: Text rendering is quite fast. We don’t regenerate and relayout text every frame, only if something is changed. This means that if you have static text it will just be the draw call cost.

Rune, any comment on how much text the new UI system can handle on the screen without perf or other issues? Rendering a few buttons like in the video is pretty easy, but what about a whole screenful of instructions or help text? Also, how does the text quality (esp. for smaller text) compare to a web browser or other native app like Word, etc.?

[…] では、Behavior DesignerとPlayMakerを組み合わせたシステムの例として、UI遷移の制御システムを作成してみます。ゲーム開発に留まらず、一般アプリケーション開発でも頻繁に登場する要件です。Unityでは、UIを構成する個々のコンポーネントはNGUIやuGUIといったシステムが提供しますが、現状では、それら部品で構築した画面間の配線については、遷移を制御する構造を別途用意する必要があります。 […]

I’m still confused on fluidity of the UI across resolutions. I saw him expand the screen manually
( similar to web development in Dreamweaver CS6 ), but I’m hoping and asking if we can still easily scale the canvas and children to the correct resolution? Annnnd… I’d like to see all of the GUI functions that are still in effect. ;) This will be just like waiting for the new COD to come out when I was 10! THANKS UNITY!

I really wish we had a better idea of exactly what time this will be released. If this doesn’t come out until late summer (August), ALL of us kid developers are screwed…

Looks cool! It has already been asked but not answered…
Will it all be available in the FREE version???

Wow, this is going to be so much better! Just wondering though, with GUI now being a part of the scene editor, how do you reference them in code, like making a GUI say a certain variable or setting a button to change something in an actual script.

Wow! Never have I ever said “YES!” so many times when watching a video :)

Exceeded my expectations, can’t wait to get my hands on it!

I understand it is unrelated but it would be cool if the Unity GUI resolved the input field process on mobile devices.

I hate having to deal with input fields on mobiles because it’s never a smooth process and feels very clunky.

When the video finished I had to wipe the drool from my mouth, it looks amazing! Could I ask when this delicious new UI system will be released?

[…] Technologies have demonstrated a new GUI system. The overhaul of Unity’s GUI framework, which was initially promised before the release of […]

Any chance that the beta of this New UI is available now for Unity Consoles (PS4), or will be soon? Thanks!

I’m using 4.6 b7. The video shows a lot of changes compared to b7. My current issues are with small screen sizes on android the buttons are overlapping and when you change disable a Texture or Text via script it turns pink, as in the material has been deleted?. I’ve been using 4.6 for a while so I’ve tried everything for those issues.

Are these issues already fixed?

Thank you

[…] 另外值得一提的是,Unity有关这段视频的博文还特别指出,新UI创建系统将与Unity 4.6一起推出。他们刚刚在本周推出了Unity 4.5,所以除非再次出现延迟,否则新UI创建系统将在Unity 5.0发布前的下一个重大补丁中推出。也就是说,发布日期肯定还像Unity之前所说的,是在“今年夏天”。(译:皓岳) […]

Thanks for your reply, Rune.
I’m really looking forward to get more infos about uGUIs API. :)
Don’t forget us poor programmers, plagued by some crazy UI/game designer’s dreams. :D

I’m aware of the possibility to serialize prefabs in text format, but infos and experiences about
it are so rare to be found that I always considered it to be a bad idea.

Can’t wait for this to come out. This is one of the main problems, in my opinion, with unity. The gui system is currently very difficult to use, and results in badly made games. Looks great!!!

Hm… so no word about scripting…
This really worries me…

NGUI is already a pain when it comes to do some scripting for dynamic UI elements.
Or creating i.e. a complex UI Window just by scripting – what you would want as..
– a collection with many little gameobjects and attached scripts linking to each other tends to get veeery confusing and error prone
– inheritance to create a similar window is near impossible
– collaborative work in a larger team sucks when working with binary prefabs for the UI

I really hope uGUI didn’t inherit this weakness from NGUI where a lot of magic code is hidden
in the inspector, cluttered with flags and inaccessible from outside.

Don’t you dare proposing coders to stick to the old UI system…! ;)

[…] but now with the next version of Unity on the horizon they announced FINALLY an update to the UI system.  It’s very tempting to make the transition, but since it is not out yet and we know how to […]

[…] me a nice base to work with. I don’t know a ton about Unity’s 2D options (although the new GUI stuff coming on in 4.6 looks awesome) but was willing to learn, even though I didn’t get to learn […]

Awesome! I can’t wait to start making actual functional GUI rather then all these GUI Menus and HUD mock-ups i have been making. I hope there is a Progress bar preset, if not, I am sure I will figure out a real easy version of one.

Another thing I am looking forward to is the masking areas of the GUI. That will be handy.

I look forward to using this very soon.

Looks great. Tell us about scrollable text lists (chat boxes) and scrollable panes full of sprites.

Just say one word Awesome.
I am waiting long time to come this type system. Now finally come Unity GUI System.

Amazing Amazing !!!

Can’t wait.

You are releasing 4.6 now — so when will Unity 5 be released?

This looks amazing. Can’t wait to try it.

Can more complex custom controls be created? Say if I wanted a drop list or an interactive table… It looks like the controls are scripts, so theoretically it should be perfectly possible – if they remain scripts with modifiable source code.

[…] worth noting: Unity’s blog post about the video specifically notes that the UI system will ship with Unity 4.6. They just shipped Unity 4.5 this […]

It’s just an awesome UI system especially i like smooth animation transition of UI components. Does it consume more memory then old GUI system in unity ?

[…] ブログ記事には、UIシステムはUnity 4.6にも提供される、とある。今週Unity […]

[…] worth noting: Unity’s blog post about the video[1] specifically notes that the UI system will ship with Unity 4.6. They just shipped Unity 4.5 this […]

I would love to see a command pattern implemented. If we are able to attach our own scripts, it’s not a huge issue, but ootb would be fantastic.

[…] worth noting: Unity’s blog post about the video specifically notes that the UI system will ship with Unity 4.6. They just shipped Unity 4.5 this […]

Looks great, I am glad I have been putting off the time investment of learning DF-GUI or NGUI and working on other things while waiting for this system. I am looking forward to using the new UI system; can’t wait!

@HOREAPER, thanks for the useful info. I can’t believe I miss NoesisGUI, its vector based feature definitely charms me, for now, adding to my wish list, hope NoesisGUI will be discounted soon, my GUI learning path so far: from Unity GUI -> move on to DFUI –> NGUI, right now I’m quite happy with NGUI, but according to the NGUI forum, NGUI is not going to implement Vector Based support, I may move to Noesis GUI this time (one thing about it, Noesis seems to lack learning resources, so I have to spend much more time to look around in order to use it efficiently, XAML language is pretty neat btw.

I am interested in one GUI thing above all else – text/keyboard input. How is it going to be in the new GUI? Is it going to be really basic, or can we expect decent features like free-roaming carets, selections, and copy-paste?

Oh my.. where do I start, where do I start.. First, I love the Canvas methodology and the anchor manipulator is perfect, the integration with 2D is intuitive and the image slicing options were actually a good surprise, I hope you guys extend that functionality to regular 2D sprites it’s overdue now (throw in some tiling while you’re at it and forget 2D until v6).
Depth ordering is plain genius just as are the masks, you only manipulate the hierarchy and the magic takes effect and the history-based hierarchy list (4.5 update) only makes it better.
And now, the GUI components couldn’t be better, from what I inspected in the inspector nothing is missing concerning for example Slider (ther is Whole Number, R to L), Button etc. I just hope you add some exotic controls like a Knob Rotator or Radio Control because I can’t go back to any other 3rd party solution after this.
Last but not least, I’m really thrilled about the action callback, how you dragged a target object in and then just infiltrated through it’s properties and set a dynamic float point to the Slider’s value all in the inspector is amazing. I’m just wondering is there or can we add a custom callback like: Slider Value Reached Max or Slider Value Hit Zero from the inspector or in the API?
Anyway all is shaping up to be a good ending for the Unity GUI saga, thanks for the work done and I hope you continue not leaving anything for the Store.

@BLUED There is one powerful vector UI system called Scaleform, which has a Unity plugin. Scaleform is Flash, and if you prefer XAML, try NoesisGUI

MACMAC mentioned about “a Vector based UI that works on all Resolution (Mobile & Desktop)” this will be super cool feature. I hate to implement SD, HD atlas, also have to check for every Resolutions. Sometime, I have to build a Screen for iPad and a different Screen for iPhone, also for Android mobiles, which have variety of resolutions, which is impossible/very time-consuming to make it right. Vector UI system would save the day!!! Unity can you think about it?

This looks like a very powerful tool to create UI.

One thing I can’t understand is the drawing order. You compared it to layers in Photoshop, but in Unity it’s actually the other way around. In Photoshop layers on top are drawn on top, in Unity elements above in the hierarchy are drawn beneath other elements.

I do understand the technical reason behind that, but it will definitely cause lots of confusion when artists have to create UI.

Fantastic guys!

I must admit I was a little apprehensive as to how this would turn out, but it looks like you’ve gotten the nicer concepts from NGUI and really thought about how to build on those. It looks well worth the wait.

I have to say although this looks like NGUI on the first glance, it is easier to understand and use, especially the anchors!

With regards tot he buttons, is it possible to call custom functions on classes NOT derived from MonoBehaviour?

Will we be able to dictate the rendering depth of the UI? Ie. will it be possible to have the render queue set to overlay so that all UI elements for a canvas appear on top of everything else in world space without a separate camera? That is something we currently use heavily with NGUI. Thanks!

I’d love to see some proper generic binding components in addition to the delgates in button for example.
See DFGUI’s binding for a complete example (NGUI has a simpler one).
Make sure all the GUI components fire off C# events so we can set it up using observer patterns. The binding stuff is great not just with GUI, but everything.

Is there a public static property to check to know when the cursor is over a UI component so we can filter game input to ignore clicks when it hovers over certain controls or do we have to raycast every time? For that matter, will raycasts detect UI components?

boring… after such a time…
showed off in A’dam @ Unite…
since then no really Progress….
Well the problem is:
So there are so many great UI Solutions in the Store that work very well…
But what we really need is a Vector based UI that works on all Resolution (Mobile & Desktop)

I’m Disappointed…. because there is nooooo need for a UI System because there are the same in the Store with more features and better!


WE NEED VECTOR UI SYSTEM that works @ any Resolution.

Excellent work, keep it guys… Everything is beyond the expectation and make easy work with games.

Looks great, I can see the NGUI in it;-)

A couple of observations/questions.

1. Depth sorting: If it’s based on visual hierarchy a la photoshop how do you create the right depth order for a gui that is created programmatically? It seems impossible?

2. Included UI Controls: Please ship V1 with a full set of commonly used UI controls for both mobile and desktop use. This stuff is pretty much standard now (draggable panels with slider, popup lists, scrollers etc) and just shipping a couple of basic controls and then relying on Asset Store developers to fill the gap does not cut it. Especially after such a long wait.

3. More information about creating multi-resolution auto scaling UI’s please. This is turning into a huge development pain point and time sink and Unity should be empowering developer workflow in this area, especially given the number of screen sizes and platforms for deploying onto.


The workflow looks very similar to NGUI, I wish Unity New UI will be much simpler or even more efficient than NGUI. NGUI scripting is kind a trick, I hope Unity UI scripting will be easier to code, richer resources, tutorials to learn it fast. Actually, I want it now, waiting for the final UI system is for so long!!!

What about the DC? As in the beta, one component need one DC which is not allowed for mobile device even for PC.

I can’t believe my eyes! You guys redefined 2D tools not only in game making, in general!

Finally a usefull UI implementation! Really nice, but hey.. what the hell is wrong with the background music of the tutorial? Haha, are you trying to sell a life insurance or whut? :)

Looks great. Two questions. 1. Does the Unity 2D sprite system allow for selection of different art assets based on device / screen resolution (e.g. iOS retina vs. non-retina assets)? 2. In the last example (the exit button). Is there a way to control the size of the exit button based on device / screen resolution?

looks awesome,
is it all included in free version or partially?

keep up the great work!

@Matt: Atlasing is handled at asset import time. You provide an image and import it as a sprite. If it’s already an atlas, you use the Sprite Editor to get the individual sprites as sub-assets. If you have a bunch of loose sprites, you give them Packing Tags and we will build an atlas using the Sprite Packer.

This has the potential to replace NGUI at our studio, it is looking good. I hope that the script apis are quite robust and not the black box that Shuriken can often be.

This amazing. In regards to scripting certain components, does that mean we have the possibility of creating dynamic animations of UI components similar to Facebook Pop animation ui animation engine?

Thanks. I looks like this uGUI solves what I don’t like about old Unity GUI both via scripting and using objects in the hierarchy.

I really look forward to the day when we will get the new UI to play with.. this looks way easier than i once saw NGUI at, though i am more experienced with programming today than back then.. then i must admit this looks like a piece of cake… (i hate cake but this one looks tempting to eat ;D) Cheers Rune and keep up the very good work!!!

Rune: Thanks, that’s super exciting. I’ve got two more questions actually. I didn’t notice any atlasing happening within the video, is that handled internally, or is it not even necessary unless I were to override materials for specific buttons? Also, I didn’t see anywhere to assign different textures per button state. I can’t imagine that not being supported, I’m just wondering if that’s handled through animations or not.

Thanks for the response though, this is amazing! :)

Can’t wait for it. Think of all the possibilities! Diegetic GUIs were never that easy to make! Friggin hell I’m SO excited!

Before I begin watching the video..
Has this day finaly come!? Really? I watch the video :P

How many drawcalls does this new GUI system use? For example, if I got all my graphics from a single texture, does it have only 1 drawcall or does every GUI element have it’s own drawcall? Because this is something that anoyes me with the current GUI system.

Everything looks fantastic, I do have a question though. I’ve been using EZGUI for quite some time and one feature I really appreciate is the ability to color individual portions of a single text object. Separating out pieces of text to color individually makes animating, sizing, etc impossible. I’d love to be able to put a hex tag in the middle of the text that allows parsing for color…ie “This is my text, and [#FF0000] this part is red[#FFFFFF].”

I bought NGUI a long while ago and the begining bit of the video deffo looks almost like he is using NGUI.

This is going to make alot of difference to alot of developers and you don’t need me to tell you that this is so long overdue. :)

It Looks great.

Wow this has left me chomping at the bit for the new UI system. Are the Unity quality settings exposed to this UI system? So that it’s easy to create in-game settings options?

Is it possible to make a transition of object from Screen space – Camera to World space? That is gui object leaves gui and enters world space without any special calculations?

@Rune I mean by choosing the draw order for each object individually.

In this example (, the orange image is parented to Button2. Assume Button2 has to be lower than Button1 in the hierarchy for some reason, how do we get the orange image to appear on top of Button1?

You guys stop killing us with your awesomeness and tell me WHEN IT IS GOING TO RELEASE so that i can postpone the work of upcoming 2d game.
Unity rocks, no other game engine even software developer don’t have that much capability to release 2 best releases in a same year i.e. unity 4.3 and now 4.6.
And if possible kindly add a feature to your unity 4.6 i.e. layer/tag based 2D collision for a gameobject. :)
… and sorry if there is some bad english.

Impressive work.
Being a programmer, I of course expect an extensive scripting API :3

How does draw order work? Is there a manual number or are we stuck with the Photoshop-style layers, and won’t this mean we can’t position gameobjects where we want?

The new GUI system looks great, I’m so exited about it. Now, can i put meshes inside the canvas?, and if so, can i mask these meshes with the mask component?.

And a little off topic, will you guys add events (delegates) to the MonoBehaviour class?. Would be great if we can have the Start, Awake, OnTriggerEnter, OnDestroy, etc., as events (delagates) instead of functions to be added to a class.

You guys are doing a really good job. Keep it up.

… and sorry if there is some bad english. ;)

Congratulations for this great new module!
I am thinking of start a part of my project only after it is released.

@Will: The new Unity GUI system has come a very long way since ArenMook had worked on it (IIRC, he left UT about half a year or so ago). So I wouldn’t expect the two to be particularly close to each other.

Unity’s new GUI system looks über-awesome IMHO and it’ll be quite a milestone for Unity when 4.6 is released!

Although dragging methods in the inspector is nice, i find that when building larger projects its difficult to keep overview.

Is it possible to just listen to the events from script? Does the component also send a message, like NGUI does for certain events?

It already looks great, cant wait to use it!

Fantastic job! It looks like it has been well worth the wait. Can’t wait to start using this!

I assume it will work similar to NGUI and will handle clicks and touch inputs the same. I believe ArenMook (NGUI Creator) worked on this. If that is true then I would be very surprised if dragable panels were not included.

at last…
Nice workflow & layout.
The new components looks great too.
Integrating UI and animation become easier now.

Maybe some open beta but with bug reports submission still only for official beta testers? :)

Hi Corey, we’ll be talking about these things over the next few weeks, we have some more technical posts planned.

Looks great. Very easy to use. When will you guys be able to discuss memory/performance metrics, particularly targeting mobile platforms?

With regards to buttons, is it possible to call methods of our own, if so how is that handled?

This is going to be the real flash killer :)
I am interested in two things:
1. What about a scroll area? Or scrollable lists?
2. And for mobile dev: How do you handle touch inputs?

Keep it up!

This is so awesome…far beyond the expectations. The wait was totally worth it.

Comments are closed.