Skip to content

SimonThormeyer/terry

Repository files navigation

Terry

Clone via git clone

Start via docker-compose up --build

Have a try

https://terry.beuth-media.de

Description

Terry ist ein “music creation playground”, der zum musikalischen Experimentieren einlädt. Er ist als Webapp über jeden Browser nutzbar. Wir empfehlen den Chrome-Browser.

Durch Klicken auf dem Canvas können Töne ausgegeben werden. Außerdem lassen sich die drei Kugeln mit der Maus verschieben, um dadurch Sound- und Tonparameter zu beeinflussen. Dabei stellt die pinke Kugel die Tonauswahl ein, die blaue Kugel die Länge und die gelbe Kugel stellt den Hall der Töne ein.

Das zentrale Feature unserer App ist der Looper. Durch Klicken auf den großen Knopf am unteren Bildschirmrand startet der Looper und nimmt bis zum erneuten Klicken die eingegebenen Töne auf. Das erneute Klicken stoppt den Looper und fortan werden die eingegebenen Töne immer wieder als Loop wiedergegeben. In der oberen linken Ecke des Bildschirms sind die aufgenommenen Loops angezeigt und können dort pausiert, gemutet und gelöscht werden.

Mit dem Knopf rechts neben dem Loop-Knopf können durch Klicken das Spielen von zufälligen Noten und automatische Steuerkugelbewegungen aktiviert und wieder deaktiviert werden.

Am oberen Rand des Canvas kann durch Klicken auf die Pfeile neben den Namen zwischen drei Canvases gewechselt werden. Auf ihnen kann jeweils ein anderes Instrument gespielt werden.

Im Hamburger-Menü in der rechten oberen Ecke sind weitere Funktionen verfügbar: Das Aufnehmen und anschließendes Herunterladen der eigenen Komposition, ein Mixer zum Steuern der Lautstärken der drei Canvases, das Suchen und Öffnen von bereits gespeicherten Projekten, das Teilen und Abspeichern der Eingaben der eigenen Komposition und das Starten des Tutorials, welches auch beim Start der Anwendung über den Knopf “Start with tutorial!” gestartet werden kann.

Musikalisch gesehen sind alle verfügbaren Töne aus dem Kontext C-Dur, sodass sämtliche möglichen Eingaben stets ein ansprechendes und ästhetisches Ergebnis bilden.

Tools & Frameworks

Frontend
Backend
Deployment