6 Webflow Micro Interactions You Can Clone Today

แชร์
ฝัง
  • เผยแพร่เมื่อ 11 ก.ค. 2024
  • Micro-interactions can help your website feel more polished and professional. These are some of the strategies that experts use to improve their sites. With micro-interactions we can layer unique experiences so the end user is left feeling satisfied, rather than bored.
    Here are the links
    🛠 Try Webflow 👇
    webflow.grsm.io/arnau
    Portfolio Lists - Webflow
    webflow.grsm.io/portfolio-list
    Scroll Interactions - Webflow
    webflow.grsm.io/scroll-clone
    MM-006: Timed Automatic Slider - Webflow
    webflow.com/made-in-webflow/w...
    MM-017: Seamless Page Transition - Webflow
    webflow.com/made-in-webflow/w...
    Kevin Haag - Webflow
    webflow.com/@kevinhaag
    Liquid Nav Links - Webflow
    webflow.grsm.io/liquid-nav141
    Daily Direction Micro Interactions - Webflow
    webflow.com/made-in-webflow/w...
    🚀 Subscribe for more weekly design content
    bit.ly/2FQLrO5
    🎥 What I use in my videos!
    kit.co/arnauros/filming-setup
    📄 Bonsai Referral (try for free)
    www.hellobonsai.com/invite?fp...
    👨‍💻 Connect with me
    arnau.design
    🌎 Socials
    / arnau_design
    / arnau_design
    DISCLAIMER: Links included in this description might be affiliate links. If you purchase a product or service with the links that I provide I may receive a small commission. There is no additional charge to you!

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

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

    Do you use interactions a lot?

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

    These Webflow interactions are so satisfying

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

    awesome video. thankyou so much!

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

      Thanks for watching! :)

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

    thank you man. this is very helpful!

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

      awesome! happy it helped :)

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

    I am definitely trying out the portfolio list and scroll interactions. Thanks for sharing this. I just followed you on twitter too. Keep up the good content.

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

      Awesome Parekh, see you there!

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

    Wow, you said it, you made it!:) Very useful video, thanks. I think the 6th clonable can enrich the site I'm working on right now. Should try it out

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

      Fantastic!

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

    all are just beautiful, but I'd pick the first one as my favorite. BTW, LOVE your content!

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

      Thanks so much 😊

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

    Another valuable video

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

      I appreciate it Sunsi 🙏

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

    Wen i cloned a section into a new project and than copy that whole section and try to put it into my current project, than its broken. the animation is not working etc. is there a way to clone these sections from clonable marketplace with alle the interactions? how can i do it? is there maybe a checklist i have to follow to get it work like it works in the marketplace/clonables?

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

    Thank you Arnau for the resources. Would you recommend me as a beginner to learn to create animations in webflow by myself or just use clonables? Or maybe both?
    I'm happy that i discovered your channel. High quality content!

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

      Definitely take the time to learn the animations. If you want to get something out quick theres no harm in cloneables, but you should understand how they work!

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

      @@ArnauRos Thanks for your reply. That sounds like a good way!

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

      ​@@Haweelthe second one is tagged as Tweenmax, which means it's made with GSAP library. So I'm not sure it's clonable (at least without custom code modification). Most of the really interesting animations are made by professional frontend developers.

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

    Hi, I don't understand to clone the Seamless Page Transition without cloning all the website. Can you help?

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

    omg you are my saviour. Do you have any tips or nice mockups...? or how to create cool 3d scrollable mockups for webflow?

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

      hey, what kind of mockups ya looking for?

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

      For iPhones and desktop, all the nice that i find I’m supposed to have Photoshop for. But I got inspired by your video of adding 3D from spline in webflow, a mockup like that would be so cool

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

    Complete webflow beginner here wondering if you could give tips on how to make an awesome 1 product ecommerce store using interactives

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

      thats a good idea!

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

    Which resources/courses you would suggest, who wants to learn Webflow Fast as a beginner?

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

      As a free resource, the webflow uni is amazing, if you want a faster more concise I recommend the flux courses. (not because I do vids on there as well, I bought a course from them before that)

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

    Can you make a video showing how to transfer one of these interactions over to another website?

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

      Yes! Video is coming up, let me know which one in specific you need help with?

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

      @@ArnauRos How to clone a pageloader would be nice! and also other more complex clonables :)

  • @emericmartin5229
    @emericmartin5229 2 หลายเดือนก่อน +7

    Dude said “it’s my favorite “ for every single of them

    • @ArnauRos
      @ArnauRos  2 หลายเดือนก่อน +3

      theyre all my favourites

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

    great video straight to the point while also being under 10 mins which means the focus isnt on ad rev for youtube

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

      i'm here to help!

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

    Hello. I have a few questions that are bothering me. I hope for your help.
    1. I have an application form that has a name, state and city. I need a drop down list of states and a drop down list of cities related to the selected state. Can you tell me how to implement this?
    2. There will be an order button on the site. After clicking on the order button
    3. How do you solve the problem of multilingualism on the site? Do you plug in a plugin or create a separate page with the desired translation?

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

      Hey! I'm not sure I'd need to take a look at the site itself, for n3 theres a few language plugins out there, most are quite easy to set up

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

      @@ArnauRos If you need a design, then tell me where you can send the link?

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

    I want to change the video in a video player through a button or thumbnail it is basic, common on many website how comme it is hard to figure it out how to do it in webflow?

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

      I’m not entirely sure, theres some 3rd party softwares that allow you to customise videos a lot more!

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

    As a student webflow is expensive for me to setup a portfolio site and paying a monthly fees of 18$ (around Rs1500). The amount of animation and quality which webflow has, I could not find any other no code service to provide that. Is there any promo code or any discounts? I cant use my university id to get a student discount as after my graduation my uni email will be terminated. I want to make the website using my personal email id. Any help I can get.

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

      Webflow is very expensive for students, if you can live without it you can publish your site on the .webflow.io domain and use that until its easier to pay for it? I don't know of any discounts readily available :\

  • @Sabrina-uh7fr
    @Sabrina-uh7fr 11 หลายเดือนก่อน

    Does anyone else has trouble cloning website? no animation happens when I cloned the website. So my process is clone the website and preview, there is no animation or interaction when I preview it

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

      What example are you trying to clone? Some of them are custom code.

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

    What level of programming skills do I need make these interactions?

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

      none, these are with webflow

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

      @@ArnauRos are you sure? Some of them are written using custom code. For example, the second one (created using GSAP). You can clone it and replace the images of course, but typically an animation requires polishing or modification to suit some project needs.

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

    Nothing irritates me more than a website with too many interactions. I want to move from point A to B without too many distractions, and never want to have to wait or figure out where something is.

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

      True! We need to do it tastefully :)