An Alternative UI for Public and Private Timelines

I decided to spend a few hours creating an alternative timeline client. Timeline clients are great for interacting with applications like Twitter and Facebook.  If you are going to critique, and I hope you do, please think functionality over style. I am calling the application “TwitterTime“.

TwitterTime

Using the Dashboard Controls of TwitterTime I can determine what is happening in my network, and then focus my attention on specific messages using the Timeline Controls.

Breaking Down the Components

The Dashboard

The dashboard represents an overview of the information and people I am following. The control highlights 4 key types of information: time, messages, people and location and I simplify the data by only showing it in aggregate.

Retweet Activity Widget

The Retweet Activity Widget track all retweets by the people that I follow over a 24 hour period. Hovering on the graph shows the user and the retweeted message, clicking creates a TimeLine. These can also be filtered by location

Term Tracking Activity Widget

The Term Tracking Activity Widget displays the global activity of all terms and phrases, I’m following. I can pick an individual term by selecting it from the Terms Drop Down. Hovering on the graph displays the specific messages that mention the terms and clicking creates a TimeLine of the people discussing the term or phrase.

People/Lists Alerts Widget

The People/Lists Alerts Widget is used to see the number of messages created by the people I follow. I can customize the control by changing the time horizon, selecting the size of the grid or choosing one or more locations. The default value is 24 hours and 12 tiles. Hovering over a user/list displays the most recent messages, clicking adds that user to a Timeline. If the user has mentioned me or sent me a direct message an icon will be added to the image. The tiles of the grid can be pinned for consistency or dynamically update.

Geo Widget

The Geo Widget highlights the regions that have the highest activity for my network, hovering on an area displays more detail about the people, double clicking drills into the area. Once zoomed in I can hover to view messages or click to add people to the Timeline.

TimeLine

The timeline is used to view the stream of messages. Some important things to notice about the Timeline Control:

• The stream moves from left to right
• Absolute time is a central part of the control and it represented by ticks above the Timeline.
• You can move the triangle to any point in the Timeline and all Timeline controls will reflect the request, giving you the ability to backtrack
• “N” number of Timelines can be active
• All Timelines can move in sync or independent

TimeLine Control

Like a video editing application the Timeline Control can be expanded or contracted by clicking on the black resize bar, which is part of the scroll bar.

• Reducing the size of the messages allows the user to see additional messages at a glance
  • this action also summarizes the messages making them understandable at very small sizes

User Control

The User Control is displayed by hovering over the cards to the left of the Timeline Control. This control shows all pictures of the people currently in the Timeline and allows the user to quickly filter them in or out.

Summary:

The TwitterTime application allows me to quickly see at a glance what is happening and then determine where I should focus my attention. The combination of controls looks like it would meet my message processing needs, how about yours?  Round one complete.