Well hello there! A while ago, I posted the first installment of this series, “Iterations of a web site“. If you haven’t seen it, it’s pretty fun. Today, let’s focus on a different page, the dashboard – the page where signed-in users start. We will pick up where we left off in that article:
October 20th, 2010: I had forgotten how bad that page once was. It’s so bad, I’m not even sure there’s a way to complete your task from the web site.
October 30st, 2010: Looking a little better. This time we introduced the right sidebar that would feature prominently into the rest of our designs. Note the “Add a Task” bar at the top of the screen, statistics (that didn’t work yet), and a helpful suggestion that I have things to do. Nice.
November 2nd, 2010: Jon embarked on a quest to make our site look more like a major questions and answer site that shall remain nameless. Even so, the guts of this page remained the same. Interesting note, this was the first version of the site that went out to our initial testers (i.e. Jon’s wife and my girlfriend). At this time, we thought we were pretty hot stuff. I’m not sure we learned our lesson.
November 17, 2010: Oh yeah, I forgot. At this time, we didn’t have passwords. If you didn’t have Facebook, the only way you could log in was to have a new password sent to your e-mail. And, you couldn’t be simultaneously logged in on multiple computers. Good times. As for the actual design, there are a lot of small things that changed by this time, including a new logo.
December 1st, 2010: Big day for the site! Today we rolled out the first design of our site that wasn’t by us. We started a design contest through 99 designs, a design crowd-sourcing site. You can see our contest winner (left), and the the way our actual site ended up looking (right). We liked what we got, but didn’t feel like it conveyed the right information to end users. We had a vision for the future of the site that we had not communicated well.
January 26th, 2010: So that was our site for a while. We enjoyed what our designers gave us, and ran with it for almost two months with minimal changes to the layout. In the past couple days, we have been at it again, playing with different styles in an attempt to make our site look lighter and less overwhelming. You can see some other features cropping up – search, like buttons, tags.
Our dashboard page has undergone a different set of pressures than the landing page. In the early days, its only goal was to display a user’s tasks. As time has gone on, users have more options for interacting with the site, and the dashboard starts to reflect all of these options.
You can edit your tasks now. See other peoples’ activities. Comment on and share your tasks. Like them. Suggest some to others. As each successive feature gets added, the dashboard page grows a little heavier. Every so often, we try to hide or delete as much as possible and then restart the cycle. Such is the life of the page.
Looked carefully at Facebook recently? On my current home page, I can post five different things, find friends, see three upcoming events and birthdays, look at ten comments on five photos, see three different groups, two apps, chat, see four questions, search, and that’s not even all; there are eight links to “See All” or “More”. People don’t really notice, though, because Facebook is generally excellent at First, Second, and Third reads. If you load up Facebook, chances are you’re focused on the feed and tune out everything in the periphery – your unread messages, the advertisements, and the many links on the sidebar.
As a programmer, I fight feature bloat – the tendency to add more code to a project. As a designer, I am fighting a visual sort of feature bloat. The way to manage a large codebase is to organize code to become more modular, and I think a similar approach works in design. Organize a strong hierarchy of visual components for pages where the tendency is to pack more and more information in. This way, when new features come up, there’s generally a clear place to stick them to ensure their appropriate level of user-relevance.
Hope you enjoyed this series. If you haven’t, yet, go check out the real thing!
