An Update on TopForty.it

Figured I would give a quick update as to how TopForty.it been doing. We’re about 2 weeks in, and the response has been great. People seem to love the idea, the execution and the UI/UX, which is heartwarming although I still think it’s rough around the edges (won’t tell you where because then you will notice it =D ).

Some stats: In 2 weeks, people have listened to over 5000 songs (5194 as of last night), totalling in a little under 25,000 minutes. Our visitor return rate is over 60% and the average time spent on site is around 30 minutes. These numbers seem to be increasing, which is good considering the fact that we haven’t really promoted it much (blogs, reddit, HN, etc.).The growth seems to be organic with 50% traffic from Facebook. As we add features, we plan to hit Hacker News and some blogs.

Update: Techvibes did cover us from the demo we gave at Velocity’s end-of-term Demo Day. Since them, we’ve also been featured on GigaOm and The Next Web

Update: Here are the photos from Velocity’s Demo Day.

It’s been really fun to work on this project. I think where we are at now is interesting as we are trying get it out of the “hack” stage and into the “software” stage. Up until a certain point, you don’t give much importance to architecture, focussing on getting features out as quickly as possible. This is changing as the LOC grows. Since all the application logic is in JS, I have to spend a few days really cleaning that out. The good news is that YUI does a lot of the work for you, so I won’t have to refactor too much. I will take that time to pull in some of the new Y.App stuff that’s in 3.5.0.

I really do wish to write a blog post at some stage detailing how the UI works – as much as for my own records as for other people’s understanding. I have exams going on now, so it’ll probably have to wait till mid-December. I have started, but don’t want to publish something that’s half-baked.

We’re Launching TopForty.it!


@rezcubed and I really happy to launch TopForty.it today. TopForty.it is a real-time top 40 list of the hottest songs based on conversations on Twitter. We take a ton of tweets and figure out what the top 40 songs that day are. You’re able to just press play and forget as it cycles through all the music videos, all presented in a clean UI.

I’ll go into the technology side in a latter post, but check it out and listen to some music! Follow @topfortyit to stay up to date on this!

Introducing Crictainment

I want to introduce an app that I worked on this term for Yahoo!’s Hackathon. It’s called Crictainment and it’s a mobile web app that curates media related to cricket (you know, the sport).

Screenshots

I originally presented at Yahoo!’s company-wide summer hack event (where it won best iPad Hack, yay go me!). It’s been open-source for a while but I actually haven’t talked much about it outside of work.

So what exactly does it do?

Crictainment is a mobile web app that pulls in cricket news, videos and photos from a half-dozen cricket sites and presents them to you in a curated manner.

What does it do?

Crictainment gathers news and views from popular cricket news sites and displays them all in a nice interface, optimized for the iPad. It allows you to read these articles without any distractions. Cricket sites are pretty badly designed so I made this.

In addition to the articles, the app also allows you to scroll through and watch videos and view recent photos. Check out the screenshots in the gallery above.

Why did I make it?

  • I’m a cricket fan
  • nothing in this app uses device-level capabilities so I wanted to test out JS performance on device
  • I could not finish a native app in the 24 hours that it took me to make this.
  • I was tired of visiting different sites to get different points of view.
  • I want an app that works cross-platform.
  • I wanted to experiment with HTML5 and mobile performance.

Technical Details

  • All HTML5/CSS/JS.
  • All open source.
  • MVC Architecture (rolled my own miniature framework using YUI3 custom modules)
  • YUI3 for widgets/scrolling
  • YQL/Pipes for pulling in data and feeds
  • Optimized for iPad (in terms of viewport, meta tags, etc.) Just add it to the iPad home screen and check it out.
  • “Native feel” when browsing the app. Animations are all CSS3-based.

Things may break in the future

This is a hack after all. I am doing quite a bit of scraping to get data off some of the sites since they don’t have RSS feeds or APIs. Also, since most of the work was done during a hackathon, I’m sure there could be errors that I’m not handling. Bugs should be anticipated, but I think I’m a decent coder so it should still work! You should open this on an iPad for the best experience. The desktop version is still a little iffy with the scrolling.