38 comments

[ 5.2 ms ] story [ 99.3 ms ] thread
For those that are interested, I'm basically using lyrics-fetcher to conduct the song searches (via http://makeitpersonal.co) and Springy for the core visualization.
Nice job, Bob Dylan's songs are fun to watch on this
Thanks! I'm a HUGE Bob Dylan fan, incidentally :)
Eminem's songs can be used to stress-test the visualization
Excellent example of a stress test - of course it's people on HN who would think of doing something like this. I wonder if the whole genre of rap and hip hop is particularly difficult to process, due to the sheer number of words in each song.
Thanks for stress testing! I made a fix this morning to reduce the graph spazziness :)
Hah, I did something similar around ~2007 when I was at Last.fm and never got around to publishing it. Nice work!

This is the only example I can find lying around in my backups: http://jonty.co.uk/bits/radiohead_creep_lyricviz.png

Thanks, jonty. I like your layout choice, makes it more readable. What do the colors and arrow tips represent?
> What do the colors and arrow tips represent?

Dunno about the arrow tips, but seems like the slowly changing colors enable you to quite easily follow the original order of the lyrics. (except if the reader is color blind)

I actually had a version using force-directed layout very similar to yours, took me a while to decide on this version!

Each colour is a verse, fading through the spectrum.

An unfilled arrowhead shows a transition between words in a line of a verse, a filled arrowhead shows a transition between lines.

That's a pretty neat approach, maybe I should do something similar. Originally I color-coded the words (based on frequency) but having a gradual spectrum applied to the edges feels a lot more intuitive.
Really awesome work, something cool (but I have no idea how feasable) would be listening to the song while you jump around. Other than that awesome work
Great suggestion, I had originally wanted to create something like that, but I figure folks can just open up a separate YouTube window for that. Would also love to have the timing be in sync (ala Karaoke) but I'm not aware of any open database that stores that kind of metadata.
I believe MusixMatch has timing data (it's what the Shazam karaoke mode uses), however I'm unsure if the free API allows access to it. Worth a look though. https://developer.musixmatch.com
Thanks jonty, looks like a fine resource, though it's a bit expensive to use ($25000)
This is cool. Thanks for sharing. I tried a long song with a lot of unique lines and the detailed view is a jumbled mess that won't stop erratically moving. See Redemption's Sapphire for an example.
Haha yup - maybe not so great for epic ballads :)
yeah, try Lou Reed's Street Hassle ... ;-)
Thanks for stress testing, I made a fix this morning to reduce the spazziness :)
Nice idea (BTW: how does it cut text into sequences of words) abut the search is crappy (I tried a few times, no results). Maybe a single search (for both author and title) with references as you type? It would be really, really helpful.
Good suggestion, I had thought of having a single field earlier (delimiting artist and title with a '-') but I thought that most users might find it cumbersome.

To generate the final graph, I started by more or less splitting the entire song into a list of words, then iteratively rejoining fragments in an order based on frequency of occurrence.

Actually I meant without having to write it all (especially as artists have a few names, e.g. with different initials). So e.g. after writing "Rammstein" I would be getting "Rammstein - Sonne", "Rammstein - Amerika" etc.

So, something Google-like rather than SQL-query-like.

Oh do you mean auto-complete? Not that easy to support since I'm relying on a remote server for song lyric searches
I see. So in that case it would be great to have a predefined list of good (and well-know) examples.
Daft Punk's "Technologic" is entertaining:

https://i.imgur.com/JKxZ8zC.png

Nice work! Wish it had sharable URLs for specific songs.

Love it :) The share buttons actually use the current page you are on, but I can see how it would be much more useful to just update the URL based on the search pattern.

Until I fix that, here's an example of how to deep link to a particular search:

http://songbranch.com/?artistName=daft%20punk&songTitle=tech...

Where does the lyrics data come from? I've looked into lyrics datasets before for side projects, but copyright seems to be crippling everyone's attempts at providing them.
This is amazing! Well done. Blues flows beautifully. My colleague wanted to know if this uses d3.js?