'PianoFlow' ist eine musikalische Anwendung zum Erstellen von eigenen Soundtracks. Mithilfe der ausgewählten Klaviertasten können Melodien live gespielt, aufgenommen und gespeichert werden. Die Effekt-Buttons kreieren weitere Möglichkeiten der Bearbeitung und Wiedergabe.
Folgend eine kurze Beschreibung der Anwendung:
Hier werden die Audi-Inputs der Klaviatur analysiert, gezeichnet und in einer Animation wiedergegeben.
Über die Klaviatur wird mittels der WebAudioAPI der korrespondierende Ton für diese Taste erzeugt und damit ein Klavier simuliert. Die Tasten erzeugen solange einen Ton, wie diese angeklickt und gehalten werden.
Eine Art "Mini-Schlagzeug" mit dem man manuell eigene Beats kreieren kann, die sich automatisch loopen.
Über die Buttons "Rec." und "Save" können eigene Melodien aufgenommen und gespeichert werden. Dazu muss zuerst der "Rec" Button betätigt werden, um eine Aufnahme zu starten. Danach wird die gewünschte Melodie auf der Klaviatur eingespielt und mit einem erneuten klicken auf "Save" wird die Aufnahme beendet. Ein Name kann zusätzlich über das Texteingabefeld vergeben werden. Die gespeicherten Titel werden in einer chronologischen Liste aus Audio-Tracks im Audio-Dropdown dargestellt.
In der Pitch-Auswahl kann im Dropdown aus 8 verschiedenen Tonhöhen gewählt werden. Dabei wird die Frequenz der Töne entsprechend des gewählten Pitches geändert.
Die Selektierung der Audio-Tracks erfolgt über ein Dropdown-Menü. Die gespeicherten Titel können über die 4 Mediaplayer Buttons gestartet, gestopt, zurückgesetzt und stumm geschaltet werden. Außerdem stehen noch zusätzliche Optionen zur Manipulation von Audiospuren zur Verfügung. Mittels des Sliders "Track Time" kann im Titel ein beliebige Zeitpunkt ausgewählt werden. Der "Volume" Slider ermöglicht das verändern der Lautstärke des ausgewählten Titels. Die Geschwindigkeit des Titels kann über den Slider "PLay Rate" abgesenkt oder angehoben werden.
In diesem Bereich lassen sich alle gespeicherten Titel zeitgleich starten, stoppen, neustarten und stummschalten. Es ist möglich mit dem Button "Loop On" die Titel in einer Dauerschleife spielen zu lassen. Mit dem "Loop Off" Button lässt sich die Dauerschleife beenden.
Zum Starten der Anwendung wird Node.js benötigt. Bitte der Verlinkung zur Installation folgen, falls nötig. Ist Node.js installiert. Dann kann die Anwendung über die Eingabe des Befehls npm start in das Terminal gestartet werden. Meist öffnet sich der Browser automatisch, sollte dies nicht der Fall sein, so ist 'PianoFlow' über http://127.0.0.1:8090 aufrufbar. Wir empfehlen den Browser Google Chrome, Chrome basierte Browser oder Microsoft Edge zu nutzen.
Clonen des Repositorys
git clone git@github.com:Ktechen/avpiano.git (SSH)
npm install
npm start
Web-Anwendung startet unter: http://127.0.0.1:8090
'PianoFlow' ist das Ergebnis der Projektarbeit im Modul "Multimedia Audio- und Videotechnik" im Sommersemster 2022. "PianoFlow" soll eine Anwendung zum Erstellen von eigenen Soundtracks bieten. Mithilfe des Designs und den anwendbaren Features soll das Kreieren von Musik leicht und spielerisch gestaltet werden.
Die Projektplanung und Kommunikation wurde mit dem Online Whiteboard Tool Miro umgesetzt.
- REST API Backend zum speichern (POST) und Abrufen (GET) der Audio-Tracks.
- Hinzufügen von Youtube Links als Audio-Track
- Wechseln zwischen dem aktuellen Piano und einem vollständigen Piano mit einer Visualisierung aller Oktaven
- Piano Steuerung über die Tastatur
- Web Audio API
- Vanilla JS
- HTML
- CSS
- Node.js (live-server)
- MediaStream Recording API
Kevin Techen
Kurt-Kester Leißering
Marvin Meitzner
Sophia Piyamit
51/60