As a private joke, I wrote a simple php script which would take any Twitter bio and replace certain words, in a rude and derogatory way. I called it “Unmasker” and it provided a few minutes of fun.

My colleague Greg Smith suggested that the idea had the potential to go viral if it was presented in a fun way. He (eventually) produced a great design for the app.

Given the quality of the artwork, I thought it only fair to put some effort in the UX design and create the scrolling background effect. The whole front-end is essentially jQuery powered, including the use of Ariel Flesler’s excellent ScrollTo plugin. A simple php script provides the database, Twitter API wrapper and text-replacement functionality.

I set up a new Twitter account to use for the app, I knew that it would need to generate a lot of tweets to spread the links but I didn’t want to spam anybody. I wrote into the application logic that nobody would receive more than one automated @mention. Anybody following the Unmasker twitter account would probably not do so for too long, unless they were spam-bots themselves in which case who cares?

The Unmasker account also allowed Greg and myself to role-play the Unmasker avatar – sarcastic, abrasive, belligerent … come to think of it, we haven’t really needed to role-play too much.

So on Thursday 23rd July at about 10:30 GMT we started the ball rolling by seeding a few choice names into the unmasker application, many of them were friends who already knew about it, others were randomly selected from searches for terms such as “social media” and “expert”.

Reactions have been mixed

Most people seem to see the joke, some are baffled and a few have been wonderfully rude.
countzeero’s compliment was particularly nice

countzeero: @StandUP4Design I am getting my ass toasted right next to you “down” there @unmasker is one of the best twitups I have seen…
http://twitter.com/countzeero/status/2873340566

…as was PesciTriD’s Unmasker Haiku

PesciTriD: thanks to @unmasker / ribald twitter speak revealed / keep your tweets comely
http://twitter.com/PesciTriD/statuses/2818433827

jasoncrouch and MrBoom both suffered from complete sense of humor failures …

jasoncrouch: @unmasker Get a life. You are a sad little clown
http://twitter.com/jasoncrouch/statuses/2798942492

MrBoom: go away fuck face
http://twitter.com/MrBoom/status/2819017913

amadee branded Unmasker a Twitspammer and we never even offered him any cut-price pharmaceuticals

amedee: blocking @unmasker – yet another Twitspammer
http://twitter.com/amedee/status/2827979231

BillBoorman and rnadworny were under the impression that I was trying to remain anonymous, despite putting my name and twitter username in the page footer and using the same domain as this blog.

BillBoorman: I unmasked @unmasker http://is.gd/1KatS #unmasked Easier to critiscise when you hide. Who are you really?
http://twitter.com/BillBoorman/status/2817328451

rnadworny: @Techn0tic hiding behind @unmasker . Come out of the closet, Dave!
http://twitter.com/rnadworny/status/2796790735

Rufus_Jay finally worked it out in a magnificent display of calm restraint

Rufus_Jay: I get what @unmasker is up to. Bit miffed at first, but I understand the point. #unmasked
http://twitter.com/Rufus_Jay/status/2815259193

oxfordgirl seemed to find the whole whole thing extremely upsetting, still unsure what she thought we were “trying to track” or where the connection to Iran came from in her panic-stricken tweet …

oxfordgirl: Be ware @unmasker may be trying to track, Don’t click on links #iranelection #iran
http://twitter.com/oxfordgirl/status/2828138746

… but that didn’t stop lorettas3, AHMARINEJAD, lady_stardust9, artfanatic411, Shadiii and a whole host of others from blindly retweeting the alarm with no idea whatsoever of what it was, thankfully Kate_Butler chipped in as the voice of reason with her perceptive defusal

Kate_Butler: @oxfordgirl i’m pretty sure @unmasker is simply a bit of harmless fun. nothing to worry about.
http://twitter.com/Kate_Butler/status/2828171625

That wasn’t enough to stop the_FNGa from demonstrating his suitability for the intelligence services by doing a whois lookup on my domain. Clever(ish), but obviously not clever enough to actually look at the site to see what the fuss was about.

The_FNGa: @unmasker is running a BS script via Twitter API. If you don’t like it, contact David Kinsella @ dave@web-developer.ws #iranelection #iran
http://twitter.com/The_FNGa/status/2831514109

