The document discusses a new UI system for Unity's editor aimed at simplifying editor code creation. Key features include flexible layouts using flexbox, CSS-based styling, extensible C# event handling, and a data-driven hierarchy approach. The roadmap outlines an experimental release in 2018.3, public release in 2019.1, and ongoing improvements thereafter.

1. GenerativeArt–MadewithUnity
UI ElementsA new UI system for the Editor
Benoit Dupuis
Product Manager, Unity
benoitd@unity3d.com
Damian Campeanu
Editor Developer, Unity
damian@unity3d.com
1

2. Problem
Writing editor code now is
strenuous
2

3. Problem
● Advanced layouts have to be manually calculated
● Simple styling can be surprisingly difficult
● Event handling is rigid and non-extensible
● Impossible to separate functionality from layout from styling
● Overall slow to iterate on complex UI
3

4. UI Elements
Solution
4

5. ● Flexible layouts via full Flexbox specification implementation
● Styling via strict subset of CSS standard
● Extensible C# event handling inspired by the W3C event model
● Data driven declaration of hierarchy via XML, layout and styling via CSS
● Changes to XML and CSS do not require compilation
UI Elements
5

6. Demo
6
Turret assets by: Slava Z.
● Sci-Fi Turret Constructor
● Fantasy Robot Game Pack

7. Demo Summary
● Flexible layouts
● Familiar styling via CSS
● Extensible C# events
● Data driven hierarchy and styling
● Fast iterations
● Easy to migrate
● Easy to debug
7

8. Roadmap
● 2018.3 - Experimental
● 2019.1 - Public Release
● 2019.2+
○ General Improvements
○ Support for Runtime preview
○ Visual UI Editor preview
Visit the UI Systems Previews forums!
8

9. GenerativeArt–MadewithUnity
Thank you!
9