Posts Tagged ‘facebook’

New Facebook UI – Part 1

February 17, 2010

Inevitably the cycle continues. Facebook rolls out a new UI and the “I HATE THE NEW FACEBOOK!!!!1” groups form. People complain, get lost, bazillions of new users register who do not know any history and, as they say, the beat goes on.

The latest UI changes were  relatively dramatic, and honestly, the way I use Facebook, did not really impact me all that much. However, there are a few things that give me pause and make me question how much user testing they really do.  So, I am going to do a  series of posts over the next few days raising these issues and seeking input. We all get better at what we do by interaction with others. If there is one thing I have learned in my chosen profession it is that just because a UI decision seems misguided to me, it is not therefore automatically misguided.

So first of all, let’s look at a little secondary navigation/functionality change on the left side of a logged in user’s Home Page:

New Home Page

You can see here that they have added on the left side a Friend’s Online list. This replaces the much smaller thumbnail grid from previous versions and adds the benefit of seeing which of these friend’s are active and which are idle.

On the face of it this is a nice addition to the Home Page. Previously this information was hidden out of view in the chat tab that expands from the lower right of the page.

So, what’s the problem here? Well, in my opinion it is an expected behavior issue with the “See All” link at the bottom of the list.

See All Link

This little link (outlined in screen grab above), promises to reveal to the user the list of all friend’s online.  One might expect, since there is inevitably a lot of open “screen real estate” below the list, that clicking on this would cause the list to expand (or be revealed) to full in place.

However, this is not what happens.

Inexplicably when the user clicks on “See All” the previously mentioned chat tab, that resides on the opposite side of the page expands.

Chat Tab

Why? What possible purpose does it serve to force me to shift my focus across the page, and off of the list that already contains not only a subset of the information I am requesting, but also the functionality to reveal and/or hide the entire set.

Immediately above the Friends Online section is a miscellaneous navigation link section that has a “More” link at the bottom. When clicked everything slides down to reveal the rest of the list.  This means to me there should be no technical constraint or issue with that kind of functionality being baked into the Friends Online list.

Now, careful examination (you will have to go to Facebook; the images are too small to see these details) will show that the above referenced “More” link has a small arrow next to it that points down. This is standard for accordion menu functionality and works as expected. Further examination will reveal that the “See All” link we are discussing has a completely different looking arrow that points to the right. Perhaps this is intended to clue the user in to the fact that the chat tab is going to open when they click it.  However, if we look a little above the Friends Online list to the link for “Marketplace” we see the same little arrow used for the “See All” link. But this time when clicked it navigates us completely away from the Home Page and takes to the landing page for Facebook Marketplace. The “Causes” link is treated and functions the same way.

So, is this a huge UI blunder? No, not really, but it is a bit of a puzzlement. I welcome anyone else’s take on why this was designed and executed this way.