Virtual Hang Web Audio App is Released

Virtual Hang is a Web Audio App that uses the Web Audio API to recreate a Hang, a steel hand pan instrument. The Hang is an amazing musical instrument developed in Bern, Switzerland about ten years ago. This virtual instrument is based on the work I did for my Virtual Kalimba.

Virtual Hang Web App

* Keep in mind you need Chrome for this web app to work!

The Hang was developed by Felix Rohner and Sabina Schärer in Bern, Switzerland. The instrument is constructed from two half-shells of steel glued together at the rim leaving the inside hollow to create a resonator effect. The top (“Ding”) side has a center ‘note’ hammered into it and eight ‘tone fields’ hammered around the center. The bottom (“Gu”) is a plain surface that has a tuned sound hole in the center. This opening combined with the air volume in the body of the Hang act as a resonator.

This web app allows you to play a Virtual Hang in your browser. It uses the Web Audio API to load audio files into a buffer and trigger them when a user hovers over the sound fields. Version 1.0 was finished on 04/19/2013. At this point, it’s basically just like my Virtual Kalimba with a few differences. First of all, the audio source files are obviously different. Also, a new interface has been designed to match the circular array of a real Hang.

Virtual Hang 1 Interface

The Virtual Hang is modeled after a first generation Hang with an central Ding surrounded by eight tone fields. It is tuned to a D Hijaz kar scale, also known as the Persian Scale. This scale consists of the following notes: D, E flat, F sharp, G, A, B flat, C sharp. The tone fields span one full octave from D4 to D5 beginning at the bottom and alternating from left to right. The Ding is tuned to A3 which is a low fifth. The Gu side is currently not available.

Control Panel

The control panel and keyboard shortcuts are exactly the same as the Virtual Kalimba, but these will most likely be adapted in future versions to compliment the nature of the Hang.

Virtual Hang 1 Control Panel

Options Menu

There is an options menu that toggles hidden content. Pressing one of the buttons shows content from the corresponding section. Pressing another button hides the visible content and shows it’s content instead. To hide the contents from any open section, simply press it’s corresponding button in the menu.

Virtual Hang 1 Options Menu

Virtual Hang Web Audio App is Released

Virtual Hang version 1.0 is now available to everybody. Of course, there’s still room for improvement. No need to worry though, because I’ll continue making it better by applying my knowledge of the Web Audio API to my passion for melodic percussive music.

Go ahead and try it. I welcome any suggestions for improvement you might have. Just leave a comment below and I’ll see what I can do about implementing it. Keep in mind you need Chrome for this web app to work!

Or check out the official Virtual Hang Documentation Page

2 thoughts on “Virtual Hang Web Audio App is Released

Leave a Reply

Your email address will not be published. Required fields are marked *