Morning Star is a monophonic bassline synthesizer controlled by a step sequencer, designed to run on Web browsers and made entirely with HTML5 and Javascript (no flash).

It is built on the KievII Library and currently can fully run on browsers which support Firefox’s Mozilla Audio Data Api or Chrome’s Web Audio API, although it can run on every HTML5-compliant browsers that lack an Audio API. In that case, Morning Star will run in graphical-only mode (i.e. the GUI will work properly but you won’t hear any sound).

If you are unsure on what audio subsystem your browser supports, I suggest you to install the last stable version of Google Chrome or Mozilla Firefox for your OS.

Important: There have been reports regarding audio problems with Chrome, especially on Linux Ubuntu and Windows Vista. Web Audio API is wonderful, but it’s still under heavy developement. If you experience glitches or “stuttering” audio, please check this bug report and please take time to upload your traces to the Chrome developers (you can find extensive details in the bug report). Chrome developer build and Chrome Canary build should be immune from this issue, so you could download them until the bug is fixed.

The sound engine powering Morning Star is based on my Javascript port of 50m30n3‘s SO-404 Bassline Synth. Visit his site, there are a lot of cool projects.

Morning Star is very experimental code, so if you find some bug, you should drop me a line or take a look at the code.

If you experience problems with KievII library, you can write on KievII Google Group or take a look at the library’s code.

Finally, of course, you can launch the demo here.

Morning Star Synth Guide

Step Editor Section

Step Editor Section is the section where you can edit the state of the sequencer and select which step you want to edit, when in Edit Mode.

When in Play Mode, the step buttons will sequentially turn green to give you a visual information on which step the sequencer is currently playing.

Morning Star is controlled by a step sequencer. This means you can program a fixed grid of 16 steps per pattern, with a programmable number of pattern (up to 4).

Each step in a pattern could be in an active (= red button) or inactive (= white button) state. You can switch from active to inactive state (and back) by clicking on the desidered step button. This will also change the highlight, i.e. the yellow box that surrounds the current step you’re editing (for example, step 15 in the above figure). When a step is highlighted, you can set its corresponding note and velocity value in the Piano Roll section.

If you want to change the highlighted step, but you don’t want to change the step state (for example, you may want to to take a peek at the note / velocity value of a step), you can press above the step button, anywhere between the upper white lines. The yellow box will highlight the step you want, without changing its active / inactive state.

Piano Roll Section

Every step in the Step Editor Section has a corresponding note and velocity value. When in Edit Mode you can set them both in the Piano Roll Section.

This is pretty self explicative: the Piano Roll Sections makes you set (and gives you a visual hint of) the note/velocity associated to the current (highlighted) step. This also means that everytime you highlight a particular step, the Piano Roll Section changes its visual state accordingly.

Velocity is a knob which goes from a minimum value of 0 (no sound is heard) to a maximum of 127 (full volume), with a default value of 64, while the Piano Roll is a piano keyboard spanning 2 octaves. You can select or deselect a note for the highlighted step by pressing on it. When you select one, the key will be actually played to pre-listen the sound. Selecting a note key in the Piano Roll is the only action that makes a sound when in Edit Mode).

Pattern Controls Section

Pattern Control Section is the section in which you control the pattern number and the current edit pattern. Plus, it gives you a quick visual information about the pattern you’re currently editing – in Edit mode – or playing – in Play mode.

Patterns are sequential collections of 16 steps. Morning Star supports up to 4 patterns, for a maximum of 64 steps.

The first control you can see is the big red 4-state switch at the top, aka the Pattern Number Switch. Clicking on it, you can set the pattern length of your song. With 1 pattern, for example (like in the image above)  you can edit a total of 16 steps, with 2 pattern 32 steps, and so on. The big red switch always increases the number of patterns and operates in a circular fashion; for example, if you set it to 4 and click on it again, it will go back to position 1. In this case, you won’t lose the edits you made in the 2nd, 3rd and 4th patterns: you simply can’t edit or play them until you increase again the number of patterns clicking on the switch.

The - (minus) and + (plus) buttons change your current edit pattern. Again, they operate in a circular fashion and they are limited by the number of patterns, set by the previous switch. For example, if the Pattern Number Switch is set to 3 and you’re editing pattern 1, and you press the plus button twice, you will land on pattern 3. If you press the plus button again, you will go back to pattern 1, since the number of patterns in your song is 3. Similarly, if you are on pattern 1 in the same scenario and press the minus button once, you will end on pattern 3.

So, minus and plus button change the pattern you’re editing. For a quick reference, these changes are visually reflected on the red led series at the bottom. You can always know what pattern are you currently editing looking at the red leds: the lit one is the pattern you’re editing right now.

What’s the deal with the green leds? They’re activated when the instrument is in Playback Mode: just like the red leds show you which pattern are you currently editing, the green leds show you what pattern are you currently playing.

Play Control Section

In Play Controls Section you can switch to and from Playback Mode and Edit Mode and you can control whether the song, when played, loops endlessly until stopped or stops at the end of the last pattern.