He also tweeted my phone number, which unlike the email address actually is current and in use. So far, the number of calls I’ve received to complain remains at zero. I was hoping Mr FNGa would call me up to discuss the problem but it seems his grievances are only serious enough for people other than himself to take care of. If anybody knows his number…

What’s the point?

Why is everybody so hung up on this idea of there being a point? I’ve always thought that some of the best stuff on the Internet is completely pointless. For example one of my favourite websites of all time is Eric Conveys an Emotion check it out, it’s pointless fun – just like unmasker.

Did it work?

Considering that the site was launched with no real fanfare and a minimal amount of seeding, the results have been very promising so far. In the first 5 days since launch we’ve had 5,883 visits and 7,707 pageviews. The traffic spiked on Friday at 2715 visits and with between 500 and 1000 visits on each of the other days. It will be interesting to see how the traffic continues.

We decided to include the hashtag #unmasked in all of the tweets sent by the app so that we could try to track things better, according to Twist, Friday saw #unmasked grabbing a 0.02% share of Twitter traffic, it’s hard to tell how accurate that is though.

What else did we learn?

• Being a bit rude provokes a reaction, we may not have got as much traffic without ruffling a few feathers.
• Some people fear what they don’t understand and react accordingly (that’s not really news is it?)
• If you use a popular hashtag, people will retweet anything – try tweeting “Chocolate ice-cream cures hemorroides #iranelection” and see what happens
• Some people are so insecure about their online profile, they will change it in reaction to a text-replacement script making fun of them
• Some people do this because the script mocked them for having no bio – this is perfectly acceptable
• Some people stick with their bio despite what unmasker says, these people are right to do so
• When building something that you hope will go viral; a simple idea – well executed is probably a better option than a complex idea hurriedly thrown together.

What’s next?

I don’t know, any suggestions?

It seems that the real-time search capability which Twitter purchased with the aquisition of Summize is now being integrated into the main user interface. 

The new sidebar features a search input, the results of which are displayed in the main body of the page. Searches can be saved so that they become available via a single click in the sidebar.

There is also a trending topics section so that you can see the most popular topics of conversation.

The Saved Searches, Trending Topics and Following sections can all be collapsed to clean up the sidebar when they’re not required.

Speculation: It could be that Twitter are trying to win back users from third-party Twitter apps. Increasing their pageviews in preparation for paid advertising?

Google’s announced they’re closing or ceasing development of a variety of products as part of analready continuing move to keep efforts focused on other products with greater usage. These include an end to video uploads to Google Video, closure of Google Catalog Search, Google Notebook, Dodgeball, the microblogging service Jaiku and the Google Mashup Editor.

The closure of uploads to Google Video is no surprise, I’ve wondered what would happen to it ever since Google bought YouTube and it’s role as a video search engine seems to be a better fit with Google core search service.

Interesting to see that Jaiku is being shut down, in my opinion, after the closure of Pownce in December, Jaiku was the next best direct competitor for Twitter. Another victim of Twitter’s popularity and phenomenal growth, it makes more room for the Twitter guys to start working out how to make money from the service.

Found via ReadWriteWeb:

Google Giveth, and Taketh Away: Google Video, Notebook, Catalog Search, Jaiku, and Dodgeball to Shut Down – ReadWriteWeb .

Update: More on this from Adam Ostrow at Mashable

Twitter is rapidly gaining adoption beyond the early adopter set. Here are a list of people who I like following split into two groups – The Web experts and celebrities from other fields.

Web Expert Tweeters

• Jeffrey Zeldman – Web standards champion
  
• Paul Boag – Web design guru, award winning podcaster
• Drew McLellan – Web designer, developer, entertaining twitterer
• Molly Holzschlag - Web standards advocate, instructor, and author
• Dan Cederholm – Web designer and author, expert in standards based design
• Chris Pirillo - Geek, internet entrepreneur, live web videocaster
• Michael Arrington - Techcrunch editor, source of web news
• Andy Clarke – Web designer, author, speaker
• Brian Solis – US based Social Media PR expert
• Tara Hunt – Social Media guru, speaker
• Jeremiah Owyang – Social computing analyst for Forrester Research
• Kevin Rose – Founder of Digg.com, serial internet entrepreneur
• Neville Hobson – UK based Social Media PR expert

