Flux Academy
Flux Academy
  • 1 839
  • 52 999 000
Creative Figma animations
Bored of ultra simple animations and want to take your prototyping game up a notch in Figma? Follow along with me as we create four awesome animations together.
Download the Figma file 👉 www.figma.com/community/file/1374821357960240668
🎓 LEARN Figma for web designers. Master Figma the right way with hands-on experience and 1:1 mentor feedback. Enroll in our course here 👉 bit.ly/3KaoByM
CHAPTERS
0:00 Intro
0:35 Line Animation
5:20 Card Swiping
12:38 Text Slider
17:37 Headline Switching
📱 Find us on SOCIAL MEDIA
Maddy’s CZcams channel 👉 @MaddyBeard
Flux Academy's Instagram 👉 flux.academy
Flux Academy's X (Twitter) 👉 FluxAcademyHQ
zhlédnutí: 6 777

Video

Learn Webflow in 2024 (Beginner Crash Course)
zhlédnutí 14KPřed 23 hodinami
Now is the time for you to learn Webflow. In this video we will build a website together and I’ll be covering the key concepts you need to get started. Download the working files to follow along 👉 www.dropbox.com/scl/fo/vgpd50kpihv2dum2x0u8i/AHznm0YNsYbD1gv4FYsd9Es?rlkey=aysvsqarbqggcnqy6bs5gqlhc&dl=0 Discover the fastest, right way to learn Webflow-our full Webflow Masterclass course 👉 bit.ly/...
Framer 3D Transforms
zhlédnutí 3,2KPřed dnem
How to create 3D animations using Framer’s new 3D tools. Demo 👉 runwithfriends.framer.website/ Download the assets and follow along 👉 bit.ly/4dJDEN8 CHAPTERS 0:00 Thoughts on 3D in web design 1:31 Walkthrough 3D properties 7:09 Create animation Learn to design jaw-dropping websites with ease on our Framer Masterclass 👉 bit.ly/3QOwqh3 📱 Find us on SOCIAL MEDIA Matt Jumper’s CZcams channel 👉 @mat...
10 ways to add depth to your web design
zhlédnutí 11KPřed 14 dny
If you want to add visual interest to lifeless layouts, try adding depth. Here’s 28 (!) live website examples to demonstrate ten different techniques that you can use to give the perception of depth on a flat screen. Learn to create beautiful designs with our Core Design Skills course 👉 bit.ly/4aq6e3f CHAPTERS 0:00 Intro 0:19 Flat layers 1:36 Shadows 3:34 Transparency 4:57 Blend modes 6:30 Blur...
Advanced responsive website in Figma
zhlédnutí 6KPřed 14 dny
In this tutorial, Maddy demonstrates how to design a beautiful, responsive website in Figma. Download the starter file and follow along 👉 bit.ly/3yfsoIn CHAPTERS 0:00 Intro 0:45 Desktop version 28:49 Scrolling animation 30:30 Tablet version 35:45 Mobile version Learn Figma for Web Design 👉 bit.ly/4dwIddP 📱 Find us on SOCIAL MEDIA Maddy’s CZcams channel 👉 @MaddyBeard Flux Academy's Instagram 👉 i...
Copy these 21 Hero Section Designs
zhlédnutí 32KPřed 21 dnem
The hero section is the most important part to get right because it’s the first thing people see on your website, before they start to scroll. With these examples from real websites, Matt shows us why these layouts are successful and gives us some new ideas to try out. 🤩 FREE Resources Improve on any composition with this free handbook. Download the Principles of Layout here 👉 bit.ly/3wgvZp0 En...
Auto Layout for Beginners (crash course)
zhlédnutí 8KPřed 21 dnem
If you’re not using auto-layout in Figma, you’re missing out on a huge time saver! The good news is, auto-layout is actually very simple and intuitive once you wrap your head around it. This crash course with Maddy shows you everything you need to start making the most of this feature. 🎓 LEARN Figma for web designers. Master Figma the right way with hands-on experience and 1:1 mentor feedback. ...
5 Amazing Framer Websites For Inspiration
zhlédnutí 8KPřed 28 dny
Your ability to tell good design from bad, and continually elevate your standards, is what will separate you as a web designer. So join Matt for this walkthrough of five beautifully designed websites, all built in Framer. Want to learn to build websites like these? Join The Framer Masterclass 👉 bit.ly/49XGcV1 CHAPTERS 0:00 Intro 0:17 Oleg Masnyy 2:21 i-D 3:52 Lóvi AI 6:32 Slides Agency 9:59 Bro...
Web Design with Relume AI & Webflow - Full Course
zhlédnutí 29KPřed měsícem
In this course we’re going to be building a fun website for a Sneaker Museum! I’m going to show you exactly how I think and work, so that you can not only improve the quality of your web designs but also increase your efficiency and get the work done faster. CHAPTERS 0:00 Intro 1:18 Turn brief to moodboard 9:45 Create wireframes with Relume 23:40 Design the website in Figma 46:43 Build in Webfl...
Easy animations with Lottie
zhlédnutí 4,4KPřed měsícem
Animation can elevate a website from uninspiring to delightful, but motion design has traditionally been complex, time-consuming, and produced huge files that increase load times. So in this video, Matt gives you a crash course in Lottie Files and Lottie Creator. Tools which not only radically simplify the process of editing or creating vector animations but also make it easy to incorporate the...
Don't make these rookie mistakes in Framer
zhlédnutí 6KPřed měsícem
Watch out for these common mistakes that many beginners make when building responsive websites in Framer. Framer makes it possible for you to build jaw-dropping websites fast! The Framer Masterclass will teach you how. Enroll here 👉 bit.ly/3vYuUBX CHAPTERS 0:00 Overview of mistakes 2:36 Using frames with absolute positioning 8:21 Fixed sizing 14:15 Neglecting the page structure 19:14 How breakp...
I built a portfolio in 1-hour, 10-hours, 100-hours! (Using Webflow)
zhlédnutí 51KPřed měsícem
I built a portfolio in 1-hour, 10-hours, 100-hours! (Using Webflow)
The only 6 fonts web designers need (and they’re free!)
zhlédnutí 18KPřed měsícem
The only 6 fonts web designers need (and they’re free!)
1-to-1 Portfolio Website Review (Office Hours sneak peek)
zhlédnutí 4,7KPřed měsícem
1-to-1 Portfolio Website Review (Office Hours sneak peek)
Multi-editing in Figma
zhlédnutí 4,3KPřed měsícem
Multi-editing in Figma
5 Must Have Ai Tools for Designers in 2024
zhlédnutí 40KPřed měsícem
5 Must Have Ai Tools for Designers in 2024
How to create a sitemap (for any website) in 2024
zhlédnutí 14KPřed 2 měsíci
How to create a sitemap (for any website) in 2024
Vertical, Sticky, and Horizontal Scrolling in Figma
zhlédnutí 11KPřed 2 měsíci
Vertical, Sticky, and Horizontal Scrolling in Figma
Learn Framer in 38 minutes! (Crash Course)
zhlédnutí 16KPřed 2 měsíci
Learn Framer in 38 minutes! (Crash Course)
Re-designing Coca-Cola's Website in Figma
zhlédnutí 10KPřed 2 měsíci
Re-designing Coca-Cola's Website in Figma
Why he switched to Framer from Webflow
zhlédnutí 16KPřed 2 měsíci
Why he switched to Framer from Webflow
How to build an award-winning Webflow agency (w/ Nkenna Amadi)
zhlédnutí 5KPřed 2 měsíci
How to build an award-winning Webflow agency (w/ Nkenna Amadi)
My Figma to Framer Process
zhlédnutí 27KPřed 2 měsíci
My Figma to Framer Process
Amateur vs Pro Website Design (with examples)
zhlédnutí 12KPřed 2 měsíci
Amateur vs Pro Website Design (with examples)
Using Webflow AND Framer to build a successful agency
zhlédnutí 22KPřed 2 měsíci
Using Webflow AND Framer to build a successful agency
Why these websites won awards
zhlédnutí 12KPřed 3 měsíci
Why these websites won awards
Is your website accessible? (Beginners Guide)
zhlédnutí 6KPřed 3 měsíci
Is your website accessible? (Beginners Guide)
Figma Tutorial for Beginners (2024): Website Design
zhlédnutí 61KPřed 3 měsíci
Figma Tutorial for Beginners (2024): Website Design
#17 - Ran Segall on luck, motivation, and what’s next (interviewed by Kaleb Jae)
zhlédnutí 1,3KPřed 3 měsíci
#17 - Ran Segall on luck, motivation, and what’s next (interviewed by Kaleb Jae)
Learn Web Design For Beginners - Full Course (2024)
zhlédnutí 1,1MPřed 3 měsíci
Learn Web Design For Beginners - Full Course (2024)

