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!
Смотрите видео Create a Modern Preloader - JavaScript, Vite & GSAP (Part 1 of 2) онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь DesignCourse 14 Февраль 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 30,537 раз и оно понравилось 915 людям.