Celebrity Tweeters

• Stephen Fry  – I can’t bring myself to write a summary of who Stephen Fry is, as I couldn’t possibly do him justice. He’s been rightly described as a national treasure.
• John Cleese - actor, writer, comedian and Python
• Jonathan Ross – TV and Radio presenter, currently resting after an incident
• Robert Llewellyn - actor, comedian, broadcaster and writer who played Kryten in Red Dwarf
• Wil Wheaton - best known as Wesley Crusher on Star Trek, he’s a blogger, writer, stand-up comedian…
• Greg Grunberg - plays Matt Parkman in Heroes
• Brea Grant - plays Daphne Millbrook in Heroes
• MC Hammer - yes, seriously, MC Hammer of “U Can’t Touch This” fame
• Darth Vader - OK, so he’s fictional but very funny nonetheless

Mippin

Mippin offers a service to turn your syndicated web content into a mobile optimised web site. Mippin’s mobile portal also helps to publicise your content to mobile browsers.

Soocial

Soocial is a service which makes it easy to manage and synchronise contacts across multiple devices and programs. It worked seamlessly for me on my old Motorola L7, better than trying to type out names and addresses on the tiny keypad.

Brightkite

Brightkite is a location aware social network. Still in it’s infancy, it’s become much better with the introduction of an iPhone application so that you don’t have to manually tell it where you are every time you check in.

SpinVox

Spinvox is a mobile service which will convert a spoken message into text and deliver to a specified location, blog, email, text message etc. The service uses manual transcription to avoid mistakes and seems to be well liked by a lot of people.

Qik

Saving the best for last, Qik (in my opinion) is one of the most amazing developments in mobile web technology I’ve seen. The ability to stream live video from a mobile phone to the web and get real-time feedback revolutionises the concept of instant publishing. Robert Scoble’s impromptu invitation to the Twitter HQ and subsequent live-streaming of the interview was a great example of online video-journalism.

Step 1 – Fetching the Twitter data

Rather than just getting a static twitter feed, I thought it would be more useful to pass the Twitter username as an input parameter to the pipe. A quick glance at the Twitter API gave me everything I needed to know about retrieving a data stream for any username. I could have settled for using the RSS feed for the user but in order to also grab some data about the user I opted for getting the xml output. The url for this is http://twitter.com/statuses/user_timeline/[username].xml. 

To get the feed, I used a Text Input module to make the Twitter username a parameter that can be passed into the pipe. I used the String Builder module to add the username into the url string and then the URL Builder to convert the string into a URL object. Finally the Fetch Data module gets the data returned from the url. 

Step 2 – Getting an appropriate image

To get an image from flickr for each tweet, I used a series of loops. Firstly, for each tweet in the feed, I used the Term Extractor module to get the important keywords from the text, outputting them as a single string. The next loop takes each extracted terms string and replaced any spaces with ” OR ” to use as the search string e.g. “tree leaf” would be transformed into “tree OR leaf”.
The final loop uses the search string to get one image from Flickr and emit it as an additional element in the returned data stream.

View or copy the completed pipe here.

Step 3 – Fetching the data

jQuery is a good choice here as Pipes allows any pipe to return a JSON string and jQuery includes getJSON as an Ajax method.

I started with basic HTML to get the Twitter username and an empty div in which the results will be displayed:

<div id="input">
  <label for="Username">Twitter Username</label>
  <input id="Username" type="text" value="darthvader" />
  <input id="Load" type="button" value="Glorify the tweets" onclick="GrabTweets()" /></div>
<div id="feed"></div>

After adding the script tag to load the jQuery library I could add the javascript to grab the json output for the pipe. Pipes accepts parameters as a url parameter so in this case I needed to load: http://pipes.yahoo.com/pipes/pipe.run?TwitterUser=TwitterUsername&_id=c5b92f96787d9bcce54fd4ec19d21cc2&_render=json&_callback=?
The resulting script looks a little like this:

