THE MAIN FUNCTIONS
the concept of rocking keyboard
The idea was to create a simple music app with self recorded rock sounds that works as a small standalone program (1996) or in the web browser. This ‘Website app’ is built like a simple eight polyphonic sample player. Because the pitch cannot be changed in HTML - Audio, each sound has its own sound sample.
the start window
To really play all 49 sound files halfway in real time, each file is played once at ten times speed to get it into the browser's cache. For each file there is a maximum waiting time of two seconds, if it is not received it is the next file's turn.
When finished, the start window is closed automatically. If some files could not be loaded, an error message will be displayed at the end.
In this case you can press the reload 
- key later. Then all sound files will be called again.
the ► skip loading - key
If Rocking Keyboard has been run recently, the start window can be skipped with Skip loading or also the esc - key.
the colored keys on the keyboard
The colors of the keys indicate the respective instrument: blue = solo guitar, green = power chords, yellow = bass, red = drums. There is a tooltip for each note - so hover over the keys and wait for the info window.
Or just press any key to find out which notes sound where.
the volume fader
With the slider on the right side you can adjust the volume. The default is 50%, so it can be much louder. The ↑ and ↓ cursor keys on normal-sized keyboards do the same.
the guitars polyphon / monophon - key
In the default setting, the two guitars are each controlled monophonically. This means that just like natural guitars, only one power chord or solo note can be played alone. If you would like, you can also switch the guitars to polyphonic mode. Then several guitar notes can sound simultaneously, which sounds more like a synthesizer.
the voices - key
By default, the eight audio channels, here called "voices", are displayed below the keyboard with their color-coded function states. If this display is more irritating than helpful, you can hide it by pressing the "hide voices" button. When you open the manual, this display also disappears to make room for the voices.
More information about the functionality of these voices can be found in the chapter ➔ "In depth | eight voices - the polyphony".
the manual - key
You have already found these information and instruction pages here. Pressing the "hide manual" key this display disappears - and if the "Voices" were visible before, they appear again.
the restart - key
A function that plays all available tones automatically. The "Playback Speed" slider can be used to set the playback speed between 2 and 20 tones per second. The respective key belonging to the corresponding tone is displayed.
This function has several usages:
- If a message appears at startup that not all tones have been loaded, you can make up for it here.
- With this one keystroke you can find out where which sound is located.
- With the speed slider you can find out how fast the playback of the used browser is. There are significant differences between the various browsers.
Notice: While you are clicking on the "Playback Speed" slider, the playback process will repeat.
the skin ► - key
There are a few different keyboard themes available, one of which is randomly selected each time you start the program. Using the ‘toggle skin ►’ - key you can click through all designs.
the LED at the bottom left
The initially yellow LED turns either blue or red after the first press on the (real!) keyboard of your computer. This is an indication or warning regarding the keyboard driver of the browser you are using. If the red LED is on, there are usually problems with some keys and sounds. You cannot adjust anything here. For more information, see the chapter ➔ In depth.
the © 96-21 uli blum - key
When you click on this key, my mail address is displayed first. If you then press this key a second time, the mail program preset on your computer will open and you can send me a message.
I have chosen this two-click system because I’m sure it's annoying for everyone if the mail program is accidentally opened while playing...
BEHIND THE DISPLAY
eight voices - the polyphony
A total of eight voices are available for the polyphonic playback of guitars, bass and drums.
The open and closed hi-hat sounds are always played back together monophonically, because this sound only grooves like a natural hi-hat in this way and therefore cannot be changed. This leaves seven voices for all other instruments.
The two guitar sounds are also played monophonically by default after the start because a real guitarist can only play a single power chord or solo note at a time. Since in this monophonic mode the two guitars are assigned one voice each, there are still five polyphonic voices for drums and bass.
However, if you want it to sound fuller and more ambitious like a synthesizer, polyphonic would be the right setting. This sounds a somewhat unnatural, but very loud and full. In this mode, the guitars, bass and drums now have seven voices at their disposal.
When you close this manual, you can watch the eight HTML audio instances, called "Voices", at work. In the background of each audio voice appears the identification color of the currently played instrument.
the led red light milieu
When the key is first pressed, the yellow LED at the bottom left changes to either blue - or red. But what is this good for?
Basically, some browsers only offer simplified keystroke processing. This is detected here at the first keystroke and indicated by the red LED.
In this case, the available technology unfortunately stumbles a bit, on some keys two tones are triggered, other keys are again without function. Also the function keys on the left side trigger the functions of the respective right key.
That's why I didn't assign any functions to the str, alt and cmd keys on the left side. They could not be used on every browser.
In this case only the change to another browser helps. So far I have noticed versions of Vivaldi and Safari on MacOS with this unsightly behavior.
For JavaScript specialists, here is the exact description: Instead of the explicit property "event.code", only the rudimentary property "event.keyCode" is provided by that browser.
we count on you
This ist the th visit since March 3, 2021 on this server.
THE GOAL AND HOW TO MISS IT
if it runs sensibly ...
I really like Rocking Keyboard in the browser when each note plays cleanly immediately after the key is pressed.
Unfortunately, this is often not the case. With many browsers it happens that the sound is only heard half a second after the mouse click, or that other sounds are heard on the keyboard than when the mouse is clicked. This misery is of course not my intention.
the sounds sound much too sluggish
Some browsers behave very sluggishly when playing sound files. In this case, it's worth trying browsers from other manufacturers.
On macOS, for example, the otherwise rather unpopular Chrome convinced me. On Linux and Windows, most browsers behave more convincingly. Handheld systems like Android or iOS have completely disappointed me. Too bad ...
Or the computer itself is responsible for the problem:
You should first make sure that the keyboard driver in the system ( Menu item: Response delay) is set to maximum.
Maybe the computer model is just not that powerful. Maybe you have a chance to get to know Rocking Keyboard better on another device in the near future?
iOS / Android
So far I have noticed on several phones and tablets that the sound files are not stored in the cache. In other words, it is not worth waiting for the preload function to start. The sounds are always reloaded from the host server. Apparently, you have to build extra iOS / Android apps for this system. Very unfortunate ....
Annoying keyboard shortcuts in browsers
Some browsers have implemented keyboard shortcuts in their browsers that do not require a command key and cannot be turned off. Firefox, for example, loads a previously visited page instead of switching between poly- and monophonic. Vivaldi's push and minus keys do not produce the expected sounds, but merely scale the screen display.
Kiddos, what kind of nonsense is this?
nothing to hear
Occasionally, particular problems arise. For example, on my Mac, which has a sound manager called ‘ProTools aggregate’ installed, the Firefox browser makes no sound. Again, another browser can usually remedy this.
further ...
On many iOS touchscreens of Safari, for example, the volume slider does not work. Of course, the tooltips that are triggered when hovering with the mouse are not visible there either.
¯\_(ツ)_/¯
résumé
Some browser vendors seem to be rather stubborn about the implementation of audio objects. I hope the browser vendors will take a look at The Rocking Keyboard ;−)
THE OFFICIAL
imprint
The rocking keyboard is a simple nerdy audio and grafic project by:
Uli Blum
Hamburg
Germany
Contact: hello@uliblum.de
data privacy
https://uliblum.de does not store or read cookies. Some browsers set their own cookies for each website, we have no influence on this. Our host server is configured to create anonymized log files. We only ➔ count the number of page visits - no matter from whom, which browser or where your location. Your emails will be held if it is necessary to answer you.
copyright
Concept, graphics, sounds, encoding, photos: © 1996 - 2021 by Uli Blum
THE HISTORY
the first version
For the final exam of a New Media study I had created a small program with Macromedia Director 4.0 and Lingo in 1996. The guitars and bass sounds I had recorded at home with my Macintosh LC2. It ran as a stand-alone program on all Macs and PowerMacs at that time, PCs with Windows 3.11/95 and with the Shockwave applet in all multimedia-capable web browsers. “Participated with great success” is written in the diploma.
I would have liked to improve some details of this project at that time.
Similar to the well-known Flash plugin, the Shockwave plugin became uninteresting over time, and years ago one browser developer upon another discontinued the option to install this plugin.
plenty of time for a reissue
In spring 2020, for almost inexplicable causes, I had a lot of time to deal with this and other projects from that old days. Between otherwise badly damaged files of an old old backup CD I found the original graphics, soundfiles and the Lingo script of the old Rocking Keyboard project.
new edition with modern browser technology
For the last 20 years, I had been working mainly as a graphic designer for print products and had not paid much attention to online and multi-media. The reason was that an unmanageable variety of new media technologies were fighting for attention, and I was glad at that time not to have to be there anymore.
In summer 2020 I suddenly had enough time to deal with this and other projects from old times. Suddenly it seemed tempting to me now to implement this project completely with HTLM and Javascript, executable in many modern browsers, and independent of computer operating systems or a no longer supported Shockwave browser plugin.
Recycling and redesign
Instead of distributing the instruments statically to a few audio channels, I wanted a real polyphonic playback, which could be realized quickly with a few additional program lines. Now the guitars sounded very unnatural again, which required a renewed problem solution.
Another challenge I faced was how to maximize usability by avoiding download delays.
The 8-bit pixel graphics have been retained, but optimized for modern screens. For visual effects, 24-bit sprites with transparencies are now used. Optionally, there are now some graphically playful skins ;−)
The sounds have been remastered with current tools. The headline now consists of a sharp scalable SVG graphic with phong-rendered light effect.
New are a few keys for secondary functions and a detector LED for problematic keyboard drivers. I had several system-related problems with the keyboard back in the 90s that I couldn't fix at that time.
the original soundfiles
At that time I recorded the power chords and solo notes on a 1983 Stratocaster from Tokai, the bass is a self-made midscale bass, the drum sounds are from sampling - libraries I had worked with at that time.
After analog sound shaping by a Roland GP8 or Ibanez UE 403 I digitalized it with the soundcard of an LC2 computer from Apple.
Digital filtering and cutting was done with the program ‘Sound Studio’, the soundfiles had the then generous 22kHz resolution. For the online version, the sampling rate was reduced to 11kHz, and 3:1 PCM compression was used. MP3 was already a topic of conversation in 1996, but not yet available for the multimedia world.
For the remastering only a ‘Nomad Bus Driver’ Compressor and the ‘BBE Sonic Maximizer’ were used. The original character should be preserved. The MP-3 files as before are in 22kHz mono format.
the rocking keyboard - font
I had designed the headline typeface, a crashed Futura, in 1993 as part of an examination at the Institute of Graphic Design Hamburg. My typography lecturer, Mr. Schulz-Bennewitz, who was 82 years old at the time, said it was “very contemporary”.
my final assessment
I am very happy to have brought this little banger back to life. The first faces of my beta testers made me conclude that Rocking Keyboard can be fun even under suboptimal conditions
In contrast to the old version as a program or Shockwave plugin, this HTML version runs almost perfectly on some browsers. The sound is organized polyphonically and therefore much fatter. And there's some fun stuff like the reload function and the voices display, which invite even non-musicians to check it out.
Last but not least, I think Rocking Keyboard is also a nice tool to test the performance of certain features of current browsers.
more stuff
- Uli on Soundcloud - some electronic music tracks and remixes.
- Uli on Talenthouse - some paintings, photos and graphic works. Unfortunately now only on WaybackMachine.
No liability for external links like this.
Enjoy your life !!!
DIE WICHTIGSTEN MERKMALE
Das Konzept des Rocking Keyboards
Die Idee war, eine einfache Musik-App mit selbst aufgenommenen Rock-Sounds zu erstellen, die als kleines, eigenständiges Programm (1996) oder eben im Webbrowser funktioniert. Diese 'Website-App' ist wie ein einfacher achtpolyphoner Sample-Player aufgebaut. Da die Tonhöhe in HTML - Audio nicht verändert werden kann, verfügt jeder Sound über ein eigenes Soundsample.
Das Startfenster
Um wirklich alle 49 Sounddateien halbwegs in Echtzeit wiedergeben zu können, wird, um sie in den Cache des Browsers zu bekommen, jede Datei einmal mit zehnfacher Geschwindigkeit abgespielt. Für jede Datei gibt es eine maximale Wartezeit von zwei Sekunden, wenn sie dann nicht geladen wird, wird sie übersprungen und die nächste Datei ist an der Reihe.
Nach Beendigung wird das Startfenster automatisch geschlossen. Wenn eine oder mehrere Dateien nicht geladen werden konnten, wird am Ende eine Fehlermeldung angezeigt. In diesem Fall können Sie später noch die resload - Taste auf dem Keyboard betätigen. Damit werden alle Sounddateien erneut aufgerufen.
Die ► skip loading - Taste
Wenn Rocking Keyboard vor kurzem gestartet wurde, kann das Startfenster mit ► skip loading oder auch der esc - Taste übersprungen werden.
Die farbigen Tasten auf der Tastatur
Die Farben der Tasten kennzeichnen das jeweilige Instrument: blau = Sologitarre, grün = Power Chords, gelb = Bass, rot = Drums. Zu jeder Note gibt es einen Tooltip - also einfach mit der Maus über die Tasten fahren und auf das Info-Fenster warten.
Oder drücken Sie beliebige Tasten, um herauszufinden, welche Sounds wo abgespielt werden.
Der Volume - Fader
Mit dem Schieberegler auf der rechten Seite können Sie die Lautstärke einstellen. Die Voreinstellung ist 50%, es geht also auch viel lauter. Die Cursortasten ↑ und ↓ auf einer normal großen Tastatur bewirken dasselbe.
Die guitars polyphon / monophon - Taste
In der Standardeinstellung werden die beiden Gitarren jeweils monophon gesteuert. Das bedeutet, dass genau wie bei natürlichen Gitarren, nur ein Powerchord oder eine Solo-Note alleine gespielt werden kann. Wenn Sie möchten, können Sie die Gitarren auch in den polyphonen Modus umschalten. Dann können mehrere Gitarrentöne gleichzeitig erklingen, was eher wie ein Synthesizer klingt.
Die voices - Taste
Standardmäßig werden unter dem Keyboard die acht Audiokanäle, hier wie bei einem Sampler „Voices (Stimmen)“ genannt, mit ihren farbig gekennzeichneten Funktionszuständen angezeigt. Wenn dieser Anblick eher nervt als hilft, kann man diese Anzeige mit der „hide voices“ Taste ausblenden. Ruft man das Manual auf, verschwindet diese Anzeige ebenfalls, um Platz zu schaffen.
Mehr Informationen zu der Funktionsweise dieser Voices finden Sie im Kapitel ➔ „Details | Acht Stimmen - die Polyphony“.
Die manual - Taste
Diese Informations- und Anleitungsseiten hier haben Sie ja schon gefunden. Mit „hide manual“ verschwindet diese Anzeige - und wenn vorher die „Voices“ sichtbar waren, erscheinen diese wieder.
Die reload - Taste
Eine Funktion, die alle verfügbaren Töne automatisch nacheinander abspielt. Mit dem Schieberegler "Playback Speed" kann die Wiedergabegeschwindigkeit zwischen 2 und 20 Tönen pro Sekunde eingestellt werden. Die jeweilige Taste, die den entsprechenden Ton auslöst, wird dabei angezeigt.
Diese Funktion dient zu mehreren Zwecken:
- Wenn beim Start eine Meldung erscheint, dass nicht alle Töne geladen wurden, können Sie diese hiermit nachladen.
- Mit diesem einzigen Tastendruck können Sie herausfinden, welche Töne sich auf welchen Tasten befinden.
- Mit dem Geschwindigkeitsregler können Sie herausfinden, wie schnell die Tonwiedergabe des verwendeten Browsers ist. Es gibt erhebliche Unterschiede zwischen den verschiedenen Browsern.
Hinweis: Während Sie den "Playback Speed"- Fader anklicken, wird der Abspielvorgang wiederholt.
Die skin ► - Taste
Es stehen ein paar verschiedene Tastaur-Designs zur Verfügung, von dene bei jedem Start per Zufallsgenerator eines ausgewählt wird. Mit der ‘toggle skin ►’ - Taste können Sie sich durch alle Designs durchklicken.
Die led auf der Taste unten links
Die zunächst gelbe LED ändert sich nach dem ersten beliebigen Tastendruck auf die (echte!) Tastatur Ihres Computers entweder in blau oder rot. Dies ist ein Hinweis oder eine Warnung bezüglich des Tastaturtreibers des von Ihnen verwendeten Browsers. Wenn die rote LED leuchtet, gibt es normalerweise Probleme mit einigen Tasten und Tönen. Einstellen können Sie hier nichts. Weitere Informationen finden Sie im Abschnitt ➔ Details.
Die © 96-21 uli blum - Taste
Wenn Sie auf diese Taste klicken, wird aud dieser zunächst meine Kontaktadresse angezeigt. Wenn Sie diese Taste dann ein zweites Mal betätigen, öffnet sich das auf Ihrem Computer voreingestellte Mailprogramm und Sie können mir eine Nachricht schicken.
Dieses Prinzip mit den zwei Klicks habe ich gewählt, weil es immer ärgerlich ist, wenn man beim Spielen versehentlich das Mailprogramm aktiviert wird ...
HINTER DEN KULISSEN
Acht Stimmen - die Polyphony
Insgesamt stehen acht Stimmen für die polyphoninsche Wiedergabe von Gitarren, Bass und Drums zur Verfügung.
Die offene und geschlossene Hihat werden grundsätzlich zusammen monophon wiedergegeben, nur so grooved der Sound wie eine natürliche Hihat. Deshalb lässt sich dies auch nicht ändern. Also bleiben noch sieben Stimmen für alle anderen Instrumente über.
Die beiden Gitarren-Sounds werden nach dem Start default-mäßig enbenfalls monophon abgespielt: ein echter Gitarrist kann ja auch nur einen einzelnen Power-Akkord oder Soloton auf einmal spielen. Da dann im Monophon-Modus die beiden Gitarren jeweils eine Stimme zugeordnet bekommen, bleiben dementsprechend nun noch fünf polyphone Stimmen für Drums und Bass über.
Wenn es aber voller und ehrr wie ein Synthesizer klingen soll, wäre polyphon die richtige Einstellung. Das klingt etwas unatürlich, aber sehr laut und voll. In dieser Einstellung stehen den Gitarren, Bass und Drums nun sieben Stimmen zur Verfügung.
Wenn Sie dieses Manual schließen, können Sie den acht ‘Stimmen’ genannten HTML-Audio-Instanzen bei der Arbeit zusehen. Im Hintergrund jeder Audio-Stimme erscheint die Kennfarbe des gerade gespielten Instrummentes.
Das LED Rotlicht - Milieu
Während des ersten Tastendrucks wird die zunächst gelbe LED unten links entweder blau, oder manchmal rot. Aber wozu ist dies gut?
Grundsätzlich bieten manche Browser nur eine vereinfachte Möglichleiten an, die Tastatureingaben zu verarbeiten. Dies wird hier beim ersten, beliebigen Tastenandruck ermittelt, und dann mit der roten LED angezeigt.
In diesem Fall stolpert die verfügbare Technik leider etwas, auf manchen Tasten werden zwei Töne ausgelöst, andere Tasten sind wiederum ohne Funktion. Auch würden mit den Funktions-Tasten links die Funktionen der jeweiligen rechten Taste ausgelöst.
Deshalb habe ich die str, alt und cmd - Tasten links auch nicht mit eigenen Funktionen z.B. belegt. Sie könnten gar nicht auf jedem Browser genutzt werden.
In diesem Fall hilft es nur, auf einen anderen Browser auszuweichen. Bisher sind mir Versionen von Vivaldi und Safari auf MacOS mit dieser Kuriosität aufgefallen.
Für JavaSript-Spezialisten die exakte Beschreibung: Anstatt der expliziten Eigenschaft "event.code" wird durch den Browser nur die rudimentäre Eigenschaft "event.keyCode" vom Browser bereitgestellt.
Wir zählen auf Sie
Dies ist der te Besuch seit dem 3. März 2021 auf diesem Server.
KNAPP VORBEI IST AUCH DANEBEN
Wenn es läuft wie gedacht ...
Mir macht Rocking Keyboard auf dem Browser dann richtig Spaß, wenn jeder Ton sofort nach dem Tastendruck sauber abgespielt wird.
Das ist leider oft nicht der Fall. Bei einigen Browsern kommt es vor, dass der Sound erst eine halbe Sekunde nach dem Mouseklick zu hören ist. Oder die auf dem Keyboard gespielte Töne sind nicht die erwünschten (wie beim Mouseclick). Diese Mängel sind natürlich nicht meine Absicht.
Die Sounds erklingen viel zu langsam
Einige Browser verhalten sich bei der Aufgabe, Sounddateien abzuspielen, sehr behäbig. In diese Fall lohnt es sich, Browser anderer Hersteller auszuprobieren.
Überzeugt hat mich auf MacOS z.B. der sonst eher unbeliebte Chrome. Auf Linux und Windows verhalten sich die meisten Browser überzeugender. Handheld-Systeme wie Android oder iOS haben mich völlig enttäuscht. Sorry ...
Oder der Rechner selber ist für das Problem verantwortlich:
zuerst sollten Sie sicher stellen, dass der Tastaturtreiber des Betriebsystems (Punkt: Ansprechverzögerung) auf Maximum eingestellt ist.
Möglicherweise ist aber auch das Rechnermodell nur nich leistungsfähig genug. Vielleicht habne Sie aber in der nächsten Zeit die Möglichkeit, Rocking Keyboard auf einem anderen Gerät besser kennenzulernen?
iOS / Android
Bisher ist mir bei veschiedenen Handys und Tablets aufgefallen, dass die Sounddateien nicht im Cache gespeichert werden. Mit anderen Worten: es lohnt sich hier nicht, die Vorladefunktion beim Starten abzuwarten. Die Sounds werden immer neu vom Hostserver geladen. Für diese Systeme müsste man offenbar extra iOS / Android Apps bauen. Sehr bedauerlich ....
Lästige Shortcuts in den Browsern
Manche Browser haben Tastaturbefehle in ihre Browser implementiert, die ohne Befehlstaste auskommen, und sich auch nicht abschalten lassen. Firefox beispielsweise lädt die vorher besuchte Seite, anstatt Poly-/Monophone umzuschalten. Auf den Pus- und Minus- Tasten von Vivaldi wird, anstatt schöne Töne zu produzieren, einfach die Bildschirmanzeige skaliert.
Liebe Hersteller, was soll der Käse?
Nichts zu hören
Vereinzelt treten besondere Probleme auf. Zum Besipiel auf meinem Mac, auf dem ein Soundmanager namens ‘ProTools aggregate’ installiert ist, gibt der Firefox-Browser keinen Ton von sich. Auch hier kann ein anderer Browser in der Regel abhilfe schaffen. Oder man schaut sich in den Tiefen des Betriebssystems um
Weiteres ...
Auf vielen Apps auf Touch-Screens, beispielsweise iOS Safari, funktioniert der Volume Fader nicht. Weiterhin werden dort logischerweise auch keine durch mouse-over ausgelösten Tool-Tipps sichtbar.
¯\_(ツ)_/¯
Reümee
Einige Browser-Hersteller erschaffen eine eher wenig praxisgerechte Handhabung und scheinen die Implementation von Audio-Objekten stiegmütterlich zu handzuhaben. Ich hoffe, die Browser-Hersteller sehen sich Rocking Keyboard auch mal an ;−)
OFFIZIELLES
Impressum
Das Rocking Keyboard ist ein einfaches, nerdiges Audio- und Grafikprojekt von:
Uli Blum
Hamburg
Deutschland
Kontakt: hello@uliblum.de
Datenschutz
https://uliblum.de speichert oder liest keine Cookies auf Ihrem Computer. Einige Browser setzen für jede Website eigene Cookies. Darauf haben wir keinen Einfluss. Der Host-Server ist so konfiguriert, dass er nur anonymisierte Log-Dateien erstellt. Wir ➔ zählen nur die Anzahl der Seitenbesuche - ohne weitere Informationen von wem, mit welchem Browser oder welchem Standort. Ihre E-Mails werden nur gespeichert, wenn es für eine Antwort auf Ihre Anfrage erforderlich ist.
Copyright
Konzept, Grafik, Soundeffekte, Programmierung, Fotos: © 1996 - 2021 Uli Blum
GESCHICHTE
Die erste Version
Für die Abschlussprüfung eines Studiums der Neuen Medien hatte ich 1996 Rocking Keyboard als kleines Programm mit Macromedia Director 4.0 und Lingo erstellt. Die Gitarren und Bass-Sounds hatte ich zu Hause mit meinem Macintosh LC2 aufgenommen.
Es lief als eigenständiges Programm auf allen damaligen Macs und PowerMacs, PCs mit Windows 3.11/95 und als Shockwave-Applet in allen multimediatauglichen Webbrowsern. ‘Mit großem Erfolg teilgenommen’ steht in dem Abschluss--Diplom.
Einige Details dieses Projekts hätte ich damals gerne noch verbessert.
Ähnlich wie das bekannte Flash-Plugin wurde auch das Shockwave-Plugin mit der Zeit uninteressant, und schon vor Jahren stellte ein Browserhersteller nach dem anderen die Option zur Installation dieses Plugins ein.
Reichlich Zeit für eine Neuauflagee
Im Sommer 2020 hatte ich aus, ähm, unerklärlichen Gründen viel Zeit, mich mit diesem und anderen Projekten aus dieser Zeit zu beschäftigen. Zwischen ansonsten stark beschädigten Dateien einer alten Backup CD fand ich die Originalgrafiken, Sounddateien und das Lingo-Skript des alten Rocking Keyboard-Projekts.
Neuauflage mit zeitgemäßer Browsertechnologie
In den letzten 20 Jahren hatte ich hauptsächlich als Grafikdesigner für Printprodukte gearbeitet und dem Online- und Multimediabereich nicht viel Aufmerksamkeit geschenkt. Der Grund war, dass eine unüberschaubare Vielfalt von New-Media Technologien um Aufmerksamkeit kämpften, und ich war damals froh, da nicht mehr dabei sein zu müssen.
Im Sommer 2020 hatte ich dann plötzlich genug Zeit, mich mit diesem und anderen Projekten aus alten Zeiten zu beschäftigen. Plötzlich erschien es mir nun verlockend, dieses Projekt komplett mit HTLM und Javascript umzusetzen, lauffähig in vielen modernen Browsern, und unabhängig von Computer-Betriebssystemen oder einem nicht mehr unterstützten Shockwave-Browser-Plugin.
Recycling und Neugestaltung
Anstatt die Instrumente statisch auf einige wenige Audiokanäle zu verteilen, wollte ich ein echtes polyphones Playback, was mit ein paar zusätzlichen Programmzeilen schnell realisiert werden konnte. Damit klangen die Gitarren aber wieder sehr unnatürlich, was eine erneute Problemlösung erforderte.
Eine weitere Herausforderung, der ich mich stellen musste, war die Optimierung der Benutzerfreundlichkeit durch Vermeidung von langen Download-Verzögerungen.
Die 8-Bit-Pixelgrafiken wurden beibehalten, aber für moderne Bildschirme optimiert. Für visuelle Effekte werden nun 24-Bit-Sprites mit Transparenzen verwendet. Optional gibt es nun einige grafisch verspielte Skins ;−)
Die Sounds wurden mit aktuellen Tools neu gemastert. Die Überschrift besteht jetzt aus einer rattenscharfen, skalierbaren SVG-Grafik mit gerenderten Lichteffekten.
Neu sind ein paar Tasten für Sekundärfunktionen und eine Detektor-LED für problematische Tastaturtreiber. Ich hatte schon in den 90er Jahren verschiedene systembedingte Probleme mit der Tastatur, die ich damals nicht beheben konnte.
Die Original Sound-Dateien
Die Gitarren- Powerchords und Solotöne habe ich damals auf einer 1983er Stratocaster von Tokai eingespielt, der Bass ist ein selbstgebauter Midscale-Bass, und die Drumsounds stammen aus Sampling-Libraries, mit denen ich damals gearbeitet habe.
Nach der analogen Soundbearbeitung mit einen Roland GP8 und einem Ibanez UE 403 habe ich sie mit der Soundkarte eines LC2 Computers von Apple digitalisiert.
Digitales Filtern und Schneiden erfolgte mit dem Programm ‘Sound Studio’. Die Soundfiles hatten die damals großzügige Auflösung von 22kHz. Für die Online-Version wurde die Abtastrate auf 11kHz reduziert und eine 3:1 PCM-Kompression verwendet. MP3 war 1996 bereits in den Startlöchern, aber noch nicht für die Multimedia-Welt verfügbar.
Für das Remastering wurden nur der ‘Nomad Bus Driver’ Compressor und der ‘BBE Sonic Maximizer’ verwendet. Der ursprüngliche Charme sollte erhalten bleiben. Die MP-3 Dateien liegen nach wie vor im 22kHz Mono-Format vor.
Die Rocking Keyboard - Schriftart
Die Headline-Schrift, eine gecrashte Futura, hatte ich 1993 im Rahmen einer Prüfung am Institut für Grafikdesign Hamburg entworfen. Mein Typographie-Dozent Herr Schulz-Bennewitz, der damals 82 Jahre alt war, meinte, diese Schrift sei “sehr zeitgemäß”.
Abschließende Meinung
Ich bin sehr froh, dass ich diesen kleinen Krachmacher wieder zum Leben erweckt habe. Die ersten Blicke meiner Beta-Tester ließen mich zu dem Schluss kommen, dass Rocking Keyboard auch unter suboptimalen Bedingungen Spaß machen kann.
Im Gegensatz zur alten Version als Programm oder Shockwave-Plugin, löuft diese HTML-Version auf einigen Browsern fast perfekt. Der Sound ist mehrstimmig organisiert und daher viel fetter. Und es gibt ein paar lustige Sachen wie die Reload-Funktion und die Stimmenanzeige, die auch Nicht-Musiker zum Ausprobieren einladen.
Nicht zuletzt halte ich Rocking Keyboard auch für ein nettes Tool, um die Leistung bestimmter Features von aktuellen Browsern zu testen.
Mehr Material
- Uli auf Soundcloud - einige elektronische Musik-Tracks und Remixe.
- Uli auf Talenthouse - einige Malereien, Fotos und Grafik-Arbeiten. Inzwischen leider nur noch auf WaybackMachine.
Keine Haftung für externe Links wie diese hier.
Enjoy your life !!!