From the course: Principle for UX Design (2019)

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Create a preloader animation

Create a preloader animation - Principle Tutorial

From the course: Principle for UX Design (2019)

Start my 1-month free trial

Create a preloader animation

“

- [Instructor] A common design pattern is a preloader or things that spin showing content loading and in this exercise, we are going And when it opens, head over to the insert pop down, and we're going to change its stroke to 20, and we're done. So with the circle selected, So we just come up here, create component, Now, just a quick note here: on the screen, just so we can see what we're doing. is have a little progress area and we'll just take it out like that, and we'll change it to green as the fill color, so we've got a bit of a mask in there. Now I'm going to pull the top border of the mask down, of the black stroke and obviously, a square mask of the black stroke and obviously, a square mask over a round object is a bit odd. Let's select the mask and just round it off a bit. Let's select the mask and just round it off a bit. You're not going to see much here, but it does tend to round things off. to round things off. Now we're also going to have to trim off the…

Contents