Live data from Hacker News

Hacker Slide: HN front page over time

hackerslide.com

1–10 of 32 posts

Re: Hacker Slide: HN front page over time

#3
Oh, please, please someone toss in some animation (and also expand the sample set to a much longer time frame).

By animation I mean that the transition between two "frames" should be titles moving smoothly between positions. It would need some clever use of color and exact path to make it legible.

The user-facing purpose of such animation is to make it easier for people to perceive (viscerally) the bouncy dynamics of the ranking system.

(It's a neat hack as is, too, of course.)

Re: Hacker Slide: HN front page over time

#4

Would be nice to see the articles coloured by the change in their movement since last version, one colour for rising another for falling.

...reword: some way to quickly perceive each entry's change from the previous time step. Maybe color?

Separate the requirement from the solution.

Re: Hacker Slide: HN front page over time

#6
post #5

I saw a post in Reddit doing frontpage snapshot yesterday http://redditsnapshot.sweyla.com/ and thought to myself, this is pretty cool; I should make one for HN. Today someone already has done it. Congrat.

I had the same thought (as you can tell!) and thought that after the whole *Instant fad, I should quickly whip something up since I had a few spare hours ;-)

I'm a little perturbed by the whole "whip something out in a few hours" craze of late but have adopted a "if you can't beat em, join em" approach for the moment.

Re: Hacker Slide: HN front page over time

#7
Thanks for the interest folks!

As mhill notes, the inspiration for this was http://redditsnapshot.sweyla.com/ but I decided to go with sliding through hours rather than days due to the lack of data. I quickly realized, though, that even having the last 48 hours or so would be useful to me in order to "catch up" with items that pass too quickly from the front page overnight/etc.

Several people have suggested adding colors or other notifications of "new" items appearing over time, movements up and down, etc, and I'm adding some stuff to track that and will add CSS classes to signify those events.

I'm also planning to upload the code to GitHub once I clean up a horrible tab mismatch disaster that befouled it..

For anyone who cares about such things, it's currently a Ruby based "crawler" that runs once a hour and saves the items into JSON files which the then almost-pure-JavaScript page loads as you use the "selectToUISlider" control built by Filament Group, see http://www.filamentgroup.com/lab/update_jquery_ui_slider_fro...

Re: Hacker Slide: HN front page over time

#8
post #3

Oh, please, please someone toss in some animation (and also expand the sample set to a much longer time frame). By animation I mean that the transition between two "frames" should be titles moving smoothly between positions. It would need some clever use of color and exact path to make it legible. The user-facing purpose of such animation is to make it easier for people to perceive (viscerally) the bouncy dynamics of…

(and also expand the sample set to a much longer time frame)

Sure - it only started to collect data about 10 hours ago but that's certainly the plan.. though I've realized it's already useful for me to catch up with HN while I was asleep.

Regarding animation, thanks for the idea. I'm really just a JavaScript "dabbler" but I'll have a think about how it could be done. Rather than just rendering a JSON file into HTML it seems I'd need to start storing the data as it comes in and perform manipulations as necessary. This might be a bit too much for me for a quick project but I'm open sourcing the code so it could happen.

Re: Hacker Slide: HN front page over time

#9

Would be nice to see the articles coloured by the change in their movement since last version, one colour for rising another for falling.

Wouldn't a constant, distinguishable color per article work better with visual perception? Generating the color using a function on the title itself would seem nice, simple solution to test.
Post reply on HN