Tabs within Tabs

over 5 years ago from Asis Patel, Product Designer at Playground Inc

  • Asis PatelAsis Patel, over 5 years ago

    Thanks guys for your suggestions so far. This is a snapshot of what I am working on...

    The question is If I have a primary tab bar, what do you feel is the best way to display the secondary options?

    All suggestions welcome!

    Thanks, Asis

    0 points
    • Ryan ScottRyan Scott, over 5 years ago

      I like where #2 is headed best. Radio buttons feel out of place, and #1 is a bit confusing color wise. Try to extend the border (with the bg color of the Division tab) on the bottom, left, and right of the selection box - you already have it on the top border. I think that might make it feel more like a child element.

      4 points
    • Hans van de BruggenHans van de Bruggen, over 5 years ago

      Don't think of these as "tabs", think of these as groupings and subgroupings. Depending on what you're trying to do, you may have better results using tabs for one level and another grouping approach for the other.

      Here's an example from a recent project where I needed to do exactly that. The sub groupings show a short preview of the content with a "show more" trigger. Hope this helps.

      0 points
      • Asis PatelAsis Patel, over 5 years ago

        This is a really good suggestion for mobile, however how would this work across tablet and desktop?

        0 points
    • Alex PaxtonAlex Paxton, over 5 years ago

      I think #2 as well. So long as the styles are visually different enough to not be confused, I think it's okay. Ideally that situation wouldn't have to happen but I've run into it myself a number of times.

      0 points