What is it?
This is a pattern found in the Shazam iOS app. A hidden scrollbar flashes briefly when a user navigates to 'Related' screen. This subtle interaction indicates that the view is scrollable.
How does this interaction or pattern work?
The Shazam app has several master views. One of those views is the "Song" detail. This detail has several sub-views that can be navigated with a tab-bar control placed at the top.
The last sub-view of the 'Song' detail is the 'Related" view. This particular screen is a list of related songs to the one you are currently browsing.
When a user navigates to the 'Related' view, the screen shows the hidden scrollbar for a brief moment.
At the time of this writing, we couldn't determine if this behavior is intentional. Since it only occurs in this particular view, there's a chance that this behavior is a side-effect of some event that is firing the scroll in the background.
However, it's also possible that this a test or a small experiment to enhance scrolling discovery.
Either way, we felt that this pattern could benefit designers/developers dealing working on scrollable views.
How does it help or delight the user?
As mentioned before, there's a chance that Shazam didn't intentionally create this behavior. However, this is particular interaction could be very helpful with the discoverability of scrollable views.
In some instances, mobile screens show dominant elements that could distract users from discovering content that lives below the screen fold. Flashing the scrollbar can help users to understand that there's relevant content or interaction hidden below.
This interaction can also be helpful for fixed width or height elements like toolbars or multi-tab controls.
This interaction can also be helpful in websites with scrollable fixed elements like sidebars or floating views. This effect could be achieved with a tiny scroll movement after loading the page.
Click the heart to save to your favorites