Soundslice – Living Sheet Music | Hacker News Reader

Soundslice – Living Sheet Music

soundslice.com

175 pointspc8651 comments

Thanks for the post. I made a short video demoing some of the features here, like zooming/responsiveness/snapping: http://www.youtube.com/watch?v=tq1go7Ld1Q4

It is amazing to see how far HTML and JS have come. What are using for the audio engine when in "synthetic" sound mode? Do you render a custom performance on the fly from pitch samples, or play from a pre-computed mp3/wav?

I've used http://www.songsterr.com before, which is almost identical to this, except it uses Flash. One thing you might consider, to compete with them, is a larger library. I'm pretty sure they built their massive (practically complete) library from pre-existing GuitarPro tabs. From your docs, it looks like you can read GuitarPro tabs, so it might be worth doing a massive import. Not sure about the legality of this, but it is worth considering. I'm pretty sure songsterr basically went from non existing, to having almost every song ever created when they launched. The only way they could do this is using GuitarPro tabs. I wonder if they have a licensing deal with the copyright owners? Anyway, I'm definitely interested in how you do sound in Javascript. Cheers for a fantastic UI and a beautiful design.

Synthetic are ripped from this file: http://d2c3nvafyekx5z.cloudfront.net/soundfonts/piano.oga

It's surprising how seamless it works. This would be the sort of thing 18-24 months ago that we'd argue Flash would hold over traditional web. Not anymore.

EDIT: With a bit of JS and audio hacking you could actually replace the synthetic sounds with something from here: http://soundfonts.homemusician.net/ I'm sure they plan to add additional "soundfonts" as they call them later on. Can only assume that piano works best.

Indeed we've created a web app that plays a playlist On multiple devices in sync using the web audio API.

It works in iOS and in any modern version of chrome.

Yes, you're exactly right about how it works. We'll be adding other soundfonts soon. Piano worked the best for launch, but it'd definitely be better with instrument-appropriate sounds.

Adrian @ Soundslice

You don't know how to read music? You're the best guitar player I know, playing one of the most difficult styles of guitar I know (Gypsy Jazz). And to top it all of you wrote a sheet music rendering engine! This is very funny :) Way to go!

Imagine my pleasant surprise, when, after becoming a huge Gonzalo Bergara and Adrien Moignard fan, I see a video of a guy who's name I vaguely recognize playing with them. Then I realize thats the guy who invented the web framework I use for most paying jobs. Small, interconnected world! You are a good player Adrian! and how amazing are those two guys I mentioned?

You'll probably like this talk by Adrian about the history behind soundslice http://www.youtube.com/watch?v=4fmU1ZXNov8

I love Gonzalo and Adrien! Two of my favorite guitarists, and they're super nice people.

I'm always amused when worlds collide (Django the framework, Django the musician, Soundslice the product). Thanks for the nice words. :)

If you're looking for an open-source sheet music renderer, I'd point you to http://www.vexflow.com/, which can render to Canvas or SVG (using Raphael for the latter). It's a barebones visual rendering library, so audio and things like MIDI interpretation/beautification are out of scope, but there have been various experiments making editors and different cool applications with it. It's MIT licensed and decently documented, too!

Also of note (haha) is http://www.noteflight.com/ which has a fully functional Flash editor and is slowly but surely reaching feature parity on a beta HTML5 version. I'm excited that there's competition in the space - it can only lead to great things!

I don't get it. What is the product/service here? I search for songs, but I only find crude YouTube videos. In the demos there's a song with a guitar tab, but no sheet. Apart from the landing page demo I couldn't find any sheet music. I don't know who transcribes the sheets, who select the songs, I don't know anything.

Soundslice is a service where you can transcribe music easily. Many sites that offer "guitar tabs" use either an ASCII-based format or files for GuitarPro and similar programs. Soundslice allows you to transcribe directly from a YouTube video, so you get the original sound together with the tabs, looping, slowing down and the ability to transcribe songs yourself.

Here's an example: http://www.soundslice.com/tabs/2865/adrian-holovaty-everythi...

Now they've launched a sheet-music player that's featured on the homepage. Adrian has posted an article about it on his blog: http://www.holovaty.com/writing/soundslice-sheet-music/

Currently, only they transcribe the sheet-music, via their Pitch Perfect program: http://www.soundslice.com/pitch-perfect/

While it's cool, they only have 7 songs or artists. All of these artists aren't particularly well known. Usually when I see stuff like this, I assume that getting the rights to the songs people actually want to learn how to play is too expensive, so this sort of thing never really takes off. Well, not never, I just have never seen something as cool as this really get going.

I would love to practice guitar with something like this. Hopefully they start to offer more songs.

> I would love to practice guitar with something like this. Hopefully they start to offer more songs.

That's my hope as well. It's good to see someone attempting to compete with ultimate guitar, which lets be honest, hasn't done a damn thing to improve their site in the last 10 years.

