Display Items in 2-Dimensional Grid by Row or by Column?

Question

I need to display a number of Contacts in a grid and they sorted by name. Should they flow from left to right in rows? Or from top to bottom in columns?

Although my examples don't illustrate it, the user will be able to vertically scroll the view if they have many Contacts. Does the scroll direction play into this decision?

Left to Right

Top to Bottom

Answer 1

If you want to scroll vertical you should use the first option, left to right. That way you always have all the icons sorted alphabetically and the user does not have to scroll up and down when searching for a name. For example if contacts with a C starts all the way down and continues on top, the user first scrolls down, finds out it isn't there and has to scroll to the top to continue searching through the C's.

And, more importantly, it is that way on my phone and I think on most (if not all) phones so the user will be familiar with it.

Answer 2

Left to right is probably the most common way to solve this, mainly because if the user is scanning the objects by using their alphabetical sorting, less scrolling is needed. In your cases, left to right allows up to 20 items starting with "a" to be visible at the same time, but top to bottom only allows 5 items to be visible before scrolling is needed. Further, the same applies to when the user wants to continue to check objects that starts with "b" and so on...

Answer 3

Left to right on a row then down to the next row is the natural way of reading for most people (excluding asian, arabic or other "non-standard" languages). It's actually like reading a book, but if you want to list contacts or any kind of common data/information, it would be better to use a vertical scrolling list, arranged alphabetically, and not a grid

:) Aname 1
:P Bname 2
:D Cname 3
...

Answer 4

I would expect this to be dependent on the scroll direction, if I scroll from left to right (===>), I would expect contacts to be sorted alphabetically from top to bottom, so my scrolling always moves me ahead in the alphabet.

If I scroll from top to bottom, I would expect the contacts to be sorted from left to right for the same reason.