Twitter Display Guidelines

In the wake of the new Twitter 1.1 API changes announcement I thought I’d focus my attention on the Twitter Developer Display Guidelines so I can understand the changes I’ll see to my favorite Twitter client; Twitterrific.

The guidelines will make our Twitter experience more consistent, boy howdy. Basically every Twitter client will look pretty much the same or it won’t be allowed to use the Twitter API, and a client that can’t use the API is useless.

Please note, if you’re using a Twitter provided client, these rules don’t apply, so you have nothing to worry about.

How do the various clients display Tweets in the Timeline? See the Timelines section in Display Guidelines.

Twitterrific

Twitterrific is my favorite client because it’s darned simple, great UX and UI design. Twitterrific is unique amongst the three clients we’ll examine because it shows a reply icon in every tweet. Note the arrow in the lower right corner of the image. Tapping on that icon will display a menu of choices that includes Reply, Direct Message, Retweet, and Retweet with Comment. Not even Twitter’s native iOS client provides this functionality.

Twitterrific: What needs fixing?

I use the term fixing loosely. Here is a list of the rules Twitterrific breaks, according to the Display Guidelines.

Tweet Author

The userâ€ s name and @username should be displayed on one line, with the name first.

Retweets

If the Tweet being displayed is a Retweet, the name of the user who Retweeted it and the Retweet icon must be displayed under the Tweet text. e.g. “Retweeted by Josh Brewerâ€. The name should link to the the Retweeting userâ€ s profile [1].

The @username doesn’t appear in the tweet and the retweeted by text doesn’t show below the tweet. It’s not seen here, but the retweet text displays to the right of the users name. One of the great things about Twitterrific is how it displays tweets in different colors depending on the context of the tweet. I’m not sure how Twitter will feel about that, but the guideline doesn’t call it out.

That’s not so bad, but it does mean Iconfactory will need to fix some things.

Tweetbot

Tweetbot: What needs fixing?

Tweet Author

The userâ€ s name and @username should be displayed on one line, with the name first.

The avatar must be positioned to the left of the name, @username, and Tweet text.

Timestamps

Tweet timestamp should be displayed in the top right corner.

Retweets

If the Tweet being displayed is a Retweet, the name of the user who Retweeted it and the Retweet icon must be displayed under the Tweet text. e.g. “Retweeted by Josh Brewerâ€. The name should link to the the Retweeting userâ€ s profile [1].

Tapbots has a bit of work. In most cases the users avatar is displayed in the proper position, unless its your tweet, then it’s on the right. That’s an easy fix for them. Once that is fixed the timestamp will move to the proper position in the upper right corner. The Retweets item is interesting. The rule states it should display the name of the user who retweeted it. Tweetbot does that, sort of. If the retweet was by you it displays “Retweeted by You”, which doesn’t fit the rule to the letter.

Twitter

Twitter: What needs fixing?

Retweets

If the Tweet being displayed is a Retweet, the name of the user who Retweeted it and the Retweet icon must be displayed under the Tweet text. e.g. “Retweeted by Josh Brewerâ€. The name should link to the the Retweeting userâ€ s profile [1].

Not surprisingly Twitter does the best job of following the rules, but they do break this one. In the Twitter iOS client a retweet icon is display in the upper right hand corner of the tweet and the user’s name isn’t displayed.

Random Note

In the Individual Tweet section under the Branding bullet point this is listed.

The Twitter logo or Follow button for the Tweet author must always be displayed in the top right corner.

Emphasis on the word Tweet is mine. Twitter didn’t coin the term “Tweet”, the fine folks at Iconfactory did.

EOL