Smooth scrolling is nice, but no good in practice

SmoothScrolling

Smooth scrolling looks nice and all, but it’s not a great experience at all in practice. It’s always behind my machine’s input speed. For instance, on Mac the user has the ability to speed up the Key Repeat Rate: how fast the key that is held down repeats. Someone such as myself has this turned up all the way cause we like to move fast. However, this makes scrolling through your app using the arrow keys a less than desirable experience to say the least. In fact, it starts to get annoying real fast. The app starts to feel sluggish. I’m all about animations and beautiful things, but not at the cost of functionality and performance. By the way, this takes place when scrolling through cards as well with the arrow keys.

Lastly, to top this all off, there’s this round robin/circular scrolling behavior that makes this experience even more disorienting and confusing.

If I could offer an alternative scrolling behavior:

  • The user is at the first element
  • The user can press the up arrow key once and the scroll view would take them to the last element. Note that even if the user held down the up arrow, the app would treat it as a single press event
  • The same behavior would be applied if at the last element and the down arrow key was held or pressed
  • This way you can quickly jump to the last and first element
  • A held down event would only be valid for the up arrow when at the last element
  • A held down event would only be valid for the down arrow when at the first element
  • If at the first element and the down key is held, the app would iterate through all of the elements until the key was released, or the iteration would stop at the last element even if the key is continuing to be held down. This would help avoid confusion and improves confidence
  • If the user let’s go of the down arrow and then pressed it again, they would jump immediately back to the top
  • Same goes when at the last element and holding the up arrow key

In my honest opinion, this is the best scrolling behavior. It’s not confusing or disorienting, and you still get all of the functionality and performance. Pair this with removing the smooth scrolling or at least give the user the option to turn that off.

I know this was long, but I really wanted to bring this to your attention. I hope this gets some serious consideration.

Thanks!

3 Likes

That definitely sounds like a fairly robust UX solution, thank you for laying it out in detail. Can I ask in which screens in particular you found yourself accidentally scrolling past the end and having issues with the scroll wrapping? In testing we (like you) sometimes had issues with wrapping and holding down arrow keys, but in practice most people aren’t actually holding down the arrow keys in order to navigate – at the point where you’re doing that it is almost always more efficient / ergonomic to just use the scroll wheel. In general we have found the arrow keys are most useful when only scrolling a couple items away, and in those cases the smooth scrolling and the naive wrapping solution are usually sufficient / don’t become annoying.

With regards to the smooth scrolling in general though, I think it would be fairly reasonable to add a user preference that will disable this, though a solution we might prefer is just respecting your system’s “reduced motion” settings which are available on all platforms supported by Supernotes.

My pleasure laying that out for ya. I wanted to make sure I explained it well in hopes that it gets some serious consideration. :wink:

It’s particularly bad with menus and the like such as the command palette and the forward slash menu. However, if I know about how low in the list of cards a specific note I’m navigating to is, I can scroll right to it. But with this smooth scrolling, there’s a big lag. It can’t keep up with how fast my key repeats. It’s more loyal to that than my input which doesn’t feel good.

I don’t mean to be argumentative at all, just curious: how do you know if most people are holding certain keys down or not? Are you tracking this behavior? How did you find that arrow keys are most useful when only scrolling a couple of items away? I’ve never heard of this before. I actually find it more ergonomic when I don’t have to touch my trackpad/mouse. lol Keyboard shortcuts for the win!

As far as the smooth scrolling goes, I’d rather not turn on reduced motion for my entire system as I like most animations around the system. It’s done right in most apps. In Supernotes, this particular approach of just having smooth scrolling everywhere is unnecessary and slow, like trying to be too fancy where it doesn’t need to be or dressing in a tuxedo to go help someone move (a bit exaggerated lol). But, where I find smooth scrolling makes a ton of sense is if I used the ⌘ + ↓ or ⌥ + ↓ to get the the very bottom of my content. The reason is if an app just jumps immediately without scrolling itself to the bottom, it can be very jolting and a bit confusing and now there could be loss of context for a moment. Smooth scrolling is perfect in that scenario. If not all, in most other cases the scrolling itself (natural speed of your system) is the animation. Piling smooth scrolling on top of that is an extra layer that isn’t really needed and actually diminishes the experience (significantly to in my honest opinion).

The smooth scrolling animation of the card in the home page also has this problem

1 Like