Create a Modern Preloader - JavaScript, Vite & GSAP (Part 1 of 2)
http://bit.ly/3YeXzeU 👈 Learn UI/UX & CSS Today. Use "UI2023" for 23% Off!
https://designcourse.com/af 👈 My upcoming "Advanced Frontends" Course
-- Today, we're embarking on a 2 part series where I show you how to create a modern preloader for websites and apps. Today, we'll focus on using Figma to create a unique and relevant loading illustration (for my wife's lactation consulting business!). We'll utilize an SVG filter that creates a cool GOO effect. We'll also get it up and running with HTML and CSS. In the next tutorial, which releases in 2 days, I'll show you how to get it functioning with greensock (GSAP) along with Vite.js and ImagesLoaded.js.
Codepen demo for this project:
https://codepen.io/designcourse/pen/d...
0:00 - Intro
0:52 - SVG Illustration in Figma
4:30 - Installing Vite.js
6:40 - Installing Sass
8:29 - Writing HTML
13:19 - Writing the CSS
18:40 - Final result
Let's get started!
#frontend #uiux #figma
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
Learn UI/UX: https://designcourse.com
My personal FB account: http://fb.com/logodesigner
Coursetro FB: http://fb.com/coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi!
Watch video Create a Modern Preloader - JavaScript, Vite & GSAP (Part 1 of 2) online without registration, duration hours minute second in high quality. This video was added by user DesignCourse 14 February 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 30,537 once and liked it 915 people.