Absolutely.

I won't lie, I've totally stagnated in playing because most learning resources are awful.

Ok, I understand now, but it isn't well explained in their site.

Aren't there any services out there for sharing of music played alongside the sheet, just like they do in the example, mostly for classical music?

Here is it: http://www.notezilla.io/

> This is not an open-source project that succeeds and fails on the whims of its developers

This is on the licensing page. So not being open-source is now a strong selling point these days, apparently.

Ooooh, they have Ewan Dobson: https://www.soundslice.com/pitch-perfect/ewan-dobson-tabs/

Also, this looks like a pretty kick-ass sheet music engine. I've never thought about it before, but using HTML and CSS for responsive and stylable sheet music seems like an excellent fit. If only this tech was open source!

Oh yeah, Blood and Ice. Talk about a stress test of a sheet music engine.

On my 720p display, I'm unable to glimpse into the second line when I'm at the last bar. This makes everything unplayable to me.

Two lines should be visible at all times, possibly even with a continuous vertical scroll. (And in case I'm missing something and two lines are visible on larger displays: Make it zoom.)

He demonstrates the zooming slider in the video..

Cool idea! Especially love the time stretch playback speed slider. Impressive rendering interface as well.

As an instrumentalist, I'd probably like a more touch friendly interface so I don't have to drop my equipment (bow, pick, etc.) to pick up my mouse and just finger the interface.

Doesn't that work already? He did mention that it works on phones and tablets.

I'm sure it works well enough, but some control elements, like the sliders looked a little fidgety for my fat fingers.

If the demo on the front page isn't working for you and you have HTTPS Everywhere installed, disabling it temporarily seems to work.

Sorry about that. It's fixed now!

Just a heads up, the demo wasn't working for me properly using HTTPS everywhere as well. The music would play, but nothing aside from the progress bar/slider would show in the white box, and the full demo never got past reticulating splines.

The issue went away after disabling HTTPS everywhere and restarting FF.

FF 27.0.1 on Win7 x64.

The demo is still broken for me. Using FF 28.0, HTTPS Everywhere. All I see is a red line on a white background when I hit the play button.

I'm surprised this has been around since late 2012 and I've only just heard of this now.

The Youtube section I think was the drawcard for me, really neat UI.

When I view your website in my browser (safari 5.1.10 on Mac OSX 10.6.8), the home page refreshes every second or so. This is unlikely to be good for your servers.

Looks great. In the demo, the sound seems a bit weird and off-putting when the speed is set to slowest. Not sure if that is unique to that song or otherwise fixed.

That's just a thing that happens, I don't think there's a way you can 'fix' it.

Sorry, GuitarPro beat you to the punch by about 8 years.

You have a point. Innovation ends when one company achieves success.

Ok, let's assume SoundSlice never adds any feature that Guitar Pro doesn't have already, never goes after a different market, never interacts with customers differently, etc. etc. Just doing it in a browser is a very interesting thing. With just a little more love it looks like it will be fully mobile ready. And you can embed SoundSlice in any page on the web. They seem to be more interested in making the raw technology and partnering with others - who knows, maybe there will be music players for musicians with a "learn this" button. And Soundslice is two-person company, with one codebase, versus Arobas' 20 people and different apps for every platform. Totally different cost structure.

What are they using for the music rendering?

I wrote a sheet-music rendering engine in JavaScript. It's all our own stuff.

Very impressive. The only other javascript renderer I know of is vexflow (http://www.vexflow.com/). I think the output of yours is superior (the vexflow slurs and ties are way too heavy among other issues).

Any reason you didn't go with lilypond or some other existing solution? (Reading a bit more on your site it sounds like licensing the rendering is part of your business model. I may have answered my own question.) Also, I'm glad you using Behind Bars. It's a great reference.

One comment: I think your tuplets can use some work. They seem too large to my eye and sometimes they are too far from the beam or notes (see about 8 measures from the end in the auld lang sine). Tuplet numbers are allowed to collide with the staff lines. However Gould recommends that they not be wholly within the staff.

how are the notes represented pre-render? time, pitch, duration? or like midi on off events. Would you ever consider open sourcing your engine?

looks like the sync is off on Safari - playback header is ahead of the notes, and the gap increases over time.

Totally dig this. Just a small nit, a volume control on the main page would be great.

It works great (well, a lot better than expected) on mobile devices! Nice job.

Just to make sure—this is only for guitar, right?

Not just guitar. Any instrument whose sounds can be expressed in sheet music, so basically any mainstream instrument. :-)

might want to make this more obvious. I went looking for piano and didn't see any demos.

On a preview page, where is the Buy button?

Good idea. We should add that. :-)

Any plans for vocals as well?

love it. reminds me of that guitar player pro program.

Awesome job dude!

are there any open source libraries that is dedicated to interactive sheet music like the one on soundslice? It's really well done.

Reply on news.ycombinator.com