When the Play Button is pressed, and the instrument is in Edit Mode, the song starts playing (= Play button becomes green and Stop Button becomes white). Some controls, such as the Step Editor and the Piano Roll Section, are deactivated (unclickable), when in Play Mode.

When in Play mode, if the Stop Button is pressed or the Play Button is pressed again, the sequencer will immediately stop performing the song and the instrument will be switched back to Edit Mode ( = Play button white, Stop button red).

If the Loop Button is active (= the button is green, like in the above image), the sequencer will loop back to the first step of the first pattern after the last step of the last pattern is played, and the song will loop forever until you stop it. If the Loop Button is deselected (= the button is white), the sequencer will stop after the last step of the last pattern, leaving you back to the Edit Mode.

In any case, when the Play Button is hit, the sequencer will start performing the song from Pattern 1, Step 1. As soon as a new step is played, the corresponding button turns green, which means “the sequencer is currently playing this step”.

Now, how does Play Mode deal with active / inactive steps? There are 3 rules:

• When a step is active and a note is selected for that step on the Piano Roll, the note will be played. Synth is monophonic, so any other note played before will be truncated.
• When a step is inactive, regardless of the note in the Piano Roll, nothing will happen.
• If, instead, a step is active, but no note is selected for it on the Piano Roll, the synth is silenced until another note is played. You can use this rule to insert pauses.

So, if you want to play a semibreve (1/16th) note and a pause, you can for example set step 1 to active, assign a note to it in the Piano Roll and set step 2 to active, without assigning a note to it in the piano roll. When played back, the sequencer will play the note on step 1 and immediately silence it when step 2 is played.
If, instead, you want to play a quarter note (1/4th) and pause, you  can set step 1 to active, assign whichever note you want to play to it in the Piano Roll, then set step 2, 3 and 4 to inactive, and finally set step 5 to active, without assigning a note to it in the Piano roll. The first note will play indisturbed for 4/16th (1/4th) and be silenced at the start of the 5th step.

Sound Controls Section

Sound Controls Section is a collection of 4 knobs that control, respectively, the amount of Envelope, Release, Cutoff and Resonance of the synth.

All these parameter are global. This means you can’t set a particular amount of Cutoff for a particular step / note (like you do with the Velocity Knob), but you can change these values dinamically even while you are in Playback Mode.

Miscellaneous Controls Section

Miscellaneous Controls Section is another collection of 4 knobs. They control the two Global FX (Distortion and Reverb) parameters and the global Volume and Tempo values.

The Distortion Knob controls the amount of global distortion (waveshaping) on the output of the synth. Values go from 0 (complete bypass) to 127 (max distortion). Again, this is a global parameter. You can’t set a per-step value but you can change its value even when in Playback Mode.

The Reverb Knob controls the amount of global reverb (convolution through an impulse response) on the output of the synth. Values go from 0 (complete bypass) to 127 (max reverb).
Caveat: since Reverb uses Chromium’s Web Audio API’s ConvolverNode Interface, this effect is currently unimplemented on browser that support Mozilla Audio Data Api, such as Mozilla Firefox.
Reverb is a global parameter.

The Volume Knob controls the global volume of the song. If you want to set a per-step volume, use Velocity in the Piano Roll Section. This parameter is global.

The Tempo Knob controls the global tempo of the song. Tempo ranges from 60 bpm to 180 bpm. You can change tempo during playback, but the new tempo value will be used only once the song is stopped and played back again.

Clear / Export Section

Clear / Export Section makes you quickly reset your song to the initial state, or export it to an URL.

Morning Star automatically saves all of your changes as soon as they take place. This means that if you edit your song, then close your browser window and go to sleep, your song is saved in the browser’s static memory. You can re-open Morning Star tomorrow in the same browser and your work will be there as you left it.

If you decide to discard your song (patterns, step and associated notes), you can do it pressing the Clear Button: this will make every step inactive, with no note associated and default velocity.

If you want to export your song to another browser, maybe on another PC, or if you want to save it somewhere, or post it to the Internet, you can press the Export Button: it will open a window with an URL that you can copy and paste wherever you want: everytime you open that URL in a browser, the song state at export time (sound and FX parameters included) will be restored.

Audio Info Section

Audio info section contains a visual indicator of the audio state (see image below).

The first indicator on the left tells you if a compatible audio API set has been recognized in the browser. It can be in the ON or OFF state. In the OFF state, you can (hopefully) use the GUI, but won’t hear any audio.

The second indicator (on the right) appears only if the first indicator is in the ON state, and gives you information which set of API the browser supports. Currently, Morning Star supports mozAudio (Firefox’s Mozilla Audio Data Api) and webAudio (Chrome’s Web Audio API).

LCD Display

LCD Display is a display that gives you further visual information on the values / parameters you set, such as the current pattern, the number of patterns, the sound controls and the fx / tempo / volume controls.

Tags: audio, html5, kievii, morningstar, mozaudio, synth, webaudio, webaudioapi

This entry was posted on Wednesday, January 25th, 2012 at 1:00 pm and is filed under Audio, KievII, MorningStar. You can follow any comments to this entry through the RSS 2.0 feed. You can leave a comment, or trackback from your own site.