Parallax Scroll Effect - Figma Tutorial

แชร์
ฝัง
  • เผยแพร่เมื่อ 28 ก.ย. 2024

ความคิดเห็น • 70

  • @sergelyon
    @sergelyon 6 หลายเดือนก่อน +7

    the correct name of this vid should be "Parallax Drag Effect", you didn't use Scroll

  • @minkzoo
    @minkzoo ปีที่แล้ว +11

    Hey Adrian! Just wanted to drop a quick comment to say thanks for the awesome design content! Keep up the great work and keep those videos coming. You're an inspiration! 👍🔥

    • @uiadrian
      @uiadrian  ปีที่แล้ว +1

      Thanks a lot Stevanus! Glad to have you here 🙌

  • @yakubyilmaz3506
    @yakubyilmaz3506 ปีที่แล้ว +3

    Finally a good tutorial on this effect, you explain it very well and you do it on live which is helpful! Great mic too

  • @335smileyface
    @335smileyface ปีที่แล้ว +3

    Another amazing tutorial which makes even more excited about UI/UX and this whole learning process ! Thank you for what you do, I am forever grateful 😇🙏

  • @mohsinop4647
    @mohsinop4647 ปีที่แล้ว

    overall best content ever on a youtube channel thanks alot

  • @mustaqahmedali1527
    @mustaqahmedali1527 ปีที่แล้ว +1

    Amazing 🤩 let try this one. For my upcoming projects

    • @uiadrian
      @uiadrian  ปีที่แล้ว

      Thanks! Good luck with your projects Mustaq!

  • @tinamindrul4140
    @tinamindrul4140 ปีที่แล้ว

    I enjoy the sound with your mic so much!

  • @ericaamos3019
    @ericaamos3019 11 หลายเดือนก่อน

    Hey Adrian! I am REALLY glad to see your longer form videos on TH-cam! I watch your IG tutorials a lot! Can you please make a video on how to make 3D illustrations move. Like having little motion effects like bouncing, hover etc… thanks! 🎉

  • @mohammedrazim
    @mohammedrazim 8 หลายเดือนก่อน

    Love the fact that all the keys being pressed is mentioned

  • @markraimondeau3372
    @markraimondeau3372 18 วันที่ผ่านมา

    Thanks for the great tutorial. But it only works while dragging - I don't see how to get it working on scroll

  • @JohnXionidis
    @JohnXionidis ปีที่แล้ว +1

    Awesome tutorial thank you!

    • @uiadrian
      @uiadrian  ปีที่แล้ว +1

      Thanks John! Glad I could help :)

    • @JohnXionidis
      @JohnXionidis ปีที่แล้ว

      @@uiadrian Help? Your channel is an amazing gem on youtube, hope it grows a lot!

  • @nishant7083
    @nishant7083 ปีที่แล้ว

    Your first video and this video really made me think about design Hey brother how about a skillshare course ??

  • @nwachukwunwankwo2416
    @nwachukwunwankwo2416 ปีที่แล้ว +2

    is there a way to have the figma prototype actually use the parallax effect normally instead of using the drag feature?

  • @CARSSTREETNIGHTS
    @CARSSTREETNIGHTS ปีที่แล้ว +1

    Hi Adrian !
    I did what you said, but the pages not go up and I want it to move with the mouse scroll movement, not with the drag and drop method. how can I do that Thanks

  • @yashassbhandari1114
    @yashassbhandari1114 9 หลายเดือนก่อน

    Amazing video man, thanks for the tutorial!

  • @jirowang110
    @jirowang110 2 หลายเดือนก่อน

    Mine is still a bit choppy when I drag. How do you get it to be a smoother transition?

  • @CLOWNSTRAY
    @CLOWNSTRAY 7 หลายเดือนก่อน

    Hey! Can you do a liquid fab button animation tutorial?

  • @MANDEEPSINGH-z9s
    @MANDEEPSINGH-z9s ปีที่แล้ว

    Awesome 🙌

  • @DivyeshNandwana
    @DivyeshNandwana 5 หลายเดือนก่อน

    very help full video to beginners designer 👌👌👌👌👌👌

  • @ahumblerequest5222
    @ahumblerequest5222 ปีที่แล้ว +1

    Can we do this effect while scrolling with mouse wheel

    • @uiadrian
      @uiadrian  ปีที่แล้ว +2

      Not directly, but we could add a scroll bar and add an "On drag" trigger to it. I believe @TimGabe created a tutorial on this before :)

  • @amruta1817
    @amruta1817 6 หลายเดือนก่อน

    👍👍👍👍 thanx bro u sharing a amazing vedio🥳🙏🙏

  • @hermesg2344
    @hermesg2344 11 หลายเดือนก่อน

    Bonjour Mr Adrian, j’apprécie vraiment ce que vous faites et j’aimerais savoir si vous faites aussi des formations en Français sur Figma

  • @priyanshusingh5192
    @priyanshusingh5192 ปีที่แล้ว

    Hii Sir,
    I need your help to understand about UX/UI designing..... regularly I am consuming your designing content on Instagram and I want to know about figma 3D design how can we convert figma to WordPress..... I have lots of confusion Sir please reply back

  • @ElytaWang
    @ElytaWang ปีที่แล้ว

  • @maryamashraf3033
    @maryamashraf3033 ปีที่แล้ว

    Sir please upload more vidoes

  • @abdullahigiwa2719
    @abdullahigiwa2719 ปีที่แล้ว

    Adrian please can you scroll back up? Is it possible?

  • @adelaposse4379
    @adelaposse4379 11 หลายเดือนก่อน

    Is anyone struggling with the drag prototype effect in Figma? mine has like a stuck and slow flow

  • @valueinvesting.
    @valueinvesting. ปีที่แล้ว +1

    ❤❤🎉

  • @rahul_lsh
    @rahul_lsh ปีที่แล้ว +1

    ❤w❤~~

  • @gorasia3568
    @gorasia3568 ปีที่แล้ว +1

    First,

    • @uiadrian
      @uiadrian  ปีที่แล้ว

      This deserves a cookie 🍪 Thanks for dropping by!

  • @JhonHalomoanSiregar
    @JhonHalomoanSiregar ปีที่แล้ว

    Plis sub indo 🙏

  • @JamieWooster-d6e
    @JamieWooster-d6e ปีที่แล้ว +2

    "please dont be on a drag interaction and actually be on scroll" thumbs down, waste of time. cause all we all naturally drag when scrolling down a webpage!

    • @uiadrian
      @uiadrian  ปีที่แล้ว +5

      What an idiotic comment. I explicitly state that there was no scroll trigger in Figma. Go waste someone else's time

  • @mikhailov2286
    @mikhailov2286 13 วันที่ผ่านมา

    Rodriguez Christopher White George Lopez George

  • @Sadman_sakib
    @Sadman_sakib หลายเดือนก่อน

    Where are you bro? Are you alright? Miss ya, hope you are well 😕

  • @snehapandey2130
    @snehapandey2130 หลายเดือนก่อน +1

    superb such a great tutorial keep share more video and smooth understanding tutorial 🔥🔥🔥keep grow

  • @anonymous-sz8jq
    @anonymous-sz8jq 4 หลายเดือนก่อน

    heyy how did get that header from? please help

  • @IamShashi98
    @IamShashi98 ปีที่แล้ว +1

    I may be late on commenting but, the clock design on Instagram is sick…❤ I love it and this tutorial tooo… thanks for sharing your knowledge on Figma for upcoming web designers.. I’ll buy every thing on your gum road once I get my first job😢…

  • @vivlogs9752
    @vivlogs9752 ปีที่แล้ว +1

    Awesome tutorial Adrian ! 🤩🤩 Next time can you build an app from start to finish showing all the passages in figma? That would be so useful! 🥹🥹thank you 🙏🙏

  • @LiiGitonga1
    @LiiGitonga1 ปีที่แล้ว +1

    Hi Adrian, Quick question .... How did you add the background visual around teh 5:12 timestamp?

    • @uiadrian
      @uiadrian  ปีที่แล้ว

      It's a design I created using this method 👉 instagram.com/p/CrLHNRNg8os/

  • @adeleyejames8551
    @adeleyejames8551 ปีที่แล้ว +1

    Been waiting for this bro. See this on your Instagram page. Thank tho

    • @uiadrian
      @uiadrian  ปีที่แล้ว +1

      No worries! Hope it was helpful 👋

  • @FlyByWheels
    @FlyByWheels ปีที่แล้ว +1

    Thankyou for the wonderful tutorial 🎉

    • @uiadrian
      @uiadrian  ปีที่แล้ว

      My pleasure! 😊

  • @KEpi_Gaming
    @KEpi_Gaming ปีที่แล้ว

    Please provide these 3 Photos that you screenshot and added in the frame

  • @saurabhsarkar9817
    @saurabhsarkar9817 7 หลายเดือนก่อน

    Hey, I have a question, when design all of thing autolayout is needed?

  • @hellokitkath3329
    @hellokitkath3329 ปีที่แล้ว

    Hi! Do you have a practice file for this? Thank you!

  • @therealdeal2247
    @therealdeal2247 ปีที่แล้ว +1

    Oh yeahhh!

  • @arjunvegeta
    @arjunvegeta 9 หลายเดือนก่อน

    can you please this figma file?

  • @Alsa971
    @Alsa971 ปีที่แล้ว

    Do you have the entire Figma course ?

  • @alizszakacs5552
    @alizszakacs5552 ปีที่แล้ว

    Hi Adrian! Thanks for the amazing content as usual! I love your ebook as well and just purchased the Figma mastery course, but I wonder - is there a certificate to look forward to at the end of the course? Again, you are such an inspiration! 🙏🚀

  • @lloveis
    @lloveis ปีที่แล้ว

    Adrian!! Thank you very much for sharing with your knowledge and teaching us for free. Scroll design is my favorite and wanted to learn it for a long time. Thank you once again.

  • @javi7299
    @javi7299 11 หลายเดือนก่อน

    biggg fannnnnn

  • @souravgoswami5858
    @souravgoswami5858 ปีที่แล้ว

    Thanks man

  • @souravgoswami5858
    @souravgoswami5858 ปีที่แล้ว

    Thanks man

  • @DungBui-mw1ix
    @DungBui-mw1ix ปีที่แล้ว

    Like first
    Watch later
    Thank u Adrian!!

    • @divyang-r7n
      @divyang-r7n ปีที่แล้ว

      :scream::scream::scream:Advance Figma Magic' Tips
      youtube.com/@DD.DesignStudio?sub_confirmation=1

  • @UnlistedUP
    @UnlistedUP ปีที่แล้ว

    Doesn't work if there are objects sliding to the right or left. In that case one needs a scrollbar!

    • @divyang-r7n
      @divyang-r7n ปีที่แล้ว

      :scream::scream::scream:Advance Figma Magic' Tips
      youtube.com/@DD.DesignStudio?sub_confirmation=1