Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I am designing a multiple tab system to replace an accordion. Each section of the accordion now holds a tab system with lists.

I mocked a solution, but have no contact with final user to run the two options I have in mind:

1) Product description on the left, Link1 (the tabbed system on the right). When user choses Link2 or Link3 from the menu, the chosen list would replace List 1.

2) Make all the Lists static and have the page scroll.

What would create a better UX?

Attached the mock on balsamiq.

enter image description here

share|improve this question
    
Related: We've had some other questions about multiple levels of tabs too, like: ux.stackexchange.com/questions/21912/… –  Ben Brocka Oct 17 '12 at 18:43
    
I'm not sure I understand your design... So the top right corner is dynamic but the two lists at the bottom always remain the same? What kind of website is this? Is there really a need to have all four boxes on a single page (especially since the bottom two are below the fold)? Will users really need to see the general info, List 2 - Tab 3, List 4 - Tab 1 and List 5 Tab 6 at the same time? Why do you need to replace the accordion? Would be great if you updated the question with more info. –  Vitaly Mijiritsky Oct 18 '12 at 6:27
add comment

1 Answer

up vote 0 down vote accepted

Brisa,

The issue i see with your design is that the link 1 is located too far from the content that it displays. If i understood your design correctly, when you click link 1, only the right part of the screen will re-render to show the content.

I would suggest considering vertical tabs, for Link1, Link2... This way user will easier navigate thru the content.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.