Back to blogging – Tumblr photo-uploader’s performance / usability (lots of room to improve) …

Blogging after a really, really, really long time – and its about usability (once again).

I was uploading some photos to my tumblr blog and realized that it was taking quite a bit of time.

For example, Facebook’s album uploader managed to upload 14 of my photos in less than a minute and tumblr definitely took more than 5 minutes (for 10 photos).

And not only that tumblr violated one of the most important tenets of usability – “provide visibility into what is happening”.

While Facebook provides this nice progress bar with status message(s) about which photo is being uploaded, tumblr just provides a generic “Uploading …” message. And a few more generic messages in the browser’s status bar – e.g “Sending request to http://www.tumblr.com …” – which are not really helpful.

tumblr's photo upload UI

Facebook's album upload UI

And finally Facebook’s selection process – where you can select multiple photos in one step – is just way better than tumblr’s “Add another photo” option (which I had to click about 9 times!).

Maybe they need a refresher – “Designing Web Interface : Principles and Patterns for Rich Interaction“!

Cheers.

The Good, the Bad, and the Ugly of LinkedIn Usability

The Good.

I have been using LinkedIn for quite some time now (I think since 2004) and I have been a big fan of its service. I think it is one of those few social networking websites that was doing social networking even before it was cool (a better term would be professional networking) – and on top of that, it provides a lot of real value to professionals.

I have always liked their user interface – kind of minimalistic and intuitive – because you can easily find what you are looking for. I also liked the “home page” where you can see your network updates – it was good to be in the loop when one of your connections found a new job or got promoted.

The Bad.

But of late, LinkedIn has been trying to do a lot (I guess getting caught in the social networking phenomenon) with new features like Applications, Groups, Sub Groups, etc, and the “home page” has been getting more and more crowded. When I logged into my Linkedin page a couple of weeks ago and I saw all these network updates from people that were not even my connections, I was literally horrified!! This reminded me of another social networking site called Facebook 🙂 (there, I said it – I hate the usability of Facebook) that I stopped using a few months ago when I started getting updates from friends that were not even in my friends list (apparently they were friends of friends).

After a more than casual inspection, I realized that these updates were from people who were in my network because I had subscribed to a few groups, and these people were members of groups that I had subscribed to. But I really really use LinkedIn only for managing or keeping in touch with my professional contacts, and I really didn’t want an update about somebody unknown reading about online activism or dancing the zeimbekiko. And what’s up with all those small icons next to each update (see image below) ? Kartick’s first rule of usability : if you are going to decorate your UI with such small icons, either provide tooltips or provide a legend and both of them are missing from the LinkedIn home page.

Linked clutter

So I decided to control the clutter by going to my “Account & Settings” page and customizing the “Network Updates” that I am interested in. Now this is where LinkedIn could have made a real difference with respect to its usability. Remember those small icons that I was talking about in the previous paragraph (and displayed in the above image) – I am pretty sure that they have something to do with the different categories of updates – and this (the “Account & Settings” page) would have been a great place to display those icons. Because then I would be able to immediately correlate the different categories of updates to a specific update that is listed on my home page and decide whether I want to enable or disable such updates.

Here comes the ugly part.

Even without those icons, I was able to figure out (pretty smart of me eh ? :-)) that I should disable “Updates from my Groups” if I want to receive updates only from people who are not in my connection list, and so I went ahead and did that (see above image). And guess what ? It has been about a week since I did that, and I still get those updates. It is one thing to have bad usability (e.g. the user can’t easily figure out how to accomplish something), but it is another thing to “not do” what the user has requested you to do with your advertised functionality !! That is not bad usability, that is just faulty software that has been written.

Well, this doesn’t mean that I will stop using LinkedIn anytime soon. It is still lightyears ahead of other professional networking sites like Xing or Plaxo. And I am guessing they are going through growing pains – but still that is no excuse. So hopefully they fix their usability issues soon and continue to provide the great service that they have been providing all this while.

A Twitter – Google Maps mashup to view your friends network …

So it all started off with me wanting to see the geographical distribution of my Twitter friends (the Twitter-ers that I am following) and since I don’t host a website (and WordPress doesn’t allow JavaScript in blog posts) I had to do all this in Java.

In the end it worked out pretty well – it was actually quite simple using the Google Static Maps API. All you need to know is some scripting language and you need a Google Maps API Key.

So you start off with the Twitter REST API and get all your friends (the people that you are following) . I used a Java URL object but you can use cURL or any other scripting language that has HTTP URL support. The output looks something like this (the Twitter ids of all your friends) :

<?xml version="1.0" encoding="UTF-8"?>
<ids>
<id>14112660</id>
<id>798731</id>
<id>15256245</id>
<id>16824408</id>
<id>17191554</id>
<id>18743188</id>
<id>26459315</id>
<id>21276419</id>
<id>18702371</id>
<id>34632001</id>
<id>14576471</id>
<id>13954772</id>
<id>16038405</id>
<id>15880443</id>
</ids>

You have to now parse out the IDs from the above output and for each ID (and for yourself also), you have to once again use the Twitter API to get each user’s information. Now the output looks something like this :

