3

I am designing a mobile application for enterprise , so for desktop view we are using tabs as you can see in the image below. I want to design the same for mobile, so if we use carousal tab navigation we have to swipe to reach last tab and it can be less discoverable.

enter image description here

Mobile views

  1. Carousal tab navigation

enter image description here

  1. Tab with more dropdown

enter image description here

So wanted to know if there's any better alternative to this?

| improve this question | |
1

There are several different possibilities to place the dashboards. The most suitable control may vary depending on the context.

  • Carousel tabs: Allow you to quickly switch between 2-3 options, other options are hidden. In general, tabs keep the options visible at all times which makes it quick and easy to switch between options. On the other hand the take up valuable space.

  • Tabs with "more" dropdown: Quickly switch between the 2 most common actions, all other options are hidden. If a user is not used to carousel tabs, then they might discover the hidden options more easily with the dropdown. Also differentiates between "common" dashboards (the ones on tabs) and not so important ones (in the dropdown). This might not be suitable if you want to convey them as equally important.

  • A single dropdown: All options are equally important, the dropdown possibly takes less space than a tab-bar but only the selected option is initially visible. All other options are invisible but again, discoverability shouldn't be that big of a deal, since dropdowns are commonly used. Switching options always requires 2 taps/clicks. If you decide to use a dropdown, make sure to read these guidelines from Nielsen Norman Group first.

  • A burger menu: Burger button in one of your top corners which opens a menu on click/tap. Might use less space than all above options but also hides the dashboard selection mechanism completely from your initial screen, which results in a worse discoverability (Hamburger menus).

For more information and inspiration, I recommend this article about Basic Patterns for Mobile Navigation.

To summarize: Be aware that different controls might be suitable for different situations. Think about your specific situation here before you look for an appropriate solution. Discoverability is only one factor of the equation; you could also consider visual weight/"importance" of those options, are there options more commonly used than others, number of clicks, screen real estate, internal consistency (consistency within your app), external consistency (consistency to other similar apps) etc.

| improve this answer | |
0

Hmm, it depends how much information the widget will present, but using one in 100% is a lot of space:

  1. You can use that type of controls, for give opportunity to user to select, displaying the list as it suits him.

enter image description here

  1. As of Tabs - according to material design, so the practice you have used is not necessarily appropriate in this system design:

enter image description here enter image description here

| improve this answer | |
  • Hi the widget is just for dummy body. I just wanted to know which will be better options - carousal or more dropdown based on discoverability. – Ashish Mohan Nov 20 '19 at 9:58
  • Carousal - in my bank UI it's to carousal – Piotr Żak Nov 20 '19 at 11:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.