Figma Drag Card Animation

Поделиться
HTML-код
  • Опубликовано: 1 дек 2024

Комментарии • 87

  • @matthewheard9010
    @matthewheard9010 2 года назад +3

    bro excuse my language but dam you are cold at Figma!!! wow, amazing teacher as well thanks for these tutorials they really help! Simplistic and very effective !!😎😎👍🏾

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +1

      Well Matthew…. YOU JUST MADE MY DAY! Thank you 🙏

  • @mschrimmer631
    @mschrimmer631 Год назад +1

    You're the reason why the dev team hate my guts haha!

  • @masternano
    @masternano Год назад +2

    Hi Gal, Please can you point mre to or make a video of a figma prototype of a component that changes state upon scrolling in the page

  • @remielabraham3017
    @remielabraham3017 11 месяцев назад +1

    Love it. The explanations are easy to understand especially, for a beginner like me. ❤

  • @ranasameh4584
    @ranasameh4584 13 дней назад

    Thank you so much this is amazing and super easy to understand!

  • @krzysztofk6796
    @krzysztofk6796 10 месяцев назад

    Wow! What a quality of the video! Good job man :D

  • @usmantesilimat486
    @usmantesilimat486 6 месяцев назад +1

    Hello Gal, what if the movie cards that you’ll like to swap this way are at the center of the page? I tried this but everytime I drag, It goes back to the beginning of the page and then I have to scroll down to see the effects

  • @lazymusafir
    @lazymusafir 2 года назад +2

    The editing is amazing. Best part is from 2:03 - 2:13 . Don't miss that guys.

  • @ShaikAjmal-hj9yr
    @ShaikAjmal-hj9yr Год назад +1

    Can u please help me out with the vertical and horizontal swipe in one frame

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +1

      You have to have multiple frames in order to pull it off ✌️

  • @PruthviHammigi
    @PruthviHammigi Год назад +1

    East peasy tutorial! Love it

  • @pratikshamangrulkar70
    @pratikshamangrulkar70 Год назад +1

    Can you please make a video on how to keep primary tab at fixed position

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +1

      I will add it to the list 📝

  • @dominicaphan3635
    @dominicaphan3635 Год назад +1

    Thanks, Gal Bar. I appreciated your instruction.

  • @hamzahassan
    @hamzahassan Год назад +1

    Thank you so much bro

  • @pratikshamangrulkar70
    @pratikshamangrulkar70 Год назад +1

    Great video 🎉

  • @blognroses3161
    @blognroses3161 2 года назад +2

    Gal thank you SO much! You helped me tremendously with my experimental design app in Figma for my master thesis! Can't thank you enough. Please upload more useful tips on how to prototype using Figma! And your editing skills are of another planet. This tutorial was a JOY! Have a nice day :)

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +2

      Oh wow 🤩 you made my day! Thank you for sharing. I promise more good stuff to come! You are welcome to check out todays video as well 😉

  • @theonewhomadeyoucry1059
    @theonewhomadeyoucry1059 Год назад

    basically a frame by frame animation but the play and rewind buttons are dragging motion

  • @Hamza-gv2pz
    @Hamza-gv2pz 2 года назад +2

    THANK YOU SO MUCH, I REALLY APPRECIATE ALL OF THESE HELPFUL VIDEOS

  • @chadaebennett7040
    @chadaebennett7040 Год назад +1

    Thank you !!

  • @maiabouza5221
    @maiabouza5221 Год назад +1

    Thank you so much!

  • @MoriaMac
    @MoriaMac 2 года назад +3

    Perfect 😍

  • @dre_laxus
    @dre_laxus 2 года назад +2

    Thanks dude very helpful

  • @kabenla
    @kabenla Год назад +1

    Thank you sooo much

  • @spiritualvibration362
    @spiritualvibration362 Год назад +1

    Hello Sir can make one video on Drag and drop in Figma, vertically and horizontally?

  • @KarthikNaidu-er4km
    @KarthikNaidu-er4km Год назад +1

    Awesome tut! well explained

  • @BarryHercules
    @BarryHercules Год назад +1

    I'm having trouble with the return interaction (swiping back). I add it to the object, but it doesn't appear in the same handle like yours, but on the left of the object and doesn't swipe back. I can see the 2 interactions in the prototype menu and they're going to the correct screens...

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +2

      Make sure you use the exact same names for your layers across all frames

    • @BarryHercules
      @BarryHercules Год назад +1

      ​@@Life_Of_Gal They are the same but thanks for the reply

  • @alisiarobinson1
    @alisiarobinson1 2 года назад +2

    This was majorly helpful! Thanks for saving me from pulling my hair out ❤🙌🏾

  • @shefalirawat2364
    @shefalirawat2364 Год назад +1

    Heyiii thank you so much!!! Damn useful 🔥🫶🫶🫶

  • @freevoices453
    @freevoices453 2 года назад +1

    Hi how can you make something similiar but to go/drag around the same axis like a wheel (and you keep seeing the moving card behind but smaller)?

  • @davidodafe9467
    @davidodafe9467 2 года назад +1

    I have a problem. I have two carousels and created a multiple drag screens for both carousels. However, on testing my design, once I swipe the first carousel, the second carousel also swipes. How do I make this not happen?

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +2

      Change the layers names. Give each layer a unique name and keep the consistent on each frame.

    • @davidodafe9467
      @davidodafe9467 2 года назад +1

      @@Life_Of_Gal I just did that. Still having the same response in the preview mode.
      Maybe I should restructure my question.
      Is it possible to have multiple carousel sliders on a screen? If yes, how do you go about it?

  • @peteryick5779
    @peteryick5779 2 года назад +2

    Hi Gal, did Figma make an update b/c this doesn't seeming working anymore, i followed your steps already

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +1

      Did you make sure to use the exact same layer names across all frames?

    • @kevniwoodside5015
      @kevniwoodside5015 2 года назад

      @@Life_Of_Gal Yeah its not working for me either. When I drag, it just fades into the next screen and then stops working

    • @kevniwoodside5015
      @kevniwoodside5015 2 года назад

      @@Life_Of_Gal and should I put on Horizontal Scrolling

    • @kevniwoodside5015
      @kevniwoodside5015 2 года назад +2

      @@Life_Of_Gal Oh nvm!!! For some reason the contents of my carousel came out the frame so it was being seen as a different layer. Thats why smart animate didn't work! Great tutorial!!!

    • @basseldroubi1052
      @basseldroubi1052 2 года назад +1

      @@Life_Of_Gal Thank you for this video , but I have question why do name all layers have the same name?

  • @ahmedtimes1000
    @ahmedtimes1000 Год назад +1

    awesome 😀

  • @muhammadarief5450
    @muhammadarief5450 Год назад +1

    How to cmd + Y in Windows?
    CTRL + Y doesn't work like that

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +1

      Shift + O or Control + O or google it 😉

  • @Ve.for.victory.
    @Ve.for.victory. Год назад +1

    Best video 📸

  • @saveennazar3990
    @saveennazar3990 Год назад +1

    Thank you a lot

  • @pteeradukteel
    @pteeradukteel Год назад +1

    thank you

  • @clarenceluk2911
    @clarenceluk2911 Год назад +1

    Hi Gal. Lovely video!!! I am new to Figma, so I apologise if this question sounds stupid. How do you switch on all of the measuring and grid lines when you're in outline mode? Cheers.

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +2

      Shift+R on your keyboard. Thank you for the kind words 😉

  • @ShanMuhammad-ny8dp
    @ShanMuhammad-ny8dp Год назад +1

    Thanks

  • @gme9628
    @gme9628 Год назад

    i do the exactly same thing and try 6-7 times. Idk why but mines is not scroll like that. my prototype looks like its fade in fadeout, nothing is scale and scroll please help

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад

      It’s probably you didn’t have the same exact name to your layers across all your frames…

  • @shirabenhamo7176
    @shirabenhamo7176 2 года назад +1

    תודה!

  • @funkeydude010
    @funkeydude010 Год назад

    Thanks a lot Guru 🤩

  • @bjmgraphics617
    @bjmgraphics617 Год назад

    How to make that animation work without having other components from moving? I have a nav bar that I want it to remain stationary and not swipe with the middle content. thanks

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +1

      I don’t understand the question brother

    • @bjmgraphics617
      @bjmgraphics617 Год назад +1

      @@Life_Of_Gal The header navigation bar at the top would slide with the rest of the content . It looks odd to see it move and to see a duplicate underneath. The scrolling is to be left to right middle section only not to include the top navigation bar. I made multiple frames with same navigation bar thinking that I had to.

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +1

      @@bjmgraphics617 not sure why you thought you had to include it but hopefully it will work for you ✌️

  • @jovenanthony7229
    @jovenanthony7229 4 месяца назад

    how to make it loop?

  • @MELMAN_PILGRIM
    @MELMAN_PILGRIM Год назад +1

    Thank you so mcuh!! and I have a question in portuguese 😬Como você consegue gravar o protótipo assim (Part 2:03 at 2:12)?

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +2

      I use FCPX for editing and MotionVFX plugin called mCamRig 😊

    • @MELMAN_PILGRIM
      @MELMAN_PILGRIM Год назад +1

      @@Life_Of_Gal

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +2

      @@MELMAN_PILGRIM de nada 😉

  • @eminaisic9988
    @eminaisic9988 2 года назад +2

    Do you need to make frame for those cards? Like you do in adobe or you can animate just one part so all other objest stays in? I am just switching from adobe to figma and already found it confusing. Swipe interaction now got complex ahhahaha anyway thanks for video. i hope it will fix all problems with swipe soon

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +3

      Welcome to the wonderful world of Figma! As for someone who moved from Xd to Figma I can tell you it is so much better! As for your Q, no need to create a frame for those cards…

    • @eminaisic9988
      @eminaisic9988 2 года назад +1

      @@Life_Of_Gal Oh thanks men , saved half of my life. Peace!

  • @AbdulKhaliq-yg7dc
    @AbdulKhaliq-yg7dc 7 месяцев назад

    Do you provide source code

  • @fa3170
    @fa3170 2 года назад +1

    wow🤩

  • @WorldAdventureInfo
    @WorldAdventureInfo Год назад +1

    1:19 how to do in windows

    • @Life_Of_Gal
      @Life_Of_Gal  Год назад +2

      Watch my video on Figma keyboard shortcuts ✌️

  • @victormiguel735
    @victormiguel735 11 месяцев назад

    My figma only goes to the right
    sh*t

    • @Life_Of_Gal
      @Life_Of_Gal  11 месяцев назад +1

      I’m sure if you pay attention to the details and do it step by step you will be able to solve it ✌️

    • @cyberfiber2873
      @cyberfiber2873 6 месяцев назад

      Have you found the solution yet?

  • @Life_Of_Gal
    @Life_Of_Gal  2 года назад +5

    Hi family 👋 if there is anything you like me to make a tutorial about drop a comment down below 👇

    • @mohammedshamil3976
      @mohammedshamil3976 2 года назад +2

      website scrollspy animation would be nice..thanks man for this video tut

    • @Life_Of_Gal
      @Life_Of_Gal  2 года назад +1

      @@mohammedshamil3976 website scrollspy?