New and returning users may sign in

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
← Adobe XD: Feature Requests

Request details

Feedback

Adobe XD: Feature Requests: 02 : Prototype mode

Categories

  • CATEGORIES
  • All ideas
  • My feedback
  • 01 : Design mode 1350 ideas
  • 02 : Prototype mode 368 ideas
  • 03: Share mode 47 ideas
  • 04 : Sharing on the web 212 ideas
  • 05 : Asset exporting 157 ideas
  • 06 : Extensibility 37 ideas
  • 07 : Integration with other tools 120 ideas
  • 08 : Mobile (iOS) 24 ideas
  • 09 : Mobile (Android) 18 ideas
  • 10: Developer Handoff 137 ideas
  • 11: Plugins 134 ideas
  • Other 101 ideas

(thinking…)
  • Searching…

    No results.

    Clear search results
    • Adobe XD: Feature Requests 2,832 ideas

Custom Scroll Animation Behavior (scroll trigger)

Most of modern apps have some custom behaviour - for example

In user profile, you see big profile picture, but when you scroll down to see user posts - picture gets smaller and moves to the corner.

Would be cool to be able to treat scroll position as kind of keyframes timeline, where you can modify styles of some elements and tween them depending on how much some view is scrolled.

Some tools have kind of similar option - https://www.youtube.com/watch?v=jRHuAq4PqQo - check first 30 secs.

  •  
    Screen Shot 2021-10-20 at 12.12.05 PM.png 201 KB
  •  
    Screen Shot 2021-10-20 at 12.12.05 PM.png 201 KB
  •  
    Group 2.png 3303 KB
  • Fixed-inside-mask_example.mov
    Fixed-inside-mask_example.mov 15639 KB
  • 2019-01-09 17-29-23.mp4
    2019-01-09 17-29-23.mp4 1459 KB
  • FiftyNifty_2.mp4
    FiftyNifty_2.mp4 6827 KB
  •  
    2-1-2017_1-57-26_AM.png 16 KB
  •  
    2-1-2017_2-06-10_AM.png 155 KB
  •  
    scroll.gif 7312 KB
1,161 votes

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close

We’ll send you updates on this idea

Adam Pietrasiak shared this idea  ·  Mar 14, 2016  ·  Flag idea as inappropriate…  ·  Delete…  ·  Admin →

How important is this to you?

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
feature-under-review  ·  Jul 12, 2016
Show previous admin responses (2)
feature-needs-more-info  ·  Demian Borba responded  ·  Jul 12, 2016
feature-under-review  ·  Demian Borba responded  ·  Mar 29, 2016

You will see a lot of improvements to Prototype Mode with our monthly releases.

Tweet
  • Remove
Attach a File

We're glad you're here

Please sign in to leave feedback

