GSAP 3D MODEL IMPLEMENTATION ON A MINIMAL LANDING PAGE - Elementor Wordpress Tutorial Flex Container

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

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

  • @Finn_Maddy
    @Finn_Maddy День назад +2

    I absolutely love your content! Have you considered creating a dedicated series on this topic? It’s in high demand right now, both in the company I work for and in my freelance projects. I’d love to explore it further and discover new aspects I might have missed. Your hard work and videos could gain even more traction with such a series!

    • @andreaegli
      @andreaegli  День назад

      Thank you so much! On the topic of 3D? I might because this video did very well, I was actually testing the waters to see if it's worth going a bit deeper on the subject cause I love it too ;)

    • @Finn_Maddy
      @Finn_Maddy 23 часа назад

      @@andreaegli You're welcome! Yes, on the topic of 3D, It’s such an exciting area with so much potential! I think a series would be a hit, especially since you’re passionate about it. The demand is definitely there, and your approach could make it even more accessible and inspiring for people like me. Looking forward to seeing what you come up with! 😊

  • @erhamotionvideo7517
    @erhamotionvideo7517 2 дня назад +1

    Apart from having programming skills, it turns out you are also a very talented artist

  • @erhamotionvideo7517
    @erhamotionvideo7517 2 дня назад +1

    keren sekali, love it

  • @marianturcek1867
    @marianturcek1867 День назад +2

    Hi Andrea. Very nice effect and great tutorial. I have a question. If I download a 3d model with animation from sketchfab, it won't show the animation. For example, a hummingbird in flight will appear on the web as a static 3D object. Can you please advise me if I need to modify the code or if it doesn't work in elementor? Thank you.

    • @andreaegli
      @andreaegli  День назад

      Hey! Thanks 😊 you need to download the file in .gib format and then upload it to the medial library in Wordpress. From there you can copy the file path and add it to the code snippet 😉 how this helps

    • @marianturcek1867
      @marianturcek1867 День назад +1

      @@andreaegli Hi Andrea. Understand, but elementor doesn't support native glb files. I uploaded it through the WP file manager plugin. Then I enter the path to the file, it displays it, but without the animation, as if it only loads the first frame. I don't know how to give him the play keys, or if there is anything else that needs to be added.. 🤷

    • @andreaegli
      @andreaegli  День назад

      @@marianturcek1867 ah, yes! I used file upload types plugin. This is the code snippet for the 3D model:
      this worked for me, without looking at your setup, I can't tell why is not working....

    • @marianturcek1867
      @marianturcek1867 День назад +1

      @@andreaegli autoplay animation-name="Running" and it works. Thanks Andrea. with this tip of yours, websites will have a completely different life. :) Have a nice day.

    • @andreaegli
      @andreaegli  День назад

      @@marianturcek1867 wooohhoo!!!! awesome! same to you ;)

  • @mofunnel
    @mofunnel 2 дня назад +1

    very very Amazing Thank you

  • @-NAVEENRAJK
    @-NAVEENRAJK 12 часов назад +1

    The content is great but how do you create the 3d model like which platform ?

    • @andreaegli
      @andreaegli  11 часов назад

      You skipped the part where I was talking about that, watch the beginning of the video 😉

  • @dbruddy
    @dbruddy 2 дня назад +1

    Very nice! Love it

  • @maikuebel
    @maikuebel 3 дня назад +1

    Great! What is the effect for the text "Collectible works....." ? Its not "HIGHLIGHT TEXT ON SCROLL", or?

    • @andreaegli
      @andreaegli  2 дня назад +1

      thanks! this one here: ruclips.net/video/h8wa_qABv-o/видео.html

  • @teuccio73
    @teuccio73 2 дня назад +1

    Spectacularis !!

  • @zafit02
    @zafit02 2 дня назад

    Andrea, I tried the fix you uploaded for Lenis Scroll, but the CSS html { scroll-behavior: auto !important; } breaks the anchor links, it scrolls directly without smoothness

  • @Wares_hashimi
    @Wares_hashimi 2 дня назад +1

    Nice 🎉🎉 please tell me are you writing your code by chatgpt if you write with chatgpt please make tutorial for us how to write prompt for code❤❤❤

  • @pex-pl
    @pex-pl 3 дня назад +1

    great tutorial - it's a pity that the size of .glb files practically eliminates the point of using them on mobile devices...

    • @andreaegli
      @andreaegli  3 дня назад +1

      Thanks 😊 I’m sure there are workarounds to that, we just have to think outside the box 😀

  • @Akram-y4e
    @Akram-y4e 3 дня назад +1

    Hey, how it's going?

  • @CJ-f7u
    @CJ-f7u 3 дня назад +1

    This isnt GSAP, its 3.js ..
    GSAP cant render out models, you have to create the canvas , cameras , lights as well as their positioning , color casting and atmospheric elements .. it's all done in 3.js ..
    The assets are all game / VfX models and you have to use glb because its the smallest size for this models , the 1k texture packs are the smallest these can go to.
    A guy here on RUclips created the scripts in his video a little while back and made the assets load asynchronously as well for websites.

    • @andreaegli
      @andreaegli  3 дня назад +1

      Are you referring to the example I showed? If so, I know it's three.js I already said that I'm working on smth similar but it takes time, I'm not a seasoned dev. Could you share the name of the guy with us?

  • @rajeshkurup-u8b
    @rajeshkurup-u8b 3 дня назад +1

    Andrea....How cool your smile.