This was presented at Devnest 9

Developers of Twitter probably heard of @Anywhere when it was launched at Chirp, it includes componants which will enhanch a web page. Which for twitter increases the engagement for their users. These componants are cool, but hardly anything to get excitited about. @Anywhere contains a fantastic secret underneth it’s hood and thats a fully JS-API. Thats right a method to interface with the Twitter API entirely in JavaScript. This is because @Anywhere provides the means to authenticate a user via OAuth using their new Twitter Connect window.

Authenticated users can achieve a lot more using the API, therefore the JS-API now lets you practically do anything that the regular API can. This is really exciting because it means that i can finally turn TweetTabs into a fully Twitter client built entirely in JavaScript.

Here’s a quick example of how easy it is to post a status update using @Anywhere:

twttr.anywhere(function(T) {
if (T.isConnected()) {
T.status.Update(‘hello world’);
}
});

You can find a lot more information regarding @Anywhere over on the @Anywhere dev page. You can also get a full list of support methods.

TweetTabs

So how does this all fit in with TweetTabs? Quite simply TweetTabs was never quite finished, i always intended it to be a fully Twitter Client and not just the search client that it became, this is because Twitter at the time of writing TweetTabs didn’t support any methods of OAuth through JavaScript. But now it does, so i’ve implemented it.

You can check out a very alpha version (which is my proof of concept) at http://beta.tweettabs.com. Please give feedback, I fully intend on integrating @Anywhere fully into TweetTabs.

Downsides

The real big problem with the JS-API part of @Anywhere is that it is not supported (at all), there is very little documentation and most of it has changed since it was released. So it really is down to trial and error!

Slides

Here are the slides from the talk.

The TweetMeme button is one of the most successful social media buttons, it is served to millions of websites around the web. One of the more unusual points about the TweetMeme button is it’s height, 61px. This height has now been adopted by facebook and digg.

Why 61px?

“Cause everyone knows that 61 pixels is such a normal dimension in the world of social networking – I mean everything’s 61 pixels, right? Cause it’s…a prime number!”

- Twittown

I would like to say that it was due to lots of research and investigation, but it was more of a accident. The button was originally designed to be 60px high but in the quest to fit an extra digit onto the button the font size was decreased and the button height was increased to 61px.

The Standard

The TweetMeme button had a massive adoption rate, and was installed on millions of sites across the web therefore it became the one to beat! Large sites have now put pressure on the other social media sites to produce their buttons to the new standard. Therefore the 61px standard (if you have a better name let me know) is now the default for all social media buttons on the internet.

Twitter is quickly gathering pace and is fast becoming one of the most popular social networks. I have been using Twitter for nearly 2 years, mostly through their use of 3rd part applications like TweetDeck or Tweetie. I thought to myself why do I, and many other ‘power’ Twitter users not use the web interface? So here are some of my suggestions on how I would improve the Twitter UI.

Twitter home page design at the time of writing the article, including some reference points.

I will be focusing on a number of parts of the home page, the main ‘tweet box’, the implementation of the ‘lists’ area, how the data is presented and the integration with search. This is not meant as a critique of Twitter, but more as some helpful suggestions on usability.

Tweet Box

For lack of a better word, the tweebox is the textarea located at the top of the twitter homepage. I would really love to see it improved in a number of really simple ways:

• The ability to press enter to submit a tweet. Tweets aren’t multi lined and there is nothing else to do so why not make enter submit the form instead of press the button. Twitter has this problem in a number of other area’s as well, OAuth screen!
• Autocomplete the usernames in the textbox.
• Auto shortening. Twitter has already partly done this for really long links, but it would be nice if you could have the option to do it on the shorter links as well.

Page improvements

The live update of tweets, you know the little yellow box which tells you how many are waiting, is a fantastic addition. But I think they are missing the key points, why wouldn’t you show the tweet? I just find it really annoying.

The page is currently geared up to just tweeting. Users probably use the Twitter interface more to manage their tweets and accounts, maybe the front page should be geared in that direction.

Other

The lists nor retweets seem to be fully integrated into the UI they just appear to be something strapped onto the edge. It would be great if you could, for example, have tabs across your timeline which listed your most popular lists.

It would be great to hear your thoughts on how you would make twitter better, you never know maybe Twitter is reading this.

Better Twitter

Hopefully my recently released Firefox plugin Better Twitter will solve most of these issues.

There are a lot of things wrong with the Twitter homepage, that’s why i created Better Twitter. Which is a Greasemonkey script which will fix some the things which really bug me with the Twitter UI. I have converted the Greasemonkey script into a standalone Firefox plugin as well using this user script complier.

Install Plugin or download the Greasemonkey Script

Release 0.1

