InVision Studio Tutorial: Parallax Scrolling Animation!

Поделиться
HTML-код
  • Опубликовано: 13 июн 2024
  • In this video, I demonstrate a simple and practical way to use parallax scrolling in your designs.
    Download HQ stock photos: www.pexels.com/
  • КиноКино

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

  • @SketchTogether
    @SketchTogether 5 лет назад +6

    Sharing this video with my team at InVision, man. Good stuff!!!

  • @ew4363
    @ew4363 4 года назад

    Wow, thank you for explaining this simply. I just took an InVision course and the person there didn't understand what I was talking about. Thanks so much for sharing!

    • @JakePomperDesign
      @JakePomperDesign  4 года назад

      E W of course! Glad you found the video helpful 😃

  • @SketchTogether
    @SketchTogether 5 лет назад +2

    This is super cool, man! Loving your videos!
    Make more Studio videos!!!

    • @JakePomperDesign
      @JakePomperDesign  5 лет назад

      Sketch Together thanks Pablo! I have a whole Studio playlist but I definitely have more tutorials in the works!!

  • @mrrockss
    @mrrockss 5 лет назад +4

    Awesome, thanks for putting this together! :)

  • @faizedrisy
    @faizedrisy 4 года назад

    thank you sir

  • @Oranggee
    @Oranggee 3 года назад

    thanks i know stuff now!!!!

  • @ZhengCheng
    @ZhengCheng 5 лет назад +1

    thanks

  • @jillbressler1986
    @jillbressler1986 3 года назад

    Super helpful. Would love to see how to simulate sticky navigation with dropdowns. May be more than studio allows for now.

    • @JakePomperDesign
      @JakePomperDesign  3 года назад

      Thanks Jill! If I understand you correctly, you could definitely hack this in studio, although it will require a bunch of screens and the flow would need to be pre-scripted. I’m hoping studio soon provides the ability to create component states with motion built in 🤞
      Thanks for watching!
      Jake

  • @tonys490
    @tonys490 4 года назад

    Please do more videos on animations in invision

  • @clipperx148
    @clipperx148 2 года назад +1

    I did it, but in figma

  • @sandy050391
    @sandy050391 Год назад

    Can we make animated scrolling without drag it with invision?

  • @motivateme6063
    @motivateme6063 4 года назад

    in the layers panel above the page 1 there is something called parallax icon which is turn on in this video, but in my case I can not able to found out that parallax Icon
    even, without turning on this option the parallax effect will not be implement. you didn't said how to turn on that option....? I'm using Iatest version of Invision studio (2020)

  • @tonys490
    @tonys490 4 года назад

    Amazing video , i just picked up you saying ( stimulate) by moving hero image up - does that mean invision will understand what we are trying to do ? Took me a while to understand how invision understands what we intend to do ? Is this stimulation ?? Thanks man

    • @JakePomperDesign
      @JakePomperDesign  4 года назад

      Hey thanks!! What I meant by simulate...since studio can’t really do real scroll-based animations yet, you could simulate a scroll interaction using a drag interaction and repositioning the layers on on each screen as shown. So we’re simulating, or “hacking” a scroll interaction here. Hope this helps!
      Jake

    • @tonys490
      @tonys490 4 года назад

      @@JakePomperDesign mate i got it now .. i just watched it again.. Can you do TEXT based animations as well.. amazing videos thanks JAke

  • @mayavoss
    @mayavoss 4 года назад

    Hey JP. How would you handle a long one-page scrolling website with lots of parallax effects.

    • @JakePomperDesign
      @JakePomperDesign  4 года назад

      Maya Voss hey! For what you’re describing, studio does not really have this capability at the moment. For prototyping actual scroll-based animations like the parallax you are describing, a tool like principle will be better.
      Thanks for watching!
      Jake

  • @richillartloe
    @richillartloe 4 года назад

    Is invision studio and invisionapp the same company?

    • @JakePomperDesign
      @JakePomperDesign  4 года назад +1

      Richill T yes - Invision studio is their newer, stand-alone design tool