function GrabTweets(){
  var TUser = $('#Username').val(); //get the value of the username input
  $.getJSON('http://pipes.yahoo.com/pipes/pipe.run?TwitterUser=' + TUser + '&_id=c5b92f96787d9bcce54fd4ec19d21cc2&_render=json&_callback=?',
    function(json){
//callback function to display the data here
    }
);
}

Step 4 – Presenting the data

I added a callback function for the getJSON call which sends the result to output_feed_items which loops through the first five items in the feed.

function GrabTweets(){
 var TUser = $('#Username').val();
 $("#feed").html('');
 var content = "";
 $.getJSON('http://pipes.yahoo.com/pipes/pipe.run?TwitterUser=' + TUser + '&_id=c5b92f96787d9bcce54fd4ec19d21cc2&_render=json&_callback=?',
 function(json){
 if(json.count > 0) {
 content = output_feed_items(json);
 } else {
 content = "The request did not return results.";
 }
 $("#feed").html(content);
 });
}

function output_feed_items(json) {
 var itemList = "";
 for (i=0;i<5;i++) {
 itemList += make_feed_desc(json.value.items[i], i);
 }
 return itemList;
}

The make_feed_desc function outputs the HTML for each item in the JSON feed. I’ve added classes to the elements to use as hooks for the CSS but to add the individual images returned from Flickr, I added an inline style declaration.

function make_feed_desc(item, item_id) {
 var itemElement = '';
 var bgimage = item.flickr['y:flickr'].img.replace('_m.jpg','.jpg');
 itemElement += '
<div id="item-' + item_id + '" class="item" style="background-image:url(' + bgimage + ')">';
 itemElement += '
<div class="talk">';
 itemElement += item.text + '</div>
';
 itemElement += '<a title="' + item.user.name + ' - ' + item.user.description + '" href="http://twitter.com/' + item.user.screen_name + '"><img class="profilepic" src="' + item.user.profile_image_url + '" alt="' + item.user.screen_name + ' / ' + item.user.name + '" /></a>';
 itemElement += '<a class="photocredit" title="' + item.flickr.title + '" href="' + item.flickr['y:flickr'].link + '">' + item.flickr['y:flickr'].link + '</a>';
 itemElement += '</div>
';
 return itemElement;
}

Finally I added a smattering of CSS to make the whole thing a little more presentable.

The Result

Live example here
download source

I may try to improve on this by building a Flickr search based on relevance to the keywords rather than the default module which is based on Flickr’s “interestingness” as the images returned, though very nice, often seem a little too removed from the subject of the tweet. Feel free to do whatever you like with the pipe or code, please drop me a line if you find it useful for anything.

Why are we so hooked on microblogging?

Elliot Jay Stocks, in his Blessay about Twitter points out five things that Twitter is (to him at least):

1. An ice-breaker
2. A purveyor of ‘ambient intimacy’
3. A broadcasting / marketing tool
4. A fount of knowledge
5. A social network

Read the rest of his post to get the full explanation.

What are the other options?

Twitter is currently suffering serious technical issues, where do we go to get our 140 character slices of life?

In no particular order we have:

• Friendfeed
• Jaiku
• Pownce
• Tumblr
• Hellotxt

There’s also beemood which seems to be the microblogging equivalent of a sleazy singles bar, at least it did when I looked at it.

And for non-english speakers there is

• gozub – Spanish
• Meemi – Italian
• Numpa – Dutch
• FanFou – Chinese
• and the slightly scatological sounding Feecle – Japanese (puts a whole new spin on “What are you doing?”)

Newly born is Plurk who’s main innovation seems to be a timeline view, although in my opinion it runs in the wrong direction, I’d expect to see earlier posts to the left of the later ones.

We can now enjoy the hype around – ZobZee, like “Twitter and FriendFeed, but awesomer”. This hoax site was created by Jim Kukral apparently to fill the time whilst waiting for Twitter to come back online.

It may be a hoax but the beta acceptance email is pretty funny featuring such gems as:

“The tech is so revolutionary that we had to get special government permits to test it. Initial testing was done on a few select, not to be named, a-list tech bloggers. The response? Total and complete mind melding with the most important geeks in the world.”

and of course

“Our team has been quietly working in stealth mode for 6-months building the app that will kill both Twitter and FriendFeed overnight!”

