New Facebook UI – Part 1

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.

We’re All Users

User experience, user interface, user centered design; these are all words for what I think about all day. In today’s world they are most often placed in the context of technology and primarily websites, web applications and software.

But, we are all users pretty much all the time. Good user experience impacts us in everything we do, and bad user experience can frustrate or make a chore of almost any task.

This little space in the world is devoted to my encounters with my environment be it virtual or concrete, and how good, or bad, user interface design impacts me.

Life needs a good set of wire frames.

Visio: How Do You Get to v12 with No Page Duplication?

Microsoft Visio is, for better or worse, the primary tool I use for my chosen profession. There are other options, and debates can be had at great length as to the relative merits of them and why one should, or should not abandon Visio. The truth is, I know how to use Visio, I can do almost everything I need or want to in it, and I do not have enough “spare time” to conquer the learning curve of another tool right now.

But this post is not about the wisdom in my choice of tools. It is concerning a phenomenon that I cannot help but think is pretty universal among users of commercial software.  I am just going to use Visio as a handy example.

I am curious how  many of you use one or two software packages for most of your work and find yourselves thinking daily “Does <insert name of publisher here> EVER talk to people who actually use this software?”. In my case this question comes when I want to do the very basic task of duplicating a page in Visio.

For those of you who do not know, Visio uses a tab metaphor for pages much like Excel does for worksheets. Most people that produce wire frames of web sites for example will create a new page for each page of the wire frame and these are each housed on their own tab.

Visio provides nice tools to speed up the propagation of common elements across multiple pages.  You can use backgrounds, or the document stencil to automagically keep elements the same across a range of tabs. However, one of the first things I discovered when I began teaching myself Visio was that there was no built-in function for duplicating an  entire page.

In Visio 2003 (version 11) you could duplicate all of the elements on a page and then paste them into a new page you had inserted. But, lining those elements up in the exact same location became tedious and was less than “user friendly”.  Then Microsoft released Visio 2007 (version 12, seriously version 12?) and guess what … they added a handy little gadget to make it easier to align things when you copy and paste them from page to page … but, no duplicate page feature.

Don’t get me wrong, the little guide points are handy. I use them all the time when duplicating a single element or a group of a few elements from one page to another. But isn’t the idea of copying a page pretty basic functionality?  So I thought it just must be hidden let’s check the Help. Below is an exact quote from the Visio 2007 help file:

Unfortunately, Microsoft Office Visio 2007 does not have a feature for copying pages. You can, however, copy all the shapes on one page to the same location on a new page.

It goes on to have this baffling addition:

Note If you think we should add a “copy page” feature to the next version of Visio, we’d like to know. Just send us a note via the Comment on this Web page form.

Seriously? It occurred to you to ask if we wanted one after you shipped version 12 of the product without one? Has your development team, or user experience team, or software architect, or technical director ever actually used Visio or even interviewed anyone that has?

Before the comments come in explaining that there are Macros out there that will copy pages or questioning what the difference is between copying all the shapes on a page to the same location on another page and duplicating the page is, I know. But trust me, having to deal with macros (many unsigned) is stupid on something so fundamental and until you have worked both with and without a true duplicate feature you will just have to trust me that copying and pasting with guide points is just not the same as duplicating a page.

So now, your turn. Tell me what feature your “favorite” piece of software has managed to leave out even after N number of versions.