is a blog about design, technology and culture written by Khoi Vinh, and has been more or less continuously published since December 2000 in New York City. Khoi is currently Principal Designer at Adobe. Previously, Khoi was co-founder and CEO of Mixel (acquired in 2013), Design Director of The New York Times Online, and co-founder of the design studio Behavior, LLC. He is the author of “How They Got There: Interviews with Digital Designers About Their Careers”and “Ordering Disorder: Grid Principles for Web Design,” and was named one of Fast Company’s “fifty most influential designers in America.” Khoi lives in Crown Heights, Brooklyn with his wife and three children.
First, there’s the ‘favorites’ approach, which is in evidence on My Space and Flickr, in which the page (or pages) representing your account features a list of friends alongside your own content. Clicking on a link for one of your network friends takes you out of your account and into ‘communal space’ — a public version of your friend’s page that’s outside of your own account. In essence, your network is represented as a list of links or bookmarks and little more; aside from a preliminary meta view that may be available from within your account, the information your contacts produce isn’t deeply integrated with your own.
The second model is the ‘collection’ approach, perhaps best seen in action at LinkedIn. Network contacts are effectively incorporated into your own account under an explicit section — most commonly expressed in visual language as a tab — that might be called something like “Your Contacts” or “Friends.” When clicked on, a spatial consistency is maintained, a visual indication that though you’re viewing someone else’s information, you are in fact still within your own account. This approach seems best suited for cases in which your friends’ information needs to intermingle with or sit adjacent to your own without too greatly blurring the distinction between the two. Basically, your friends’ information is rendered as just a subset of your own.
Back Is the Only Way Forward
What’s curious to me about both of these approaches is that, as the two most prevalent interaction models for accessing network contacts, they both rely so heavily on the browser’s ‘back’ button: viewing a contact’s information usually removes every instance of your list of network contacts from the screen. Aside from the back button, there’s usually no visible navigation at all, so that it’s somewhat cumbersome to do a quick survey of all your contacts’ latest information and updates.
Or maybe “cumbersome” is just a matter of my own personal preference. It could be that the fact that almost all of the social networking sites I’ve looked at rely so heavily on the ‘back’ button is actually an indication of some deeper truth in the way users interact with this information. Maybe clicking on ‘back’ really is the simplest, most straightforward navigation possible. Note: I’m certainly not a critic of the ‘back’ button, either. In fact, I’m a firm believer in its integral role in Web design.
From Friend to Friend
Still, it’s always struck me as odd to me to rely on ‘back’ so exclusively, especially when it seems to preclude a pretty natural interaction model that I think most users would want. Wouldn’t it be handy, for example, to be able to quickly survey the latest photos from a subset of your Flickr contacts? Flickr’s meta view (“Photos from Your Contacts”) offers a combined view from all of your contacts through its Web interface, of course. But let’s say you want to view only about half of them, and they’re scattered amongst the list of all your contacts (i.e., not arranged in the sequence you’d like to view them); wouldn’t it be preferable to click through some sort of on-page, comprehensive navigation, rather than continually hitting the ‘back’ button?
For an example of the kind of contacts navigation I’m talking about, look to the one social networking application where I could find it: Newsvine. That site’s “watchlist” appears persistently in the left-hand navigation, and it makes selectively moving from contact to contact a breeze. It’s possible to use the ‘back’ button, of course, but it’s hardly necessary at all.
In fact, the best way to replicate this model with Flickr would be to grab the RSS feed for each of my contacts and deposit them, one after another, in a folder within my feed reader of choice, NetNewsWire. Which is fine, of course; one of the reasons that Flickr is such a successful user experience is because its support for feeds and external programming via APIs is so malleable. But it’s a sign of a missing interaction element, isn’t it, when Flickr needs to send users outside of its own application to satisfy a user goal that, on its face anyway, seems fairly mainstream?
Is It Just Me?
Again, I could be wrong about this whole thing; the rather conspicuous absence of persistent contact navigation does seem to be indicative of something; perhaps the complexity of a feature like Newsvine’s ‘watchlist’ brings with it too many problems — most likely with scalability — that don’t make it appreciably more desirable than simply asking users to use the ‘back’ button, which is a feature that, admittedly, everyone uses. For me, though, I know I’d like Flickr and other social networking sites much more if I could just go from friend to friend. It’s about people, after all, ain’t it? Why not just keep a list of all your friends on a page when viewing any one of them?
I don’t have my Flickr contacts listed one-after-another on Netnewswire (as you suggest might aproximate the Newsvine feature), however I do use their RSS feed that, in a “river of photos” fashion, displays all of my Flickr-friends’ posts. However, as you suggest, this is not a very scalable option if you’ve got a lot of photo-happy friends.
Users of these social applications no doubt enjoy the serendipidous nature of “sideways browsing”; it’s a game neverending. A browsing path through comments, sets, streams, groups, pools, ‘interestingness’ and popularity is well suited to users in a ‘discovery’ frame of mind.
I can’t speak for MySpace as I’m not a user but on Flickr, when I want to browse from contact to contact, I never use the back button. It’s middle-click all the way. Load up the contacts page either directly or in a sidebar and those tabs multiply like rabbits.
To add another option for structured navigation overarching the experience would be of limited value in my opinion, but that’s not to say it wouldn’t be useful for some. But in my case that particular navigational paradigm is well catered for, outside of the site’s navigational structure.
I can accept that catering for certain interaction models that might occur outside of the site’s navigation is something that’s going to become an increasingly important part of any site’s information architecture. For social software to become truly robust and fully integrated into users’ lives, it’s going to need a life outside of the browser, even further outside than the browser tab setup you’re using.
That said, such a strategy seems, for now, to be largely the province of advanced users. Less advanced users — those interacting with Flickr, say, on Internet Explorer — don’t (currently) have tabs, and they don’t have particularly useful RSS tools. And I really think the scenario that I’m describing — in which users go from friend to friend within their network — is or can be one that we can reasonably expect ‘average’ users to follow.
All of which just reiterates what I said in my post: it seems like this kind of interaction should be built right into the software/site itself.
I’d like to echo Adam: using tabs has really been the answer for me. Not only does it help to keep a persistent set of links on one page (even a long one) for social networking sites, but it helps for dealing with any set of search results.
I hear with you, Khoi–a lot of people still haven’t been exposed to tabs. Some type of functionality to enable the type of navigation you reference would be helpful…especially the ability to put a Watch List on sites. My only fear is the degree to watch a site should allow monitoring when its users’ content is so personal in nature. For instance, would it be appropriate for myspace to alert you when someone’s relationship status goes from “In a relationship” to “single”? By avoiding “watches,” questions of privacy don’t have to be addressed.
A couple other things:
On Friendster, they have a list on your home screen that points out which friends have added pictures or updated their profiles.
On some social sites I’ve seen the content for many “tabs” get loaded AJAX-style in advance so that you can quickly navigate between others’ content and yours by using the site’s tabs…but not have to deal with hitting back and have a query or content refresh/reload.
One factor about our Watchlist on Newsvine is that it is quite expensive from a processing standpoint. I doubt that’s the reason sites like MySpace don’t use it, but it does keep you from caching as much of the page on the server as you’d like to. That said, I think it’s worth it. Especially when you have the ability to basically hide everything on there unless there are “new items” associated with that contact.
Tim
It might be important to realize that providing a watchlist has some consequences for the overall design of a site.
While it might be handy to have tools like a watchlist within reach while browsing other users’ content, this implies that there is some space reserved for the graphical representation of these tools.
So for sites like Flickr it’s a tradeoff between making room for content (large pictures etc.) and offering convenience features.
LiveJournal has had this feature for a very long time.
An integral part of the website is a user’s “Friends Page” which lists all posts made by friends in reverse-chronological order, interleaved. Users can also add external RSS feeds to their friends page, if they want to use livejournal as their aggregator. These too are interleaved with other users’ posts. A feature of the Friends Page is the ability to make ‘groups’ of friends, and the user can choose which group they want to see, or if they want to see all of their friends’ posts. A user can appear in more than one group — so you can make a Technology group, a People I Know In Real Life group, People Who Don’t Post Way Too Much etc.
For instance, this is my friends page: http://wetzel.livejournal.com/friends/
I’ve set it up to show 30 posts per page, but it’s customizable. Only I can see my friends groups, the outside world can only see all of my friends’ posts at once.
I think it’s perfectly sensible within any social software environment to provide an overarching framework for lateral navigation among friends. As you point out, many sites have these to some degree or another, while others are sorely lacking. But my question is, how do you design for navigation among your friends’ friends within this pardadigm? I call this “sub-lateral navigation” for lack of a better term. Does the user break out of the overarching framework in this scenario? Does it disappear or get grayed out? Does it matter?
I agree, and addition, I’d like to see better visual representations of how your contacts are connected to each other. Wouldn’t that be cool?
I don’t have my Flickr contacts listed one-after-another on Netnewswire (as you suggest might aproximate the Newsvine feature), however I do use their RSS feed that, in a “river of photos” fashion, displays all of my Flickr-friends’ posts. However, as you suggest, this is not a very scalable option if you’ve got a lot of photo-happy friends.
Users of these social applications no doubt enjoy the serendipidous nature of “sideways browsing”; it’s a game neverending. A browsing path through comments, sets, streams, groups, pools, ‘interestingness’ and popularity is well suited to users in a ‘discovery’ frame of mind.
I can’t speak for MySpace as I’m not a user but on Flickr, when I want to browse from contact to contact, I never use the back button. It’s middle-click all the way. Load up the contacts page either directly or in a sidebar and those tabs multiply like rabbits.
To add another option for structured navigation overarching the experience would be of limited value in my opinion, but that’s not to say it wouldn’t be useful for some. But in my case that particular navigational paradigm is well catered for, outside of the site’s navigational structure.
I can accept that catering for certain interaction models that might occur outside of the site’s navigation is something that’s going to become an increasingly important part of any site’s information architecture. For social software to become truly robust and fully integrated into users’ lives, it’s going to need a life outside of the browser, even further outside than the browser tab setup you’re using.
That said, such a strategy seems, for now, to be largely the province of advanced users. Less advanced users — those interacting with Flickr, say, on Internet Explorer — don’t (currently) have tabs, and they don’t have particularly useful RSS tools. And I really think the scenario that I’m describing — in which users go from friend to friend within their network — is or can be one that we can reasonably expect ‘average’ users to follow.
All of which just reiterates what I said in my post: it seems like this kind of interaction should be built right into the software/site itself.
I’d like to echo Adam: using tabs has really been the answer for me. Not only does it help to keep a persistent set of links on one page (even a long one) for social networking sites, but it helps for dealing with any set of search results.
I hear with you, Khoi–a lot of people still haven’t been exposed to tabs. Some type of functionality to enable the type of navigation you reference would be helpful…especially the ability to put a Watch List on sites. My only fear is the degree to watch a site should allow monitoring when its users’ content is so personal in nature. For instance, would it be appropriate for myspace to alert you when someone’s relationship status goes from “In a relationship” to “single”? By avoiding “watches,” questions of privacy don’t have to be addressed.
A couple other things:
On Friendster, they have a list on your home screen that points out which friends have added pictures or updated their profiles.
On some social sites I’ve seen the content for many “tabs” get loaded AJAX-style in advance so that you can quickly navigate between others’ content and yours by using the site’s tabs…but not have to deal with hitting back and have a query or content refresh/reload.
One factor about our Watchlist on Newsvine is that it is quite expensive from a processing standpoint. I doubt that’s the reason sites like MySpace don’t use it, but it does keep you from caching as much of the page on the server as you’d like to. That said, I think it’s worth it. Especially when you have the ability to basically hide everything on there unless there are “new items” associated with that contact.
It might be important to realize that providing a watchlist has some consequences for the overall design of a site.
While it might be handy to have tools like a watchlist within reach while browsing other users’ content, this implies that there is some space reserved for the graphical representation of these tools.
So for sites like Flickr it’s a tradeoff between making room for content (large pictures etc.) and offering convenience features.
LiveJournal has had this feature for a very long time.
An integral part of the website is a user’s “Friends Page” which lists all posts made by friends in reverse-chronological order, interleaved. Users can also add external RSS feeds to their friends page, if they want to use livejournal as their aggregator. These too are interleaved with other users’ posts. A feature of the Friends Page is the ability to make ‘groups’ of friends, and the user can choose which group they want to see, or if they want to see all of their friends’ posts. A user can appear in more than one group — so you can make a Technology group, a People I Know In Real Life group, People Who Don’t Post Way Too Much etc.
For instance, this is my friends page:
http://wetzel.livejournal.com/friends/
I’ve set it up to show 30 posts per page, but it’s customizable. Only I can see my friends groups, the outside world can only see all of my friends’ posts at once.
I think it’s perfectly sensible within any social software environment to provide an overarching framework for lateral navigation among friends. As you point out, many sites have these to some degree or another, while others are sorely lacking. But my question is, how do you design for navigation among your friends’ friends within this pardadigm? I call this “sub-lateral navigation” for lack of a better term. Does the user break out of the overarching framework in this scenario? Does it disappear or get grayed out? Does it matter?