From the course: Prototyping Microinteractions with Adobe Animate
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Ripple effect - Adobe Animate Tutorial
From the course: Prototyping Microinteractions with Adobe Animate
Ripple effect
- [Narrator] Common to Google's material design specifications, this effect is clean and direct. Drawing the users eye to solidify their intention. When interacting with some element within a design. Let's see how to accomplish this in Animate with a bit of masking. So I have this empty layer in my starter file called a button. This is where we're going to do our initial drawing and for that we'll use the rectangle tool and if you look down here, there's actually a way to change the corner radius of your rectangle. We're going to change the corner radius of all four corners, to a value of four. I'm going to have no stroke and a light blue color for my fill. From there we just click and drag to create what is effectively a button. With this button background created, let's go ahead and use the selection tool to select it. And then we'll choose modify, convert to symbol. This will be a graphic symbol. And we can name it UI_ripple. Okay. So now we have an instance of that graphic symbol…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.