Backbars on social link-sites
, from its UserScripts page. (You need to have the GreaseMonkey Firefox extension, version 0.8 or more, installed first.)
Backbars on social link-sites is a GreaseMonkey script to turn the headlines and comments of social link-sites into ambient bar charts (of votes/diggs/views/users…) It works on Reddit, Delicious, Digg, Hacker News, and Stack Overflow (and MetaFilter now!).
The idea is to give you subtle non-verbal clues to improve your browsing experience almost subconsciously. The backbars don’t replace the count they represent, what they do is convey you its magnitude unobtrusively, and, crucially, compare that magnitude to those around it. So you can now see, almost without thinking, that, say, some comment is popular, but that there’s a comment around that’s twice as popular.
Once you have it, just start browsing at your favorite social link-site: Reddit, Delicious, Digg, Hacker News, and Stack Overflow.
It’s the first release but it’s very usable already, I hope.
I hope you enjoy and find it useful, please let me know what you think of it in the comments.
Here’s what the backbars mean:
For Reddit, they are a headline’s votes, a headline’s number of comments, and a comment’s votes. For Delicious, the numbers of users that have bookmarked a link, or applied a tag. For Digg, a headline’s diggs, a headline’s number of comments, and a comment’s diggs. For Hacker News, a headline’s upvotes, a headline’s number of comments, and a comment’s upvotes. For StackOverflow, a question’s views, an answer’s votes, the number of users that have applied a tag, and a user’s reputation score. For Metafilter, an article’s number of comments and the number of users that have favorited a comment.
There are some other very minor special cases too, but hopefully they are self explanatory by their context.
(Javascript geeks might want to take a look at the source code, it can get messy as all scraping, but I think it’s a good example of the power and elegance that Javascript and jQuery allow.))
Changelog: June 12, 2009: Stopped messing Hacker News’ comment threading sometimes. June 12, 2009: Added support for MetaFilter! (Note that in MeFi, at most 200 backbars will be drawn, or not at all, for performance reasons.) Made comment author backbars more accurate. Jan 17, 2010: Added the script to github, http://github.com/elzr/Backbars/, to continue its development there. Everyone’s invited to pitch in! Changed to minified jQuery.
18 Comments
The app works really good. I even didn’t have to ask a stupid questions this time around :D.
What are ambient histograms? The pics are way to small to be useful here.
Histograms of what? Amount of comments, or karma? It is confusing that clicking on the images just leads to original sites, which don’t have histograms. Just larger versions of the screenshots would be nice.
Ah, sorry! Such an oversight! (You get so involved in a project you think it’s all natural…)
The histograms are:For Reddit, they are of a headline’s votes, of a headline’s number of comments, and of a comment’s votes.
For Delicious, they are of the numbers of users that have bookmarked a link, or applied a tag.
For Digg, of a headline’s diggs, of a headline’s number of comments, and of a comment’s diggs.
For Hacker News, of a headline’s upvotes, of a headline’s number of comments, and of a comment’s upvotes.
For StackOverflow, of a question’s views, of an answer’s votes, of the number of users that have applied a tag, of a user’s reputation score.
There are some other minor special cases too, but they should be self explanatory by their context.
In fact, hopefully all of it is obvious once you install the script.
Adding larger versions of the screenshots in a sec..
Done! Thumbnails link to larger versions of screenshots now!
Good job with this!
Um, it would be nice if it worked for metafilter, for which backbars of colour 004D73 would be handy. I tried passing different values to changeBkg() but there was nothing doing :(100 downloads of the script! The people at Hacker News seemed to like it !
Eldila: I’m happy it’s working well, at the first try this time! :)xbat: It works on MeFi now! What an oversight on my part! Thanks for the tip, I even used your very cool choice of color. Heh, it’s great you peeked at the code, changeBkg sure looked like a suggestive blackbox, didn’t it? But it doesn’t create a new background, it just fetches it from the server.
I wanted to make the MeFi backbars work take each day as their context (instead of the whole page) but their code is unstructured and it proved too much a mess. Maybe for next time. Also, MeFi backbars are only drawn when there are less than 200 items, performance is too bad here. Some parts of jQuery don’t work or work tremendously slowly under GreaseMonkey. I’ll have to ask the mailing list…It seemed cheeky to suggest a change without even trying to make it myself.
Here’s another one: the subscriptions list of Google Reader (this thing) has counts of unread blog entries. Might be tricky though, it is AJAXy and auto-refreshes.This is exceedingly clever. Wish I’d thought of it.
In an early design fr delicious, i did have the bars – but they varied in intensity, not size:http://www.flickr.com/photos/joshu/765840453/in/set-72157600740166824/
joshua schachter: Thanks for the kind comment!
I’ve contemplated overloading the backbars by varying their intensity but that would easily make text hard to read, which I guess was the reason you dropped them, right?Never knew delicious implemented something like it (clever of you to keep historical screenshots), that’s cool to know! Your liking the idea is yet another instance of Schank’s law :)
That’s fantastic! The improvement to the tag listings is quite spectacular—I hope this is adopted everywhere.
I had the same trouble as xbat with trying to change colours, but I took it seriously and put too much time into generating the images directly within the script. Many thanks for inspiring me to a fun side-project.
Sam Angove: Wooooow. And I thought I was a geek :) That’s amazing man! Data URIs are way cool, and I was particularly impressed by your abstracting of jQuery.
I also don’t like the brittleness and rigidity of the dependence on my website for the backbars. I’ve been thinking that with some hackish CSS plain DIVs should be able to take the place of PNGs. That’ll be the next version!
I’ve run into a bug with your (otherwise really nice) script on Metafilter; if a person has the Mefi Deleted Posts script enabled alongside it, the back bars don’t appear. I’m going to poke at it in Firebug and see if I can send a patch, if I find a fix for it.
This script isn’t working for me on the Metafilter main page any more. It still works on the Popular Favorites page for some reason. Please hope me?
This is a great idea but unfortunately on “busy” pages it’s too slow, to the point that FF alerts me to stop a long running script (greasemonkey). For example, on this reddit page, it takes ages: http://www.reddit.com/r/programming/comments/9×15g/programming_thought_experiment_stuck_in_a_room/c0ev6lj.
It doesn’t seem to work on the Metafilter subsites (Ask, MetaTalk). But I like it on the front page!
How about Google Chrome, Safari GreaseKit, and Opera support? I can do it, if you put the script on github.com.
Nikita Vasilyev: Thanks for the offer! I uploaded the original GreaseMonkey script and a simple README of goals to http://github.com/elzr/Backbars/ Everyone’s invited to pitch in! :)