Signed in as (Sign out)
Close
Close
Submitting...
An error occurred while saving the comment
  • Chris Morrison commented  ·  May 3, 2022 2:12 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    On-Scroll trigger animations are heavily used on the web, having to use work arounds is awful when it should be native by now!

    Submitting...
  • designsbyLINDA commented  ·  April 14, 2022 3:26 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Please add an option in the trigger-dropdown.
    Maybe linked to a certain amount of pixel that have bin scrolled or similar.

    Submitting...
  • Christian commented  ·  March 4, 2022 4:09 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Need to add a new trigger to animate scrolling by using mouse wheel, scrollbar, and dragging finger for phone users WITHOUT using Tap trigger and Hover component. Otherwise the animation will not work. Thank you!

    Submitting...
  • Christian commented  ·  December 16, 2021 2:53 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    so often i had the case that i need that feature - how can this be not in place in (almost) 2022? Thanks a lot for adding this key feature.

    Submitting...
  • Anonymous commented  ·  December 14, 2021 3:28 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I've wanted this feature in almost every prototype I've created in Adobe XD. Please provide an update!

    Submitting...
  • Leo M commented  ·  December 2, 2021 11:47 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I often need to present a scroll-triggered interaction/animation, e.g. app-bar and bottom-nav hide/show upon user scrolling the content.

    This is a typical and essential behavior on mobile when user needs to view a long list of results, list of messages or emails or any list of long scrolling content thus to utilize screen real-estate to display more.

    Having this feature be wonderful! With that I'd also like to have a capability to set a fixed position when scrolling (setting X and Y coordinates) of a certain element upon user scrolling.

    Submitting...
  • Anonymous commented  ·  October 30, 2021 5:56 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    This could be done similar to the "Driver" feature in the principle (principleformac) prototyping program

    Submitting...
  • koene commented  ·  October 27, 2021 3:51 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Please please start this feature! Would be so awesome to see this in XD 50 (at least!). In-Viewport- / Scroll-Animations would bring XD really to a solid level in prototyping and we finally could show a great and realistic website and app experience in our prototypes.

    Submitting...
  • Mike L commented  ·  October 20, 2021 9:12 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I would love to be able to demonstrate to clients how their huge, branded header turns into a micro-header after scrolling.

    A simple scroll trigger, based on how far a user has scrolled, that could tell an element to Auto-Animate into place would be amazing. It could be a similar UI to the Viewport cut off line.

    Submitting...
  • Mike L commented  ·  October 20, 2021 9:12 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    I would love to be able to demonstrate to clients how their huge, branded header turns into a micro-header after scrolling.

    A simple scroll trigger, based on how far a user has scrolled, that could tell an element to Auto-Animate into place would be amazing. It could be a similar UI to the Viewport cut off line.

    Submitting...
  • Gustavo Fernando da Silva commented  ·  September 14, 2021 5:44 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Is there any updates on this? It's under review for too long, since jul 2016.

    Submitting...
  • Rob K. commented  ·  August 18, 2021 3:29 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    There are already a couple of ideas regarding scroll animation and behavior and such. But i think i got an idea to cover all that in one single feature. For now i'm calling it Scroll Position States.

    The idea is that when you make a component from a scroll group this scroll group becomes a special kind of component so the component states can be triggered by scroll position as well. And with the combination of Auto-Animate you can create powerful things with this.

    You could mimic all kind of scroll animations this way, like parallax scrolling, objects appearing or change shape when you scroll down or up, etc... etc..
    When you into Prototype mode to make a new interaction there will be a new trigger called Scroll Position. Selecting this gives you the option to fill in a number. This would could be pixel value or percentage. And then you can set the destination state (or even artboard to go to be able to make even crazier stuff).

    Designing the states would work the same way you do now for components. So nothing new there.

    What do you think?

    Submitting...
  • Neil Stevenson commented  ·  August 3, 2021 5:52 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Hi, I raised this is the XD Adobe Community and I was recommended to post it here:
    Hi guys, love XD. Would viewport animations be doable in the near distant future? At present I have to create invisible hover state items that trigger an animation but could this be achieved by the viewport position. This would be absolutely game-changer and give us all a massive edge. Thank you all.

    Submitting...
  • Aaylajart@gmail.com commented  ·  June 2, 2021 12:22 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    This is a very common pattern in native iOS and Android apps, especially with the top app bar, not to mention many navigation menus on the web. It's also not very easy to "fake" this type of interaction with the existing prototyping functions, so I'd love to see it get its own support.

    Submitting...
  • Vladimir commented  ·  May 20, 2021 12:28 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Scrolling/position for webpages based animations would be awesome.

    Submitting...
  • Lily Taylor commented  ·  April 30, 2021 1:43 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Be able to set the trigger for a poop up ect to be set as scrolling.

    Submitting...
  • Anonymous commented  ·  April 1, 2021 9:34 AM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    So many websites have animations triggered by a scroll, or when an elements comes into view within a browser. XD is crying out for this feature!

    Submitting...
  • Diego commented  ·  March 23, 2021 2:34 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Yes, please add this feature! I am trying to implement a sticky nav that starts out transparent, but then the background fills white on the scroll, but there doesn't seem to be an option to do that.

    Submitting...
  • Wilson Semilio commented  ·  February 17, 2021 2:56 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    Would like to be able to implement this feature as I've seen it on many websites and apps as a nice way of getting more "screen real estate" for content without a top menu getting in the way when it's not needed.

    Submitting...
  • TM commented  ·  February 10, 2021 12:47 PM  ·  Flag as inappropriate  ·  Edit…  ·  Delete…

    There should at least be a way for the nav bar to start just a little lower than the top then stop at the top and stay there as the user scrolls. That's basic.

    Submitting...
← Previous 1 2 3 4 5 Next →

Adobe XD Feedback : Feature Requests & Bugs · UserVoice Terms of Service & Privacy Policy · Adobe Terms of Use · Adobe Privacy Policy