Showing preview rows of content types vs picking a default type and showing it in full?

Question

I'm trying to figure out what would be a better experience. We have 3 "types" of content usually, in this case let's say they are photos on user profiles.

Is it better to show a row of each type with a see all button to see all of the content or is it better to choose a default type and display that, and let users navigate through the other types with tabs?

More info: They are photo uploads and favorites on a user profile. Public albums (user uploaded), private albums (only friends can see but the album cover image is visible to all), favorite photos (favorites from other users)

^{download bmml source – Wireframes created with Balsamiq Mockups}

^{download bmml source}

Answer 1

Both models have some pros and cons.

The First Model is used by Apple's App Store and works well but this model actually takes you to a new page where you get to see all images, and if you wanted to see the other gallery, you would need to hit back button to access other two categories. Second Model is better in the sense that it makes you feel as if you were on the same page while switching between the tabs.

On the other hand, First model seems to be better considering that you are teasing your user with a small bit of interesting information from each section, and the user is able to see bit of every section, and he/she would go for the one which interests him/her the most. Sounds good too.

Providing choices in the beginning is good as well as bad in a way. Good because you were able to pick a path that seemed right the first place — but at the same time, when you picked one out of three gallerias, you left 66% and went for 33% of available choices. What is the likelihood that you would want to revisit your decision and go back to the other two sections before finishing your picked section? For the first model, there will be an urge to check other sections out. Considering the Second Model, such urge wouldn't be there. Also one gallery was pre-selected for you so so if you have to make a choice, you have to pick one out of the two options instead of the three options of the first model — and at the same time, you have seen first default gallery considerably more.

Concluding: I would recommend to use the Second Model as it has the following good aspects:

• The user doesn't move between pages.
• The user is able to browse a section without having to make a choice.
• The user has fewer options to choose from, and decision making would be rather easy.
• Considering the bandwidth and download performance, Option Two is slightly more expensive but payoff is considerably more.

Answer 2

How about something like this wherein the headers and a preview pic or 2 are shown then there is a visual indicator of 'more'. Clicking the indicator expands the selected folder down revealing a grid view. This way the user sees a header title, a representative segment of the album (maybe newest, or most viewed items) then the content can be lazy loaded or preloaded and revealed.

In this usage you may find it more appealing visually to have the same number of columns as expected categories so the preview set lines up with the column under it after expanding.

~EDIT~ Including further explanation per below comments:

In my layout the initial page load would already have a small subset in preview under the category header which would immediately let the user know what might be inside that set without revealing the entirety of the folder. Visually the category boxes would need to be delimited from the content box by way of either a border or color variation. That way the currently active box would connect to the content frame and it's subset would flow into the open folder.

Answer 3

I would go with the first design. The one with a sneak peek of the three streams. Reason being:

• It gives an overview of all the three different types of photo streams in a single view to the user. It is also combining the second design by virtue of the 'See All' button.

• The user can decide if he wants to focus on any particular stream and press the 'See All' button. The reverse is not possible in the second design i.e. cannot go from a detailed view of a stream to the overview of the stream.

• Unless there is a ton of other content besides these streams, showing three different streams can seem to add a subtle form of variety in content compared to the monotony of seeing a single stream.

• You can add a scroll-bar/carousel to the streams so the user is not limited to the content visible in a single view of the stream.