ajax star rater.

Now that I’m as good as healed and it’s one down and one to go on the book front, I’m making a concerted effort to break the long silence created by maintaining a life while writing and working with a broken collarbone. I’m going to start profiling some of the library projects I’ve been involved in since I arrived at Berkeley, the most recent of which is an awesome interactive star ratings bar app customized by Erik Rumppe of our Systems department. I recently integrated this rater into a redesign of our local library tutorials page:


The page used to  look like this:


And now looks like this:


With input from an informal working group that manages tutorial content across the libraries, the redesigned page was intended to be more visual, navigable, and less, ahem, u-g-l-y, while giving users a means of providing a bit of feedback on the tutorials to help us evaluate and prioritize them. For those of you on the webdev tip, the dropdown anchor jump menus are powered by javascript – check out the source code for an elegant solution to the proverbial long-list-of-links (hats off to Todd Parks in Systems for help resolving php/javascript issues).

You can find the template for the “Unobtrusive AJAX Star Rater” (and could there be a more hilariously utilitarian name?) at Masuga Web Design.  Erik checked for security and interoperability, made a few aesthetic changes to get our stars looking more Netflixy, and also created a behind-the-scenes database page that tracks and averages the number of ratings for evaluation purposes.

Many thanks to Erik and Todd for being so (unobtrusively) awesome.

6 thoughts on “ajax star rater.

Add yours

    1. i know, right? while we have a developer-side cms for editing (SVN) and support drupal locally, this part of our site is as of yet not drupalized in terms of its design/management.

  1. Nice work–and I’m sorry to hear (belatedly) of the broken collarbone. Hope it’s healed, or healing quickly.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Powered by WordPress.com.

Up ↑

%d bloggers like this: