The popular stacking card animation in Framer

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

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

  • @ReservedRealm
    @ReservedRealm Месяц назад +2

    Great tutorial! You explain so well that even complex animation looks simple. Thank you so much and please keep posting

  • @vitaliy7280
    @vitaliy7280 2 месяца назад +1

    really helpfull
    honestly I think this video is the best about framer overlapping cards on RUclips

  • @neddieperez46
    @neddieperez46 2 месяца назад +1

    So comprehensive! Thank you so much!

  • @chin2826
    @chin2826 Месяц назад +1

    Best teacher ❤❤❤

  • @thevisuallaboratory
    @thevisuallaboratory Месяц назад +1

    Absolutely awesome. Just added this to my portfolio. Quick question - what plataform do you use to make your mockups? The images you used are super beautiful

    • @DesignwithAsif
      @DesignwithAsif  Месяц назад +1

      Apreciate it. Well, those images were taken from the internet. The UIs are created by an agency named Musemind. I just took their images from dribble.

  • @ruddro29
    @ruddro29 4 месяца назад +2

    Love this video....super helpful....btw need more gsap animation videos plz 😊

    • @DesignwithAsif
      @DesignwithAsif  4 месяца назад +1

      I am glad that you found it helpful. Regarding the GSAP, most of the cool stuffs in GSAP are not free. And also, i think we should focus on framer motion rather than gsap while using framer. I will try to create some videos on that. Thanks for your support.

  • @frankvasquez4827
    @frankvasquez4827 2 месяца назад +1

    Awesome tutorial! Thank you! But, it is possible to still have some edges of the sections below visible to have a "stacked cards" effect? Similar to the Swag website?

    • @DesignwithAsif
      @DesignwithAsif  2 месяца назад

      every stacking card animation available in Swag is possible to recreate using Framer.

  • @alinabolgova7503
    @alinabolgova7503 Месяц назад +1

    Love this tutorial, thanks a lot for sharing 😍! One question, is it possible to create a blurred effect when the cards disappears in the background? Where should I look for it? Thanks again! 🙂

    • @DesignwithAsif
      @DesignwithAsif  Месяц назад +1

      Yes possible, create a variant of the card with the blurred effect and use Scroll Variant effect from the side panel.

    • @alinabolgova7503
      @alinabolgova7503 Месяц назад +1

      @@DesignwithAsif Thanks a lot Asif! ☺

  • @DARKredDOLLAR
    @DARKredDOLLAR 2 месяца назад

    Thanks for the video!
    Just wanna ask, is it nacessary to have each image in its own Frame? And can this be somehow applied to cms images that on different projects have different amounts of images? Like say 9 images on one, but 6 on the other?

    • @DesignwithAsif
      @DesignwithAsif  2 месяца назад +1

      Not necessay but putting images in a frame or stack provides better control. Images can be connected with the uploaded images in the CMS. You can watch the tutorial I made for image slider connected with CMS.

  • @logapriya3262
    @logapriya3262 Месяц назад

    I followed the same steps and it looks great on web version. However it shows a lot of white space between each images in a frame. Could you please help me to fix this. Thanks in advance

  • @SnowyAtiq
    @SnowyAtiq 3 месяца назад +1

    Thank you so much brother. ❤
    I really appreciate you for the tutorials. 🫡
    Really love it. 😍