4 ms·

Show HN: RC-455 – A WebAudio Synthesizer

35 points by BarakChamo 11y ago

mfkp 11y ago
Wow, very cool implementation, fun to play around with. The "knobs" are a UX nightmare with a touchpad on my laptop though, nearly impossible to use. Sometimes replicating a physical object doesn't translate well to the web - a simple slider (input type=range) would be much more effective here.
- BarakChamo 11y ago
  Thanks mfkp! Yeah I know what you mean, I have an open issue to fix touch screen handling. I didn't have a touch screen handy but I'm hoping to fix it soon. I wanted to play around with realistic UIs but I agree that sometimes digital interfaces like a slider are much more intuitive.
  - JonnieCache 11y ago
    Nothing digital about a slider. The Juno, the SH-101, loads of classic synths had sliders.
    - BarakChamo 11y ago
      Yeah you're right JonnieCache, I meant a more physical-like interaction but sliders are as well.
  - mbrock 11y ago
    Maybe you could delegate scroll events to a scroll area a few hundred pixels tall (or roughly the knob circumference?), and then bind the knob value to that area's scroll percentage.
  - chipsy 11y ago
    I surveyed my own VSTs when I went to implement a synth UI knob and discovered that most actually behave like a y axis slider. A few, like Synth 1, will teleport the cursor to an actual slider as you start dragging. The ones that try to make you literally "turn" it are by far the exception. As for other feedback... it's unusable for me. Notes are triggering unexpectedly or get stuck, the interface goes unresponsive for seconds at a time and then suddenly catches up. I haven't been able to see what the knobs are like on this program because of the unresponsiveness. Tested Firefox 42, Chrome 46.0.2490.86 m. I can play a few chords, at least. It reaches hard clipping distortion easily when I do that.
  - pistle 11y ago
    Sliders are far less buggy to implement and more intuitive on a 2d surface. Check out Roland's 101, Juno 106, Juno 60, Jupiter series, Arp Odyssey, 2600, etc. etc. etc... You won't be breaking any analog rules. Knobs are mostly en vogue because modern modular and Moog, but sliders are still on new products (Roland System100 modular revival/re-invention stuffs) There are variations on how a knob "works" with a cursor and this leads to guessing, if not bugs in the implementation.
  - BarakChamo 11y ago
    Huh... these are pretty cool ideas on implementing knob UIs without the actual knob turn. I'll try working on a more reliable implementation, with a slider or a drag area and just map the values.
- anon4 11y ago
  I tried clicking and dragging the knobs, nothing happened and I concluded they're non-interactive. What mouse interaction do they respond to?
fit2rule 11y ago
Nice idea, but .. Just thought I'd better report: Doesn't work for me at all on OSX, Safari 9.0.1 .. on Firefox 42.0, it works, but the GUI renders improperly and the controls don't respond to mouse events, but it plays sound when I hit the QWERTY keyboard .. Chrome 46.0.2490.86, it renders the GUI properly, plays sound, but doesn't really react to mouse events on the knobs as smoothly as I would expect of a synthesizer - very jerky. Also, presets don't seem to work.
- BarakChamo 11y ago
  Thanks for reporting fit2rule! It's weird, I'm running it well on Firefox and Chrome on OSX but I'll test on other setups. The presets should be empty to begin with and only save ones you want locally.
  - imglorp 11y ago
    Linux FF 42.0 here. Playing notes works but nothing else like the knobs respond to mouse inputs.
Jimmed 11y ago
This is great fun to play around with - if I'm not careful I'm gonna get completely distracted from doing any work today... Just to chime in on others' comments, the knobs are pretty unpleasant to use, even with a mouse. I think though, Ableton has spoiled me with regards to knob/slider UX. Awesome work!
- BarakChamo 11y ago
  Cheers Jimmed! I know exactly what you mean with Live, it's so smooth! I'm working on a web-based VJ project right now and it's a lot more like Ableton, slick and minimalistic.
ogig 11y ago
It looks awesome, but it's unusable under my chrome + ubuntu. Any parameter tweak i tested results in a huge lag, sometimes making the tab stop responding.
- BarakChamo 11y ago
  This is so weird, it's running well for me but obviously buggy for many. Do you mind telling me which parameters caused issues? and what machine are you running on?
  - bchjam 11y ago
    fwiw I got reports of inconsistent/unreproducible performance issues when I was working on a webaudio synth project last year. Never figured if it was down to audio hardware or what but I have seen a couple upgrades of Chrome that performed weird, tho webMIDI API was still shifting a bit
    - ogig 11y ago
      I confirm this. My webaudio project was halted because I couldn't figure out why the cpu usage kept going up. After some chromium lists reading I decided to give them some time to polish the api. Some months later the same project was working as expected.
  - ogig 11y ago
    I tested again and seems to be on every knob. It goes like this; i change a parameter, the "led ui" on the synth shows the param name and a value and it freezes for some 40-50secs. During that time ui is totally unresponsive. After the freeze time the ui might come back, maybe burst a note or two, or might hang like that forever. My computer is an old core 2 quad, but i'm working on a webaudio project myself and by my estimation it should be able to handle your synth easy. Also, in case it helps. I've found some hard to debug webaudio issues, like osc hanging in forever and 'cpu leaks', but your issues seems more related to how the ui is updating the audio graph.
tempodox 11y ago
This wins the cup in the Most Nonfunctional Website category.
guruslead 11y ago
need a hacker? to track a cheating spouse, mails, facebook, whatsapp, credit, database and all forms of hacking, contact the hack guru. demon_teco@gmx.com. you can learn hacking too

