• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Implemented Scrollable tabs

Alfa1

Well-known member
#1
upload_2016-11-13_14-52-15.png
A problematic functional design issue in XenForo is the abundant use of tabs, which are hidden on small screens. 70% of our users are on mobile these days so this poses a challenge. The current way of handling tabs hides most of the content available to the majority of our users.

If a site has multiple addons then /find-new/ and profile look like a wall of bricks:
upload_2016-11-13_14-41-38.png
upload_2016-11-13_14-37-26.png
This is not intuitive nor good UXD.

A method that this issue is handled in successful apps is the use of horizontally rotating tabs. You can see it in action in many apps, like the BBC News App for example.
This method allows the mobile users to swipe and rotate tabs in an intuitive way. This could be implemented for small screens only or enable mouse scrolling to rotate.

Here are some examples:
http://horizon-swiper.sebsauer.de/
http://jquery-plugins.net/tag/horizontal-scroller
upload_2016-11-13_15-9-47.png
 

Attachments

#4
I've seen this functionality on numerous sites lately, and I have to agree it works much better than a list of tabs.

That being said, I've also seen this done in a way that is terrible for the user. It needs to be self explanatory for the user. The current solution isn't the best, but it's easy to use and understandable. Many users may not recognize the ability to scroll back and forth for tabs.

Just my two cents, but I think this is a good idea if it can be implemented in an easy to understand way.
 

RobinHood

Well-known member
#5
I like the idea of scrollable tabs, but Matthew is right. Often scrollable table will be implemented, but there's not indication of this to the user so it doesn't get used and the user gets frustrated because they can't just see what they're looking for in front of them.


More importantly though for content discovery, I would like to see a way to display how many new items of each content type are visible against each tab. Similar to @Chris D's unread post count in the sub nav menu.

These highlighted number agains each content type would act as call to actions for users checking the 'New Posts' page for all new content.

A wall of content type tabs (or a long scrollable bar) is useless if the user doesn't know if there's actually anything new to look at on that tab since their last visit before clicking on it.