Make WEBSITES in Rive - Layouts Tutorial

Поділитися
Вставка
  • Опубліковано 2 лют 2025

КОМЕНТАРІ • 44

  • @DDesigner123
    @DDesigner123 Місяць тому +5

    Love Rive . This is the future of interactive website design, can't wait to see the future for RIVE.....

  • @DanaTYang
    @DanaTYang Місяць тому +4

    Wooooah! Going into visual studio too?! 20:32 love that you are teaching this in a way an absolute beginner can follow! I hope to implement this for my future portfolio site! 🤩

  • @craftoverflow
    @craftoverflow Місяць тому +3

    Incredible work, Ross Plaskow!

  • @wolfreicherter748
    @wolfreicherter748 Місяць тому +2

    have I mentioned how good I think your Tutorials are? if not, damn bloody good!!!

  • @WelingtonVieiradeSouza
    @WelingtonVieiradeSouza 25 днів тому

    Os sites nunca mais serão os mesmos após está tecnologia facilitadora da Rive. Parabéns! O mundo de possibilidades!

  • @brianavarro
    @brianavarro Місяць тому +2

    Ross, thank you so much!! you dont have idea how long I've been looking to add responsive animations to the websites that I make, I was struggling with chatgpt for hours and never finding a solution, I am not savvy at all in the code world but thanks to you I could actually do it, thanks again, maybe for you the code things was very simple but for me it was a great help, also the step by step animation was great.. but thanks again its really hard to find this code tutorials I hope you can upload one explaining how to make the buttons to trigger a URL like this, I've checked a few but they are really messy and hard to follow! please keep up your awesome work!

    • @Rive_app
      @Rive_app  Місяць тому

      Hello! In Rive you can actually set an event to trigger when you click a button. And in the event you can set a URL to open! No code necessary! :D

    • @brianavarro
      @brianavarro Місяць тому +2

      @@Rive_app I tried to do it this way: I created a button "Event open URL" trigger to open Google, but when I exported the code (embed code 3rd option in the share link) and embedded it on a website, it didn't do anything. It does the animation, but it doesn't open the URL. I don't know if that's the correct way or if I should do it through Javascript which I don't have any idea of how to do it

    • @Momotion_TV
      @Momotion_TV Місяць тому +1

      @@brianavarro I did i the exact same way as you and have the same problem. Really curious about how to make it work!

  • @dmytro_korolkov
    @dmytro_korolkov 9 днів тому

    Good tutorial, thanks!

  • @jz1244
    @jz1244 Місяць тому

    another amazing tutorial! thank you!!

  • @ExcuseMeAhem
    @ExcuseMeAhem 17 днів тому

    I think when Rive is able to facilitate more granular functionality for accessibility, better support for importing data, and better support for mobile native gestures, you’ll start to see it used for full-stack app development. Is this the vision?

  • @Kendall3lane
    @Kendall3lane Місяць тому +2

    Why is the column icon a row, and the row icon a column? 🤔
    Either way I love Rive and I'm so stoked be using more of this!

    • @Rive_app
      @Rive_app  Місяць тому +1

      III this is a row
      ≡ this is a column

    • @Kendall3lane
      @Kendall3lane Місяць тому

      @ I know that’s how it is in rive, but rows are horizontal and columns are vertical. The app has it backwards haha

    • @karidyas00
      @karidyas00 Місяць тому

      @@Kendall3lane the icons are a bit confusing, but if you look at it like "these are 3 lines arranged in a row" and "3 lines arranged in a column" rather than "these lines represent rows/columns" it does make sense. Perhaps if they were squares rather than lines?

    • @Kendall3lane
      @Kendall3lane Місяць тому +1

      @@karidyas00 yeah I see what you mean - it just looks backwards how it is. like the row icon looks like "three lines in three different columns" and vice versa.
      Anyways I didn't mean to be so nit picky on this haha. I'm excited that this is a new capability :D

  • @JurijMalovrh-vw9gl
    @JurijMalovrh-vw9gl Місяць тому +3

    Rive for websites, nahh, rive websites, yeahhh

  • @SEGVeenstra
    @SEGVeenstra Місяць тому

    Looks nice, but I've got doubts... Like, what's up with the hardcoded values?
    This is not scalable at all, every time you change the content, you have to change all those values?

  • @flowperekur
    @flowperekur Місяць тому +2

    27:16 the outro appeared suddenly and scary

  • @andreasgaschka
    @andreasgaschka Місяць тому

    Looks a lot like Auto-Layout in Figma, which is a good thing, as this is my most favorite feature of Figma

  • @NeverCallMeKitty
    @NeverCallMeKitty Місяць тому

    Can you add these layouts to an existing website? For instance i use wordpress, or can you only host with github? Or can you embed it? I would love to use this, but im a little confused on the tech side of it.

    • @iberryboi
      @iberryboi Місяць тому +1

      You absolutely could add a riv file into a WordPress page using the web runtime.

    • @NeverCallMeKitty
      @NeverCallMeKitty 24 дні тому

      @iberryboi thank you! I will try it out!

    • @iberryboi
      @iberryboi 24 дні тому

      @@NeverCallMeKitty np! Also, keep in mind that WordPress uses PHP so you'll need follow the documentation for adding scripts to your site, that is where you will implement the web runtime.

    • @NeverCallMeKitty
      @NeverCallMeKitty 24 дні тому

      @iberryboi oh boy 😅, thanks for the info, but you just made me realize that this is far from my scope of capabilities lol. Oh well, it was good thought, thanks for being so helpful though.

  • @BirdSoloDev
    @BirdSoloDev Місяць тому

    Awesome! On mobile i cant scroll your site at the moment. How to fix this? Thanks.

    • @Rive_app
      @Rive_app  Місяць тому

      Try the new Scroll option for layouts. x.com/i/status/1866522377821261974

  • @juliandrv
    @juliandrv Місяць тому

    Hi Rive, thanks for this kind of videos.
    I wonder if it is possible to make a video on web accessibility.

    • @Rive_app
      @Rive_app  Місяць тому +1

      sure! that would be easy. you dont have to create entire pages in one rive file. so use rive files as individual components and then use alt tags.

    • @juliandrv
      @juliandrv Місяць тому

      @@Rive_app cool, thank you again!

  • @unitedastronomer
    @unitedastronomer Місяць тому

    i opened the website in my phone, it didn't automatically adjusted based on my phone's screen size and i was getting at least 10 fps. :(

  • @one1stofall465
    @one1stofall465 Місяць тому

    what the hell is with the 10 MB, THATS STUPID. and why dont you add a bend layer to the character.

    • @prasoondhapola2875
      @prasoondhapola2875 Місяць тому

      What are you referring to? Can you explain?

    • @Rive_app
      @Rive_app  Місяць тому

      There are no files in this project that are more than 1mb.

  • @s3ntry948
    @s3ntry948 18 днів тому

    19:10 here

  • @DanTuber
    @DanTuber Місяць тому

    I want to like this app, but it's too convoluted in the way you have to do things.

  • @jyntvrma
    @jyntvrma Місяць тому +5

    Day 69 of requesting a rive app for iPad with apple pencil support. Plz🙏😩...

    • @DanaTYang
      @DanaTYang Місяць тому +1

      I’d love to at work on animate mode on the iPad while I’m on the couch or on the go!

    • @Rive_app
      @Rive_app  Місяць тому +5

      Interesting idea!! Noted!! In the meantime, Rive works in browser! Have you tried using Rive in-browser on your iPad???

    • @jyntvrma
      @jyntvrma Місяць тому

      Tried working solely with the Apple Pencil but ran into issues. External mouse and keyboard kill convenience and portability. Hoping the insanely talented Rive devs can work their magic!

    • @LucasPalma666
      @LucasPalma666 Місяць тому

      I use Rive on a Galaxy Tab S9 Ultra with its own keyboard case and pencil. Works like a charm on the Chrome browser - plus I "created an app" from the Browser, which integrates it beautifully with Android. Maybe iPad and Safari can do the same?