unity ui deep dive - charlie helman
TRANSCRIPT
UNITY UIA DEEP DIVE INTO
A DEEP DIVE INTO UNITY UI - THE GIST OF IT
WHAT WILL WE COVER?▸ Quick overview of the other UI frameworks out there.▸ Demo of the UnityUI workflow.▸ Must-Have Add-ons/Assets for UI Development▸ Architecture; keeping things modular and
maintainable▸ (Stretch) Anchoring: Strategies for dealing with
multiple resolutions and aspect ratios across platforms.
PICK YOUR POISON
A DEEP DIVE INTO UNITY UI - PICK YOUR POISON
NGUI ▸ “Industry Standard” in Unity for
a long time.
▸ WYSIWYG, separate from Unity’s 2D pipeline.
▸ Hope you like Atlases. Features custom Atlas packers for fonts and sprites.
▸ Bitmap fonts for text recommended. Lackluster dynamic font support.
A DEEP DIVE INTO UNITY UI - PICK YOUR POISON
UNITY UI (FORMERLY CALLED UGUI)▸ The official Unity UI Solution.
▸ Adapted from and well-integrated with Unity's 2D tools. Also WYSIWYG.
▸ Dynamic Batching (no Atlases to manage).
▸ Dynamic Fonts only.
A DEEP DIVE INTO UNITY UI - PICK YOUR POISON
SCALEFORM▸ Probably the most commonly
used UI framework in games (outside Unity).
▸ A more expensive but fully featured, flash-based UI framework. Probably still has a UnitySDK.
▸ Authored outside of Unity.
▸ Action script.
▸ Vector graphics.
A DEEP DIVE INTO UNITY UI - PICK YOUR POISON
COHERENT UI▸ HTML/CSS/Javascript, authored
outside Unity.
▸ Costly but jam-packed with features.
SO, WHY USE UNITY UI?
A DEEP DIVE INTO UNITY UI - PICK YOUR POISON
SO, WHY USE UNITY UI OVER OTHER FRAMEWORKS?▸ Free. Open Source.▸ Official solution. Not just a one-man-show, not just an
after-thought integration by a 3rd party.▸ Better editor integration. Editing and iterating inside
Unity is a simpler, faster, and often more approachable workflow than editing externally.
▸ Better compatibility with Editor Extensions / Asset Store Add-ons.
LET’S BUILD SOMETHING…
TEXT MESH PROESSENTIAL ADD-ON #1
SO NOW THAT WE’VE COVERED THE BASICS…
ARCHITECTURE AND
MAINTAINABILITY
A DEEP DIVE INTO UNITY UI - ARCHITECTURE AND MAINTAINABILITY
SYMPTOMS OF BAD ARCHITECTURE▸ Fragility/Brittleness: hard to
change things; doing so breaks other things.
▸ WETness: Many similar things are implemented different ways.
▸ Lack of tests. Hard to write tests, or tests are fragile.
▸ Code smell. Prefab Smell. Scene Smell. Your project smells.
LET’S BUILD SMARTER.
PREFAB EVOLUTIONESSENTIAL ADD-ON #2
A DEEP DIVE INTO UNITY UI - ARCHITECTURE AND MAINTAINABILITY
UI PREFAB MANAGEMENT IS KEY▸ UI “elements” work best as
prefabs. But, whole UI views should be prefabs as well. Hard to have both without getting fancy
▸ Prefab nesting allows you to properly keep track of “prefabs inside other prefabs”
▸ Prefab inheritance to better encapsulate prefabs and control how changes propagate to related elements
A DEEP DIVE INTO UNITY UI - ARCHITECTURE AND MAINTAINABILITY
CONSIDER STANDARDS AND PATTERNS▸ MVC provides a scalable way to
separate data and logic (model), input handling (controller), and the presentation of the UI elements (view).
▸ IoC (Inversion of Control) is a better way to manage dependencies for your UI. Check out StrangeIoC.
A DEEP DIVE INTO UNITY UI - THAT’S ALL FOLKS
THANKS!▸ Feel free to e-mail me:
▸ Or follow me on Twitter. @charliehelman