Komentáře

  • @tylermiller7735
    @tylermiller7735 Před 9 hodinami

    Love the new design! It feels so much more visually consistent then the previous iteration of the site. I'd love to see a tutorial producing those badges used for the courses. Those graphics paired with the background pattern are probably my favorite part of the site!

  • @godus_payne
    @godus_payne Před 9 hodinami

    What is this photoshop? 1:32:07

  • @rijaslyan6376
    @rijaslyan6376 Před 10 hodinami

    Flux Academy is my favorite CZcams channel it's really helps me to learn something new always thanks a lot 😍😍😍

  • @krishgupta7179
    @krishgupta7179 Před 10 hodinami

    06:50

  • @rastkoDev
    @rastkoDev Před 11 hodinami

    Will code for food.

  • @007khowlage
    @007khowlage Před 12 hodinami

    Is it possible we make animation I'm figma and then put it in WordPress website

  • @LavinaGoyalDigitalMarketing
    @LavinaGoyalDigitalMarketing Před 12 hodinami

    excellent

  • @LeeJayRobertson
    @LeeJayRobertson Před 13 hodinami

    Congrats to the whole team!! 💜

  • @ianskeldon6032
    @ianskeldon6032 Před 14 hodinami

    A really useful video mate. I have been asked to improve a current web site that is really struggling in terms of it's design and layout. This video has helped me so much. What is the software that you used to demonstrate the 12 column layout?

  • @techwake360
    @techwake360 Před 18 hodinami

    In One Word its Awesome

  • @dccd673
    @dccd673 Před 18 hodinami

    I wish you had placed the timer elsewhere, like the bottom left.

  • @emarshatai
    @emarshatai Před 19 hodinami

    thank you this was sooo helpful 😄

    • @FluxAcademy
      @FluxAcademy Před 15 hodinami

      Glad it was helpful! We have more videos on color too 😉

  • @user-11DiACasti88
    @user-11DiACasti88 Před 19 hodinami

    i am here 1:36:55

  • @joaquinmotor
    @joaquinmotor Před 23 hodinami

    sick as dude. ty

  • @Totallysamsays
    @Totallysamsays Před dnem

    Wow! This was a really bad video. Am not a expert web designer/builder, but the things you were "trying" to do were common thing you actually can do in Canva. This whole video is a smear campaign against Canva which is a great site full of amazing tools. Videos like this doesn't make me want to subscribe to your channel. It makes me stay away from it. Do better reach before putting all that work to create a video of lies. #Shameonyou

  • @abstractdesignagency7893

    The take away is : Easy on the Webflow animations and JS guys, not because there are free and accessible that you should use them all at once. So basically stick with what it works and not getting crazy creative. I personally never been a fan of unique portfolios and seems like the recruiters neither, either it turns out confusing or childish. So let's just stick to showing our work in a consistent and clear way.

  • @einatblackrose
    @einatblackrose Před dnem

    Ran, the new website is AMAZING!!! It looks beautiful and the ux is great. A little side note (and sorry if it sounds too corny...) - I happened to notice that when navigating with the keyboard, the links with dropdown don't receive any visual interaction on focus at all. Plus, I think it looks and feels more custom and intentional when the focus-visible state is similar to the hover state, or the outline matches the overall design. Just my personal opinion.

    • @FluxAcademy
      @FluxAcademy Před 15 hodinami

      Thanks for the kind words and the notes.

  • @agustinagonzalezweb

    Thank you sooooo much !!!

  • @willbaltazar7043
    @willbaltazar7043 Před dnem

    Super useful and relatively short tutorial! Thank you for explaining this!

  • @pikpens
    @pikpens Před dnem

    Amazing job on the redesign.

  • @sheepman-qw6fb
    @sheepman-qw6fb Před dnem

    which custom video player are you using?

  • @sheepman-qw6fb
    @sheepman-qw6fb Před dnem

    the global organisation of animations is awesome, any chance to get that as a cloneable?

  • @SANDEBRO
    @SANDEBRO Před dnem

    All of the websites was good but 100 hour is best one I really loved it thanks for giving us free education ❤❤❤

  • @shanny104
    @shanny104 Před dnem

    really love your new design, hats-off to all the team, from the designers to the developers

  • @HastarOTW
    @HastarOTW Před dnem

    How can I make this responsive and publish on web?

  • @readthetype
    @readthetype Před dnem

    Pretty sure you’re more interested in attention than design. For example, where are the CVs for your “faculty”?

  • @ryanlo3775
    @ryanlo3775 Před dnem

    Please do more video like this!!

    • @FluxAcademy
      @FluxAcademy Před dnem

      Thanks for the feedback, glad you enjoyed!

  • @SyedMuneebAli
    @SyedMuneebAli Před dnem

    I am a Visual Designer, I want basic stuff about development but this really helped me understanding the structure and design. Love it!

  • @Arejeee
    @Arejeee Před dnem

    very good and complete guide, watched it in one breath and it felt like 5 minutes. thanks very much!!

  • @DominMarfa
    @DominMarfa Před dnem

    Great1 Thank you so much

  • @EphremDagne
    @EphremDagne Před dnem

    Talks coming from Flux Academy are really from practical demonstrations that equip me with easier grasp and digest than theory talk. It is awesome.

  • @user-sh1lw8qo2b
    @user-sh1lw8qo2b Před dnem

    Good

  • @zankarpanchani9886

    Computer knowledge

  • @zankarpanchani9886

    Hey sir . With no computer Will this video make me web designing and will b helpful in earning ? I hv to prepare linkdin right ?

  • @ameliagoodson7400
    @ameliagoodson7400 Před 2 dny

    I don't think I've ever commented on a CZcams video but I just wanted to say thank you for this content! I'm a web developer restructuring my portfolio website and I've been looking for inspiration for my hero section, so this is exactly what I needed. Thanks so much!

    • @FluxAcademy
      @FluxAcademy Před 13 hodinami

      Thanks Amelia, that's great to hear!

  • @balkosa
    @balkosa Před 2 dny

    can you please make a tutorial of the zero awards logo by rice creative?

  • @Fake-Dady295
    @Fake-Dady295 Před 2 dny

    Bro Your Very Execellent Web devolopment

  • @Measos77
    @Measos77 Před 2 dny

    I cast "Weld Butt crack"!

  • @MrBraianzzz
    @MrBraianzzz Před 2 dny

    The photoshop and brainstorm skills are brutal!

  • @thadcreates243
    @thadcreates243 Před 2 dny

    Where is the part 2 of this?

  • @MohamedSuhail-pp1ej

    great

  • @vrombo
    @vrombo Před 2 dny

    Did you notice the mic draws a gothic letter tattoo on your neck?

  • @thegenznightmare
    @thegenznightmare Před 2 dny

    I am working on my new website for my own brand and this is very very helpful. Thank you!

  • @sunnymeghrajani8776

    Yes please create a tutorial video for GSAP animation

  • @maskedvillainai
    @maskedvillainai Před 2 dny

    I mean. Obviously lol? It's literally right there so if someone doesn't know this they probably wouldn't be watching this. Because they wouldn't have used framer. Weird stuff lol

  • @alongaier8001
    @alongaier8001 Před 2 dny

    I woke up watching this..