Skeleton UI Animation Tutorial [After Effects + Lottie]

Subscribe: http://bit.ly/IsionIndustriesYT

During a users experience while using an app or website often times they will come across periods of time where something has to load. During these periods of waiting it’s important to keep your users informed of what is happening. There are techniques to improve these “waiting” periods by using loading animations which helps keep users attention focused on their flow.

Often times most loaders only communicate that something is happening but they don’t indicate as to what exactly is loading. Smart Skeleton UI loaders utilize the function of a loading spinner but provide the extra benefit of displaying what type of content the user will see once everything has loaded.

Skeleton states are a configuration of placeholders of the content that is populating the screen. In this tutorial I break down two methods on how to design Skeleton loading animations in After Effects and how to render them as Lottie JSON files.

Music by: Sono Sanctus
Title: Nocturnal Upload

Check out my work on:
LottieFiles: http://bit.ly/IsionIndustriesLottiefiles
Instagram: @isionindustries
Behance: http://bit.ly/IsionIndustriesBehance
Dribbble - http://bit.ly/IsionIndustriesDribbble
Vimeo: http://bit.ly/IsionIndustriesVimeo

#LottieAnimation #AfterEffects #UIanimation #SkeletonUIanimation #LottieFiles #loadinganimation #AfterEffectsTutorial #UXMotion #MotionGraphics #UIskeletonstate #lottieanimator #MotionDesign #LottieJSON #LottieAnimationTutorial
Web design
Be the first to comment