• Fixes the tweet box, allowing you to press enter to submit the tweet
• Focuses the tweet box when the page loads

Installation

There are two options for installing the script.

1. Download the Firefox Plugin, this requires Greasemonkey to be installed (i think)
2. Download the Greasemonkey Script

Feedback

If you have any thoughts or feedback on this script, or would like to contribute please leave a comment below.

My previous Twitter tee design was a huge success selling 33 t-shirts, over the period of 9 months! I have decided to expand my range and not only offer more types and colours but also more designs. Here is design one of Twitter tee version 2.

Design

I didn’t want to have another bird, even though Twitter has changed their bird since the last one, so I looked at the other icons or characters which are synonymous with twitter, including the fail whale, the ice cream and caterpillar and the robot, which I finally settled on (mainly because i love robots). The twitter ‘something is technically wrong’ robot is a fantastic design, and I have always been impressed with it. However how do I convert it into a T-Shirt?

I really needed to block the design out so it can easily be printed in one colour. I wanted to make it my own style, but while still making it look like the twitter robot. Please let me know whether you think I have managed to achieve this?

Here is the first draft of the design, it has a big section so you can write your twitter name (like the previous T-shirt) or anything you want easily.

Don’t forget you can still buy the Twitter T-Shirt design here.

Please let me know what you think!

Photo by Benjamin Ellis

We held Reading Twestival on the 10th of September and it’s great to say that it was a fantastic evening, and the culmination of over 4 weeks of intensive planning by me and the team. The turnout wasn’t as huge was we expected but we did manage to reach our goal of raising over £1300 for our charity Daisy’s Dream.

I hope everyone enjoyed it, and I would really like to thank everybody who helped me to organise it, Amy, Katharine, Jim, Ben and Claire. I would also like to put out a huge thank you to our sponsors DediPower, TweetMeme and to our venue Mix Cocktail Bar, I think everyone agreed that it was a fantastic venue.

Don’t forget that we run regular tweetups called rdgtweetup every other week at Glo, check out the website for more information.

I would just like to say thank you to @RDGTwestival and @simonster for organising the Reading Twestival and say it was great meeting some of the local Twitter crowd, we should all do it again – how about Wednesday?

See @BenjaminEllis fab photo’s of RDGTwestival http://bit.ly/sLowO

N.B. You can still buy the T-shirts.

Over the last couple of days we have been working hard at fav.or.it on a new design for tweetmeme. The old design wasn’t very nice and lots of users were put off the site because of it’s garish colour scheme, but now we are back with, hopefully, a really successful new design.

You can find a full review of the new features on the tweetmeme blog.

Minimal

Much like this website, Nick wanted the tweetmeme website to be really minimal and as far away from the old design as possible. A quick search on Kuler found the perfect colour scheme. Combine that colour scheme with a few shades of grey and we have the perfect website.

Rockwell

You will notice that Rockwell is used a lot around the website, i thought that the bold text contrasted really nicely with the small and minimal design.

Feedback

I am always interested in any feedback any can give me about my designs, so please leave feedback here, or on the tweetmeme blog.

Twestival is just around the corner (Feb. 12th) and I thought I would share the special T-shirt that I designed for the occasion. I wanted a T-shirt which I could put my own username on, but I was unable to find one, therefore I broke out illustrator and started designing.

I really wanted something that wasn’t in your face and was subtle, and preferably something that didn’t have the twitter logo on it. Therefore I chose a simple design using the original twitter bird, designed by Simon Oxley, available on iStockPhoto, and a cloud to hold the name.

There were some modifications that had to be made to the vector images, firstly none of the lines could be two small and all the objects had to be converted so that none of their paths crossed.

Using SpreadShirt

SpreadShirt was chosen to print the T-Shirts because they accept vector drawings which allow for the most flexibility when it comes to colours, they allow up the 3 colours, but I would only be using two. The uploading process is really old tech, each vector drawing has to be approved by a human before they let you use it, but this process should takes less than 24 hours.

After the design has been approved the design can then be added to products, anything from T-shirts to umbrella’s can be printed with your design. I choose 2 different forms of T-shirt one a slim fit and one a normal fit, £14.50 and £14 respectively. You can then tweak around with the designs/colours/text to get your design perfect. I also converted mine into a product for my own store.

You can currently buy this T-shirt which will be printed with your name, in one of 7 colours at http://dtsn.spreadshirt.co.uk.

N.B. The Slim-Fit Tee is really slim fit, leave a comment if you would like the design on any other products like girl tee’s, mugs, umbrella’s etc.

All the profits for this T-shirt will go to Twestival.

Roughly £1.40 – VAT will go to Twestival for every T-shirt brought, however spreadshirt will only release the money if more than 30 shirts are sold (thats just their store policy).