I’m pretty sure that Twitter can’t be killed overnight, Twitter themselves have been trying unsuccessfully for the past couple of weeks.

All of the above plus I’ve not really touched on the fact that we have another form of microblogging with our status updates on Facebook, MySpace, Bebo, LinkedIn, Plaxo etc. We are truly spoilt for choice yet we keep going back to Twitter, the big friendly “What are you doing?” input is like digital heroin and many of us are severely hooked.

Information overload?

Many of the services I’ve mentioned can also aggregate activity feeds from each other and new conversations can begin around something which was originally posted elsewhere (in fact this is FriendFeed’s primary goal). Are we spreading ourselves too thin, with too much information to process? Possibly, in his post; Comment fragmentation isn’t the blogger’s fault, Steven Hodson says:

“In the end though we have absolutely no control over where the conversation; if there even is one, will take place. No matter how we try to engage our readers – new and old – they will talk about our posts where ever they want to.”

Perhaps it’s not important where the conversation is taking place, only that there is a conversation.

The problems mostly seem to stem from the rapid growth of Twitter plus the traffic generated by having an easy to use plus fairly unrestricted API. It’s understandable for a software house not to worry too much about massive scalability when starting out, that’s time-consuming work for an application that may not take off, however I wish Scoble had asked more about whether they had made any plans to scale up in the early stages of building the application. It would be interesting from a sort of forensic development point of view to know what they had expected to do and what the realities were, once the scaling solution proved inadequate.

The technical problems with Twitter are magnified by the real-time nature of the application, when you expect updates every few minutes (or every second in Scoble’s case) then you really notice service outages, even those which only last an hour or so. Like the guys say, making changes to the codebase in a real-time app is like changing the tire on a car travelling at 95 miles per hour.

No definite timescale has been given for improving the service so for now at least – something is still technically wrong.

Update: June 1 2008

If the details provided in this post by Michael Arrington are correct then Twitter is definitely the victim of poor planning, I know from experience that there is a big difference between application developer and system architect, Twitter seem to be lacking the latter. If the system really does depend on somebody watching the system and manually switching databases when one fails then they simultaneously need and don’t deserve the latest round of funding.

So far on Twitter, nobody has invited me to “start biting chumps” or compare myself to anybody else, or find out what car, rock star or cartoon character I’m most like. Nobody posts year-old viral videos onto my wall.

Granted, the majority of Twitter users(Twitterers, Tweeters?) are online professionals, so there is a fair amount of web-centric chatter. Not that this is a bad thing, for me it’s like being at a constant web convention where I can overhear conversations going on about a number of subjects, occasionally hearing something that I absolutely need to find out more about.

Often the tweets are a nice condensed form of entertainment, whether industry related such as:

mollydotcom Silliness: If the Web Standards Project had been more semantically described as the Web Recommendations Project, we’d have WaRPs, not WaSPs.
09:59 AM March 28, 2008

Orkahm52 Let’s face it: The major downfall of Opera is it’s unattractive logo.
08:57 PM March 09, 2008

or personal goings on like Jeff Zeldman’s blocked toilet fiasco:

zeldman Graceful homecoming continues with hearty plunging of backed-up toilet. It’s like the toilet is a jilted lover.
08:44 AM March 13, 2008

zeldman “Think you can fly off to Texas for a week and then come back here and s— all over me? F— you. Here’s your s— back.”
08:45 AM March 13, 2008

Now and then Twitter can become an essential lifeline such as for the guy who was arrested in Egypt for photographing a demonstration.

More recently Twitter was the first source for new on the China earthquake, Robert Scoble started reporting the news well before any of the major news services had picked up the story, Twitter was allowing people affected by the quake to report it whilst it was actually happening.

My advice, if you are interested in what the web design and development community are doing (and if you’re reading this blog then there a good chance that you are) the signup for a Twitter account and “start following chumps“.

Twittervision is strangely and powerfully hypnotic. Essentially it pops up new twitter posts on a map of the world one at a time.

Watching it gives the odd sensation of being able to see in real time, what the world is thinking about. Move over Black and White, this is the ultimate god-sim, where the world over which you have dominion is the one we all live in.

Excuse me while I go and pretend to crush puny mortals beneath my thumb, Bwahahahaha!