Project: Read It Later Dashboard Prototype

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:

Screenshot of the RIL-Dashboard 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!

Now, try it out!

Idea: Ruby score

While programming with my friend Jocke he was really eager to show CoffeeScript. You don’t have to use parenthesis, curly braces or even semi-colons! Fantastic! Now there’ll be less bugs! </sarcasm> What was extra funny was that parenthesis are needed sometimes, but if you rewrite a bit you can get rid of them.

Example:

@milliSeconds = @getSeconds(timeReport) * 1000
#rewritten as:
@milliSeconds = 1000 * @getSeconds timeReport

As a fun game your code in CoffeScript, Python, Ruby or other could be scored on how many parenthesis you have, while nested parenthesis gives linearly more points, and the goal is to have as a low score as possible. It would be a simple practice in static code analysis, especially if the program can give tips on lowering your score – like the inverse of Page Speed.

It could traverse GitHub or something to create a Highscore leaderboard, just for kicks. What more would be fun to measure unnecessary “improvements” in your favourite language?