TweetDeck for Android: UX explorations

August 12th, 2010

TweetDeck for Android is now available for beta testing, and it sports a very polished and responsive user interface. While i didn’t have a chance to spend a lot of time, i’ve noticed a few very interesting explorations in the UX space that aim to address the limited form factor of mobile devices.

As usual, your timeline is presented as an infinitely scrolling list of tweets, with thumbnails next to the texts. However, TweetDeck opts to omit information that can only clutter the screen, omitting information usually displayed by other mobile clients: the time stamp and the client name. The time stamp is displayed in the title bar and is changed as your scrolling your timeline. The client name is not displayed at all – a good decision, in my view, given that it is of little value beyond the fleeting “who uses what” curiosity.

Next up – scrolling. The stock user experience for scrolling is to fade a thing scroll thumb along the right edge of the scroll view. This shows the current position in the list, and at the same time does not add UI clutter when the view is not moving. TweetDeck features an interesting exploration in this area – the right edge displays a permanent gutter overlay that shows your current position. As long as you’re close to the top, it does not add too much visual noise; as you’re scrolling down to earlier tweets, it shows important visual information how far along you are.

Finally, switching between your timeline, replies and direct messages combines two existing UX paradigms found elsewhere on the platform. Swiping left or right switches to the adjacent column with no extra two clicks required in the official Twitter client. To indicate that the screen is “swipeable” in this fashion, the title bar shows small bevel circular icons that look much like the home screen indicators from the stock Android UI.

The next screenshot illustrates how TweetDeck does notifications. When one of your columns gets new tweets, the UI is updated with the main highlight color (saturated yellow). The highlights are displayed in the right gutter – giving indication how many new tweets were loaded, and how far higher they are relative to your current position in the list. The title text (timestamp or the generic title) turn yellow as well. In addition, if the new tweets are not in the currently displayed column (say, you’re in your main timeline, and just got a new direct message), the circular icon that corresponds to that column is painted using the yellow color as well. Once you’ve swiped to the relevant column and scrolled to reveal the unread tweets, the highlighting is gone.

Using a strong saturated color in the otherwise grayscale UI works great for drawing your attention to the new updates. In my view this works better than a more intrusive “you have X new tweets” messages displayed in header / footer bars of other clients. But this is not the only nice thing about TweetDeck notifications. As long as the updates arrive while it is the fronted app, TweetDeck is not going to push any system-wide notifications to the status bar. This is a great UX decision that decreases the overall visual noise and keeps me “immersed” in the application.

I’ve only used TweetDeck for a couple of hours today, and it’s too early to say if these UX decisions will pass the test of time. However, i’m very impressed with the amount of attention that went into designing and implementing this client.