Me and @bennedich decided to make a prototype of the Reading Statistics idea while keeping it fully hosted in Dropbox. That means pure HTML, CSS and JavaScript (although we wrote the JS using CoffeScript). For fancy graphs we picked Google Chart Tools. Here’s a shot of the final prototype:
First we took a look at what the ReadItLater API offered, as we both use the service for our reading. It’s fairly simple and just gives you a list of all the articles, where each article has:
- Item ID: unique id identifying the url
- URL: the article url
- Title: page title
- Time updated: Unix timestamp of when the item was last added/changed
- Time added: Unix timestamp of when the item was added to list
- Tags: user entered, comma-seperated
- State: read or unread
We thought of a few specific stats we could easily calculate and drew some sketches. Basically some kind of big line chart, and then some numbers around it.
Then we looked at all the chart types provided by Google, grabbed screenshots of them, and ordered them into potential dashboards.
For our first prototype we picked the easiest one just to get all the pieces in place. A simple bar-type distribution chart of how many articles are read after a set amount of time (i.e. X articles on the same day, Y after 1 day, Z on after 2 days, etc). The three main numbers below the chart were average articles added per day, average read per day, and average time between adding an article and reading it.
Parsing and calculating the stats was the easy part. A problem we have is that RIL doesn’t support JSONP. To get around that we used Yahoos YQL service. A potential new project would be a JSON tunnel.
Finally we added a small login-screen, on the same page, put the data in the REST-call and blam! Done!