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'm looking for other ideas to give a grid box (which contain an image with its title) a better user experience, make it easy to use. I think some people can't find out that they should hover and then click on the image to see the full post.

This is a step-by-step tutorial blog, imagine a food blog. I displayed the first page of the blog layout, which the boxes contain the latest posts, with their thumbnail and title. There are several line of boxes, with different widths. There is no problem with a wide width box, (3 box each 30%, or two box each 48% width), I can easily put the title under the thumbnail. The problem is when the boxes have a width about 20%, for example when I put 4 boxes in a line, as showed in the above image. Then I can't put the title under the thumb, because it will give the box a bad view (it will break to many lines)

I found two ideas for my grid box layout design. The first idea is better for when the boxes have a wider width:

first idea

That wasn't suitable when there are more boxes in a line, so there is another idea:

the second idea

So I need ideas, to put several boxes in a row.

share|improve this question
    
This is way too vague to have an answer. What is the actual problem you are trying to solve here? What is the use case? Who are your users? What is the content? –  DA01 Nov 4 '13 at 5:52
    
I added some information –  Farzad Bayan Nov 4 '13 at 10:47

2 Answers 2

Something that I have learned from years of user testing: Users do not like hover reveals. If you have a grid of options and hide the titles, then the user has to roll over every item on the grid to evaluate the right choice forward. Thats a lot of cognitive load.

Users scan, they don't read. And they definitely miss content that is hidden from their view. I would look for a solution that does not require interaction to reveal the information necessary to pick between choices.

And apologies for all NN/G links, they were simply the easiest ones I could find that would back up my own experience (since the vast majority of my research is proprietary to someone else).

share|improve this answer

The user experience is largely affected by how many boxes you show. Find out the right number to show and where and how to place them before designing them in detail. But besides that, an idea when using smaller boxes could be using a transparent overlay for the title:

enter image description here

share|improve this answer

Your Answer

 
discard

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

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