Vigyata.AI
Is this your channel?

DOTween UI Button Slide & Fade Tutorial | Smooth UI Transitions in Unity (Part 10)

3.5K views· 38 likes· 2:49· Jul 27, 2025

Welcome to Part 10 of our DOTween UI Animation series! In this final video, we’ll combine DOFade and anchoredPosition animations to create smooth sliding button transitions with fade effects — perfect for menus, settings panels, and interactive UI. 🚀 What you'll learn: How to animate UI buttons with DOTween’s DOFade Sliding UI elements in and out with anchoredPosition Combining fade and movement for polished menu transitions Button testing and animation tips 🎓 Whether you're building a pause menu, a popup, or a settings screen, these techniques will help you craft clean, elegant UI motions using DOTween in Unity. 🔔 Don’t forget to like, comment, and subscribe for more Unity tutorials! 00:00 Intro 00:10 Slide Button Code 01:50 Testing slide 01:58 Fade Button Animations 02:31 Testing fade #unity #dotween #gamedev #unitytutorial

About This Video

In Part 10 of my DOTween UI Animation series, I wrap everything up by combining two of my favorite UI moves: sliding and fading. I show you how I animate UI buttons using DOTween’s DOAnchorPos so they glide in from offscreen into their final layout positions. Because UI uses RectTransform (not regular transforms), I focus on anchoredPosition and a clean setup: store each button’s target position, shove them off to the left at start, then tween them back with a nice Ease.OutBack for that polished “pop” at the end. To make the menu feel more dynamic (without being annoying), I add a small increasing delay per button. That staggered entrance guides the player’s eye naturally from one option to the next, and it’s super easy to tweak the duration, easing, and delay to match your style. After that, I move into fading with DOTween’s DOFade using a CanvasGroup, which is the simplest way to control opacity for an entire UI group (buttons, images, text—everything). By animating the CanvasGroup alpha from 0 to 1 (or back), you get smooth fade transitions that pair perfectly with the slide for menus, settings panels, popups, and more.

Frequently Asked Questions

🎬 More from Casayona Code