35 points by BarakChamo 11y ago

mfkp 11y ago

Wow, very cool implementation, fun to play around with. The "knobs" are a UX nightmare with a touchpad on my laptop though, nearly impossible to use. Sometimes replicating a physical object doesn't translate well to the web - a simple slider (input type=range) would be much more effective here.

BarakChamo 11y ago
Thanks mfkp! Yeah I know what you mean, I have an open issue to fix touch screen handling. I didn't have a touch screen handy but I'm hoping to fix it soon. I wanted to play around with realistic UIs but I agree that sometimes digital interfaces like a slider are much more intuitive.
- JonnieCache 11y ago
  Nothing digital about a slider. The Juno, the SH-101, loads of classic synths had sliders.
  - BarakChamo 11y ago
    Yeah you're right JonnieCache, I meant a more physical-like interaction but sliders are as well.
- mbrock 11y ago
  Maybe you could delegate scroll events to a scroll area a few hundred pixels tall (or roughly the knob circumference?), and then bind the knob value to that area's scroll percentage.
- chipsy 11y ago
  I surveyed my own VSTs when I went to implement a synth UI knob and discovered that most actually behave like a y axis slider. A few, like Synth 1, will teleport the cursor to an actual slider as you start dragging. The ones that try to make you literally "turn" it are by far the exception. As for other feedback... it's unusable for me. Notes are triggering unexpectedly or get stuck, the interface goes unresponsive for seconds at a time and then suddenly catches up. I haven't been able to see what the knobs are like on this program because of the unresponsiveness. Tested Firefox 42, Chrome 46.0.2490.86 m. I can play a few chords, at least. It reaches hard clipping distortion easily when I do that.
- pistle 11y ago
  Sliders are far less buggy to implement and more intuitive on a 2d surface. Check out Roland's 101, Juno 106, Juno 60, Jupiter series, Arp Odyssey, 2600, etc. etc. etc... You won't be breaking any analog rules. Knobs are mostly en vogue because modern modular and Moog, but sliders are still on new products (Roland System100 modular revival/re-invention stuffs) There are variations on how a knob "works" with a cursor and this leads to guessing, if not bugs in the implementation.
- BarakChamo 11y ago
  Huh... these are pretty cool ideas on implementing knob UIs without the actual knob turn. I'll try working on a more reliable implementation, with a slider or a drag area and just map the values.
anon4 11y ago
I tried clicking and dragging the knobs, nothing happened and I concluded they're non-interactive. What mouse interaction do they respond to?

fit2rule 11y ago

Nice idea, but .. Just thought I'd better report: Doesn't work for me at all on OSX, Safari 9.0.1 .. on Firefox 42.0, it works, but the GUI renders improperly and the controls don't respond to mouse events, but it plays sound when I hit the QWERTY keyboard .. Chrome 46.0.2490.86, it renders the GUI properly, plays sound, but doesn't really react to mouse events on the knobs as smoothly as I would expect of a synthesizer - very jerky. Also, presets don't seem to work.

BarakChamo 11y ago
Thanks for reporting fit2rule! It's weird, I'm running it well on Firefox and Chrome on OSX but I'll test on other setups. The presets should be empty to begin with and only save ones you want locally.
- imglorp 11y ago
  Linux FF 42.0 here. Playing notes works but nothing else like the knobs respond to mouse inputs.

Jimmed 11y ago

This is great fun to play around with - if I'm not careful I'm gonna get completely distracted from doing any work today... Just to chime in on others' comments, the knobs are pretty unpleasant to use, even with a mouse. I think though, Ableton has spoiled me with regards to knob/slider UX. Awesome work!

BarakChamo 11y ago
Cheers Jimmed! I know exactly what you mean with Live, it's so smooth! I'm working on a web-based VJ project right now and it's a lot more like Ableton, slick and minimalistic.

ogig 11y ago

It looks awesome, but it's unusable under my chrome + ubuntu. Any parameter tweak i tested results in a huge lag, sometimes making the tab stop responding.

BarakChamo 11y ago
This is so weird, it's running well for me but obviously buggy for many. Do you mind telling me which parameters caused issues? and what machine are you running on?
- bchjam 11y ago
  fwiw I got reports of inconsistent/unreproducible performance issues when I was working on a webaudio synth project last year. Never figured if it was down to audio hardware or what but I have seen a couple upgrades of Chrome that performed weird, tho webMIDI API was still shifting a bit
  - ogig 11y ago
    I confirm this. My webaudio project was halted because I couldn't figure out why the cpu usage kept going up. After some chromium lists reading I decided to give them some time to polish the api. Some months later the same project was working as expected.
- ogig 11y ago
  I tested again and seems to be on every knob. It goes like this; i change a parameter, the "led ui" on the synth shows the param name and a value and it freezes for some 40-50secs. During that time ui is totally unresponsive. After the freeze time the ui might come back, maybe burst a note or two, or might hang like that forever. My computer is an old core 2 quad, but i'm working on a webaudio project myself and by my estimation it should be able to handle your synth easy. Also, in case it helps. I've found some hard to debug webaudio issues, like osc hanging in forever and 'cpu leaks', but your issues seems more related to how the ui is updating the audio graph.

tempodox 11y ago

This wins the cup in the Most Nonfunctional Website category.

guruslead 11y ago

need a hacker? to track a cheating spouse, mails, facebook, whatsapp, credit, database and all forms of hacking, contact the hack guru. demon_teco@gmx.com. you can learn hacking too