<?xml version="1.0" encoding="UTF-8"?>
<user>
  <id>12683672</id>
  <name>Kartick Suriamoorthy</name>
  <screen_name>karticks</screen_name>
  <location>Munich, Germany</location>
  <description>Software professional (JAVA, Network Management, Open Source, Application Servers, etc.)</description>
  <profile_image_url>http://s3.amazonaws.com/twitter_production/profile_images/57456567/got-beer_normal.png</profile_image_url>
  <url>https://karticks.wordpress.com</url>
  <protected>false</protected>
  <followers_count>29</followers_count>
  <profile_background_color>9ae4e8</profile_background_color>
  <profile_text_color>000000</profile_text_color>
  <profile_link_color>0000ff</profile_link_color>
  <profile_sidebar_fill_color>e0ff92</profile_sidebar_fill_color>
  <profile_sidebar_border_color>87bc44</profile_sidebar_border_color>
  <friends_count>14</friends_count>
  <created_at>Fri Jan 25 14:36:13 +0000 2008</created_at>
  <favourites_count>0</favourites_count>
  <utc_offset>3600</utc_offset>
  <time_zone>Berlin</time_zone>
  <profile_background_image_url>http://static.twitter.com/images/themes/theme1/bg.gif</profile_background_image_url>
  <profile_background_tile>false</profile_background_tile>
  <statuses_count>109</statuses_count>
  <notifications></notifications>
  <following></following>
  <status>
    <created_at>Mon May 25 05:25:11 +0000 2009</created_at>
    <id>1909795818</id>
    <text>End of a long weekend (and a long vacation). Now trudging back to stuttgart with my morning kaffee and breze.</text>
    <source>&lt;a href=&quot;http://help.twitter.com/index.php?pg=kb.page&amp;id=75&quot;&gt;txt&lt;/a&gt;</source>
    <truncated>false</truncated>
    <in_reply_to_status_id></in_reply_to_status_id>
    <in_reply_to_user_id></in_reply_to_user_id>
    <favorited>false</favorited>
    <in_reply_to_screen_name></in_reply_to_screen_name>
  </status>
</user>

Now you have to parse out the location (4th element) and use the Google Geocode API to geocode the location. This is a little bit tricky – as sometimes the location attribute can be empty (you have to skip those users) or they can be iPhone lat-long coordinates (i.e. they are already geocoded – see below)

  <location>iPhone: 30.417343,-97.710770</location>
  <description>I do not fear you, gypsy. I only want your tears.</description>

Once you have all the geocodes, you construct a Google Static Maps URL by using your geocode as the center, and all the geocodes (including your location) as markers. I used a black marker to mark my location, and red markers to mark my friends. The result looks something like this …

Kartick's Twitter Network

Ok not very impressive, but still fun …

Caveats :
– Google Static Maps API allows only 50 markers, so if your friends list is more than 50, you will have to prune out the unwanted ones 😉
– The Google Geocode API returns coordinates of a point as a longitude-latitude pair but the markers in the Google Static Maps API expect it in latitude-longitude format and it took me some time to figure out this (I was wondering why my markers were located in Antarctica and sometimes way outside any conceivable point in the globe !!). I wonder why Google did that (iPhone actually got it right and it was trivial to take the iPhone Geocode and insert it into the Google Maps URL) – it would have been just so easy to pass the lat-long pair from the geocode output into the Google Maps URL (to construct the marker’s coordinates) but now I had to add parsing logic to swap the lat-long locations (ugly).

Anyway, I hope this was fun and enjoyable, and as always, the code (TwitterGoogleMashup.java) can be found in the Google Code project, DalalStreet (in the FunStuff project). You can run this class with your own Twitter username (and Google Maps API key) by checking out the project into Eclipse. It will print out a URL when it finishes running and all you need to do is copy and paste this URL into your browser.

Until next time …

What is missing in Twitter Search ? Twitter Find !!

It all started with me trying to find what kind of a dog one of my friends had.
He had posted the breed on a Tweet and I tried to search for it.

And then I realized how difficult it can be to use Twitter Search to find something that is not necessarily happening in real-time. Unfortunately (from my perspective) Twitter Search focuses on giving matches (i.e. Tweets that contain the search string) that have been posted recently (i.e. real-time) a higher ranking. Which is fine for real-time search (however one defines real-time search) but misses out on one important aspect of social networking – the NETWORK. I do realize that Twitter is more than just a social networking tool, but one of the most important reasons I use Twitter is to stay connected with my friends and find out what they (i.e. my network) are doing. And I am sure there are people (not just a few) who want to go back and lookup some interesting tidbit of information that somebody in their network had posted, and if that Tweet was posted a few weeks back, then it is like looking up the 455th link on the 17th page of a Google Search.

The image below shows the search results for “Camtasia” and as one can see, all the results are sorted by time – so if I was looking for a Tweet from somebody in my network who had posted a URL a few weeks back on how to convert a .camrec file into a .mp3 file, I would be totally lost trying to search through these results.

Twitter Search Results

And so I started playing around with Twitter Search and its advanced options, and a host of other Twitter search tools like TweetScan and Flaptor but none of them take into account the notion of the NETWORK (and somehow the whole idea of using another tool to search Twitter is just so un-user-friendly). Twitter Search has an advanced feature to specify the “user” whose update you are interested in but once you are following more than 30-50 users and you are posting and receiving daily updates, one tends to forget who posted what. So basically what Twitter needs is a separate mini-search (I call it Twitter Find) that just looks in the Tweets of persons that you are following (and your own Tweets) to handle a host of use-cases like

– A dish that somebody had recommended at a restaurant (e.g. the Al Pastor at Tacos y Tequila and you remember just “Tacos” and “Tequila” as the search terms).
– A URL that talks about solving a specific problem (e.g. one-to-one Hibernate mapping and you remember just “one-to-one” and/or “Hibernate” as the search terms).
– The name of a dentist that was recommended by somebody to somebody else and you just remember “dentist” as the search term.
– And so on and so forth.

But as of now, to use Twitter search to find something in your network is like using Google to find something on your computer’s hard drive. Sorry, bad example, Google Desktop actually does a pretty good job of doing that !!