In this episode, we’ll add a simple fade effect when switching scenes. We’ll create a fullscreen fade, animate it and use it to smooth the scene change.
By the end of this episode, your scene transitions will look clean and smooth.

Part of the *Master Unity UI* course on Coco Code Learn. Chapter 9: Create medieval UI

Scene transitions

Learn Unity UI from basics to pro! Create polished interfaces with buttons, animations, responsive design & more. Perfect for building advanced game UIs.

Master Unity UI

Introduction

Get the most out of this course

Shortcuts and techniques to speed up UI building

Happy little scene (Get started)

What is Canvas?

Add text!

Add images

Setup button and connect to script

Create pause screen

Show/hide UI elements

Full screen overlay

Test your knowledge [Quiz]

Unity Adventure Menu (Responsive UI)

Align menu options

Virtual currencies

Introduction to Anchors

Add background

Scaling types

Credits screen

Level selection grid

Sign In simulator (Form)

Introduction to Input Fields

Read your Input Fields

Create big text boxes

Check player age with slider

Assign default field

Navigate UI using arrow keys

Switch fields using TAB key

[BONUS] Create start scene

[Advanced] Better Input multiline support

Alien Factory (Character selection)

Make characters selectable

Spawn UI elements via script

Add scrolling logic

Scrolling UX tweaks

Create scrollbar

Color selection dropdown

Place helmet correctly

Toggle helmet visibility

[Advanced] Add color picker

[Advanced] Add scroll to top

Wiggle Widgets (Animations)

Script vs animator

Install LeanTween, first animation

Annoying button

Animate simple popup

Animate screen overlay

Animate HP bar changes

Get started with animation clips

Animation clips transitions

Animate buttons using animator

Create rounded corners

Complex animation sequence

[Bonus] Animate clock

[Advanced] Animation scripted sequence

Cursed Cartography (Map interface)

Generate map, prepare graphics

Create map display UI

Add custom fonts

Better map display borders

Show tooltip on hover

Make tooltip more visible

Create your own pointers

Line rendering

Map filters

Map art styles

[Bonus] Show/hide filters

ShroomCraft

Seek inspiration for your UI

Design inventory in Figma

Inventory script, scriptable objects

Display items in inventory

Split items into tabs

Show item details in tooltips

Make tooltip avoid screen edges

Organize items using drag and drop

Player equipment and stats

Define crafting recipes

Add crafting system

Crafting system particles

[BONUS] Create UI

The Final UI Boss [🧨 NEW!]

Create bottom bar

Add spells cooldown

Orb shaders (shader graph + UI)

Character info in the corner

Dynamic portraits

Quests list (UI building)

[Advanced] Quests lists (coding)

Dialogue with text animations

[Advanced] Transitions with intermediate scene

Add HP bars in worldspace

Epilogue

Get your certificate!