Complaining is silly. Hence this big bold reminder:

As a tribute to one of my favourite quotes:

Complaining is silly. Either act or forget.

Heard first at Stefan Sagmeister’s TED talk, which itself is an excerpt from his beautifully designed Things I have learned in my life so far book.

The one page complainingissilly.com has actually been out for quite sometime now. I’m just a few years late in documenting it here.

This project was a nice opportunity to experiment with (what were then cutting edge) CSS properties such as @font-face and CSS gradients. ‘Act’ is set in The League of Movable Type’s freely available League Gothic font, whereas that little play button on the bottom right corner activates a fun lava lamp like animation on the entire page.

Also included are desktop and smartphone wallpapers for those of you that would rather not forget.

∞

Significant enough to completely change the perception of cellphone photography, as it turns out.

My iPhone has turned from a lowly 3.2 megapixel camera with an only-use-when-all-else-fails warning to an indispensable tool for documenting day-to-day life, even in situations when I might have an SLR at my disposal.

Others have written about what makes Instagram so wonderful, so I won’t repeat that here. Instead, I want to share some results.

I started using Instagram in October 2010. Collected here are a few favourites from the 100 or so photos I’ve posted in the 6 months since.

Do take a look.

Instagram wouldn’t be half as interesting without the people that form it’s community. It is a social network after all. The best photos in my feed usually come from @rashmi, @rands, @rksh, @gruber, @cameronmoll and @simplebits. Go follow them if you’re on Instagram.

∞

As good as it is, the current web interface does not make it easy to browse historical data. Anything older than the latest 100 or so tweets requires a lot of clicking and manual scanning. Their search too, understandably, only covers updates spanning back a week or so. Anyone who’s tried to revisit their tweets from an year or a couple of months back has surely felt the pain.

There had to be a better interface for browsing tweets. What surprised me, though, was that no one had created such a service for the nostalgic folk on Twitter. I did come across a few custom solutions: Doug Bowman (the design lead at Twitter) for instance, set up a WordPress archive; Andy Graulund built a custom LAMP app.

The idea of my own Twitter archive appealed to me, didn’t sound like a massive amount of work, and out came Not so Yellow.

Design

This project was the result of my grievance with browsing old tweets. Before anything else, it had to have a super easy interface for getting to tweets from any specific month or year.

I toyed with several ideas: listing all the years and months upfront; as drop–down menus / expandable lists; months from the current year upfront, with the full list on a separate page or down below; and, side by side.

As you can see above, I ended up adapting the side-by-side option. This design keeps the content (tweets) centrefold and topmost in the the visual hierarchy, and the year and month links as second-class citizens. Yet these navigational links are persistent and always available as soon as they’re needed.

Short Abused URLs

URLs are important. URLs are part of a site’s design. Cool URLs don’t change. An unfortunate consequence of Twitter’s awesome 140 character limit has been the blown-out-of-context URL shortening craze. While these shorter links definitely do a great job of conserving precious tweet characters, they are usually less readable, obfuscate useful information and — as was dutifully demonstrated by tr.im — provide little guarantee against massive link rot. They should, in my opinion, be used sparingly, only when absolutely necessary.

Well, here was a chance to do something about the shortened URLs under my control. And something I did. It wasn’t as straightforward as I hoped though.

My initial plan was to simply follow and look for redirects for all incoming URLs, and replace the tweeted link with the address of the final destination. Turns out:

• Some tweets use URLs for more than providing a link. Altering them can effect how well the tweet reads.

• Some redirects are temporary (in not just the HTTP response code).

• Some URLs change and lose their original meaning.

  http://rungta.muxtape.com redirects to
  http://muxtape.com.
  Sad but true.

• Some uncool URLs redirect to soft 404 pages.

  http://tinyurl.com/6xqx42 expands to
  http://www.ibnlive.com/olympicsnews/abhinav-bindra-wins-olympic-gold/70827-29.html
  which, instead of pointing to the correct new location
  (http://ibnlive.in.com/news/abhinav-bindra-wins-olympic-gold/70827-29.html)
  redirects to http://ibnlive.in.com/missing.html.

• URLs can become really long and unreadable.

  http://youtube.com/watch?v=lCrJRgzTBCE redirects to
  http://www.youtube.com/index?ytsession=ODBr9ZffIdpph2UHiTlWOwoUUUHyBDlIvBvoQs5JS4jkKj40n5WuEgv-NU6hwEcaBCT-Oz8cA0VOZtxWTlaV5WzhWef8KsewHvt_CvZEfG6P5HsgM0c1E3UZvMIJNAUbZs0i2XnAsLn6THeHgqh3tEL_7RwbprFc4F-iGlRiFKdjAI2ObVjg1eE2h3rjf3zobuvf_6gUB56w16y-3IIzMsIBMQwRhVmXC3fXUVgxMuIpfbNjYtwymuiT9uh0LUjxv0eALEZtdp2oDA-1-XvKEDRj5MMMfSfPt1EZ8K-uccYWNI6pWML8SpXG3pFTZebqq97SGhWVemzur-NiUlels1BHBeLBjhJ-9WNTCFDPCIJNh1G0RrXvyYQ8zhLhgygYDYUshxYPy_4
  (this example courtesy of Bernie Ecclestone).

So, I scratched my URL replacement plan and decided to provide inline expansion, similar to the ‘(expand)’ short URL suffix on Summize (now search.twitter.com). Expanded URLs, when applicable, are added to the tweets as [+] links.

Tooltip via the generated CSS content:attr(href) property.
No JavaScript.

The fully expanded link addresses are displayed as tooltips when the mouse moves over [+]. Thus, a user has the option to simply click the original short URL or preview and directly click through to the final destination.

Should, Could, Would

Should

Search, obviously.

Could

As Rakesh graciously pointed out, this could be opened to support any user, and do for Twitter what Justin Ouellette’s ihardlyknowher does for Flickr. Not so Yellow does archive tweets from multiple accounts (and can support a few more), but it wasn’t built as a public service.

Would

Perhaps at a time when I haven’t got 4 other projects stretching me thin.

For now, if you’re interested in archiving and/or browsing through your own tweets, take a look at Doug Bowman’s instructions for WordPress. Alternatively, download and install Andy Graulund’s well designed, fully featured, open source LAMP project Tweet Nest. Or ask me nicely.

Credits

• Body text typeset in Linux Libertine (GPL) and embedded using Font Squirrel’s excellent @font-face Kit Generator.
• Rashmi Swamy for coining “not so yellow”.
• Phil Sturgeon for the CodeIgniter cURL library.
• Rakesh Rachamalla and Rashmi Swamy for feedback, help with testing, and their tweets.

∞

I’ve made ample use of this extensibility to add functionality I found myself using in multiple places. I’m sharing a few of these extensions here in the hope that others might find it useful.

• Output (extends native)
• Encrypt (extends native)
• Css

They’re all being used under production, with the latest version of CodeIgniter and PHP 5, so they’re hopefully bug-free.

∞

I needed a simple silhouette of the goddess for a design project commissioned by Dad, and had to resort to tracing one myself. I’m releasing that work here for free use under the Creative Commons Attribution license in an attempt to fill that internet void.

• Download PDF

I’ve only just started playing around with vector graphics (courtesy of the simple and easy VectorDesigner app), so while you won’t find a professional’s polish or attention to detail, it should suffice as a useful starting point.

∞