diff --git a/components/prompter.md b/components/prompter.md
new file mode 100644
index 0000000..881353a
--- /dev/null
+++ b/components/prompter.md
@@ -0,0 +1,18 @@
+---
+noindex: false
+comments: false
+#author: HaPe
+#author_tools: hape
+#level: beginner
+#article_type: info
+#date: 2019-10-28
+last_updated: 2019-10-28
+title: Komponente Teleprompter
+description: 'iStream Tools - Komponente Teleprompter'
+keywords: 'suggestions todo erweiterungen ideen'
+
+---
+
+# Teleprompter einrichten
+
+
diff --git a/components/setup.md b/components/setup.md
new file mode 100644
index 0000000..d190722
--- /dev/null
+++ b/components/setup.md
@@ -0,0 +1,79 @@
+---
+noindex: false
+comments: false
+#author: HaPe
+#author_tools: hape
+#level: beginner
+#article_type: info
+#date: 2019-10-28
+last_updated: 2019-10-28
+title: Komponenten einrichten (allgemein)
+description: 'iStream Tools - Komponenten einrichten (allgemein)'
+keywords: 'suggestions todo erweiterungen ideen'
+
+---
+
+# Komponenten einrichten (allgemein)
+
+
+Wie schon auf der [Übersichtsseite](/docs/) erklärt, folgen alle Apps dem gleichen Workflow. Hier
+ wird nun etwas detailierter beschrieben, wie man die verschiedenen Dialoge erreicht und was man
+ damit machen kann. So muss in den Beschreibungen zu den Apps, nicht mehr auf diese Dinge
+ eingegangen werden.
+
+
+
+
+## Testmodus
+
+Jede App befindet sich, wenn sie angewählt wird, im Setupmodus. Das heisst, alle Aktionen führen zu
+ einer Änderung der Konfiguration und wird **in den meisten Fällen** automatisch gespeichert.
+ Klickst Du auf einen Content-/Play-Button, dann führt Dich das zu einem Dialog, indem Du den
+ Schalter bzw. den Content anpassen kannst. Klickst Du auf einen Standardbutton, dann führt Dich
+ das zu einem Dialog, in dem Du den Schalter anpassen kannst. Das ist die Standardvorgehensweise.
+
+Bei jeder App gibt es auch den sogenannten Testmodus. Um den Testmodus zu aktivieren, musst Du nur
+ den Schalter `Testmodus` rechts oben aktivieren. Wenn Du den Testmodus aktiviert hast, dann wird
+ bei einem Klick auf einen Content- / Play-Button der jeweilige Content in der Vorschau (linke
+ Seite) angezeigt bzw. abgespielt. Wenn der Testmodus aktiviert ist, wird der Schalter blau
+ dargestellt.
+
+- Bei den Slides wird der jeweilige Slide angezeigt.
+- Bei den Videoplayer wird das Video abgespielt.
+- Bei den Audioplayer wird der Sound abgespielt.
+- Die Standardbuttons haben ihre Funktion.
+
+## Setup
+
+Der Schalter Setup, rechts oben, dient der generellen Konfiguration der aktuell ausgewählten
+ Anwendung. Hier können Standardwerte festgelegt werden. Die Beschriftung des App-Buttons kann
+ geändert werden. Die aktuell ausgewählte Anwendung kann gelöscht werden.
+
+
+
+WARN: **Achtung: der Löschvorgang wird direkt ohne weitere Nachfrage UNWIDERRUFLICH durchgeführt**
+
+## Upload
+
+Das Feld Upload wird da angezeigt, wo Medien auf den Server übertragen werden können. Man kann die
+ Dateien per Drag n Drop in dem Uploadfeld ablegen oder man kann mit einem Klick auf das Uploadfeld
+ einen Auswahldialog starten. Der Upload beginnt in jedem Fall automatisch. Sobald die Datei(en)
+ fehlerfrei übertragen wurden, wird für die Datei ein neuer Content- / Play-Button angezeigt oder
+ entsprechend angezeigt.
+
+## Plus-Button
+
+Der Plus-Button befindet sich im unteren Bereich. Mit diesem Button können neue Anwendungen des
+ jeweiligen angelegt werden. Die Konfiguration und wie solche Anwendungen wieder gelöscht werden
+ können, wurde weiter oben bei **Setup** beschrieben.
+
+Es gibt einige Apps wie z.B. Slides und Ticker, bei denen du noch einen Plus-Button sehen kannst.
+ Mit diesem Plus-Button werden neue Slides bzw. neue Tickertexte angelegt.
+
+## Vorschau
+
+Der Bereich für die Vorschau wird durch das Grid (grau / weisse Kacheln) dargestellt. Sofern visuell
+ etwas dargestellt werden kann, wird es in diesem Bereich angezeigt. In der Vorschau werden die
+ Inhalte verkleinert im passenden Verhältnis zueinander angezeigt. Die Vorschau entspricht nicht
+ immer pixelgenau dem wie es eingerichtet ist. Für eine exakte Kontrolle sollte die App in einem
+ Browserfenster oder direkt in der Encodersoftware geöffnet werden.
diff --git a/components/slides.md b/components/slides.md
new file mode 100644
index 0000000..99774cb
--- /dev/null
+++ b/components/slides.md
@@ -0,0 +1,117 @@
+---
+noindex: false
+comments: false
+#author: HaPe
+#author_tools: hape
+#level: beginner
+#article_type: info
+#date: 2019-10-28
+last_updated: 2019-10-28
+title: Komponente Slides
+description: 'iStream Tools - Komponente Slides'
+keywords: 'suggestions todo erweiterungen ideen'
+
+---
+
+# Slides einrichten
+
+
+Die Slides sind vielseitig. Du kannst mit den Slides eine Präsentation (wie MS-Powerpoint, OO-Impress, Apple-Presenter)
+ gestalten und über die Console steuern oder per Autoplay ablaufen lassen. Du kannst damit aber auch Deine Lowerthirds
+ oder andere Effekte gestalten und in Deinem Stream einbinden.
+
+
+## Slides einrichten
+
+Um ein Slideset einzurichten einfach ein vorhandenes Slideset auswählen oder mit dem Add-Button ein neues Slideset
+ anlegen. Danach findest Du in etwa folgende Übersicht.
+
+
+
+Rechts oben ist der Setup-Button, mit dem das Slideset konfiguriert werden kann. Daneben der Schalter für den Testmode.
+ Im Testmode kannts Du die Slides in der Vorschau (links) abrufen.
+
+Im Setupmodus (Testmode ist NICHT aktiviert) kommst du über die einzelnen Schalter an die jeweilige Konfiguration. Im
+ Testmode steuerst Du mit den gleichen Schalter die Vorschau.
+
+## Konfiguration des Slidesets
+
+Nachdem Du den Setup-Button (rechts oben) angeklickt hast, öffnet sich folgender Dialog.
+
+
+
+Du kannst hier das Slideset umbenennen, die Grösse des Slidesets festlegen Schriftarten einrichten, bei Bedarf das
+ Autoplay aktivieren und einrichten, sowie Schriftgrösse, Hintergrundfarbe und Schriftfarbe festlegen.
+
+Es gibt zwei Möglichkeiten um die eigenen Schriftarten festzulegen.
+
+1. Du suchst Dir bei https://fonts.google.com oder einem ähnlichen Dienst eine Schriftart aus und kopierst den
+ zur Verfügung gestellten Code des Dienstes in das jeweilige Feld `Schriftart`.
+2. Du suchst Dir eine auf Deinem System installierte Schriftart aus und gibst in das jeweilige Feld `Schriftart` den
+ Namen der ausgewählten Schriftart ein.
+
+## Slide anlegen / einrichten
+
+Um einen Slide (eine Folie, eine Seite) anzulegen klickst Du auf den Add-Button und wählst dann diesen neu erstellten
+ Schalter aus. Ein Dialog wird geöffnet, der wie der folgende Screenshot ausschaut.
+
+
+
+Oben auf der linken Seite findest Du die Einstellungen für den Schalter, der dir später in der Console angezeigt wird.
+ Du kannst den Titel der auf dem Schalter angezeigt wird festlegen und dem Schalter eine Farbe zuordnen.
+
+Unter der Farbauswahlbox für den Schalter, findest Du 6 Felder, in denen Du sogenannte Koordinaten eingeben kannst. Die
+ Slides werden in einen virtuellen 3D Raum positioniert. Jeder Slide kann also individuell in diesem 3D Raum platziert
+ werden. Wenn von einem Slide zu einem anderen Slide gewechselt wird, wandert der Viewport, durch diesen 3D Raum, zu
+ dem neuen Slide. Diese Bewegung simuliert einen Flug durch den 3D Raum und erzeugt tolle Übergangseffekte.
+
+- Die X-Achse ist die horizontale Koordinate (link/rechts)
+- Die Y-Achse ist die vertikale Koordinate (hoch/runter)
+- Die Z-Achse ist die Tiefe (vor/zurück)
+
+Auf der rechten Seite des Dialog ist der Texteditor. Damit kann der Slide gestaltet werden. Die einfachste Art ist per
+ Markdown-Language. Das ist eine vereinfachte Auszeichnungssprache, die im Internet weit verbreitet ist. Sie wird z.B.
+ auf Gitlab.com oder in so ziemlich jedem Wiki (z.B. Wikipedia) verwendet. Man braucht sich bei Markdown nicht um
+ das HTML dahinter kümmern, das übernimmt ein Parser, der aus Markdown HTML macht. Wer möchte, oder spezielle
+ Anforderungen hat, kann auch HTML und CSS verwenden. Als Einstiegshilfe sind in der Toolbar einige Schalter enthalten,
+ mit denen die wichtigsten Textelemente generiert werden.
+
+Um Deinen Slide auszuschmücken kannst Du Bilder per Drag n Drop, Emojies, Font-Icons über einen Shortcut und weitere
+ Formatierungen wie z.B. Farbcodes per BBCode, einfügen.
+
+- Für einen Emoji verwende einfach den Namen des Emojie eingeschlossen in Doppelpunkte `:nerd:`
+- Für ein Font-Icon verwedest Du ebenfalls die Doppelpunkte mit dem Code für das Icon. `:fas-cog:`, `:far-save:` oder
+ `:fab-facebook-square:`
+
+Welchen Code Du verwenden kannst, findest Du für Emojies auf https://unicode.org/emoji/charts/emoji-list.html Du kannst
+ auf dieser Seite in der Spalte `CLDR Short Name` den Namen rauskopieren und verwenden. Evtl. Leerzeichen werden
+ mit einem Bindestrich ersetzt. so wird aus dem Namen `grinning face` der Code `:grinning-face:`
+
+Die Font-Icons kannst Du auf der Seite https://fontawesome.com/icons?d=gallery aussuchen. Auf streamtool.net wird zur
+ Zeit die Version 5.4.1 verwendet. Es gibt bei der Suche nach Icons keine Unterscheidung zwischen Free und Pro Version.
+ Es wird alles angezeigt. Auf Streamtool.net können nur die `solid`, `regular` und `brand` Varianten verwendet werden.
+ Auf der Suchseite sind diese Icons dunkel, während die Pro-Varianten grau dargestellt werden.
+
+Wenn Du ein Icon ausgesucht hast gehst Du auf die Detailseite, indem Du das gewünschte Icon anklickst, und suchst Dir
+ dort den Namen und die Variante raus. Ein Beispiel für ein solid-Icon `fas-cog` ein regular-Icon `far-save` und ein
+ brand-Icon `fab-facebook-square`.
+
+Um z.B. ein oder mehrere Worte mit einer anderen Schriftfarbe hervorzuheben, kannst Du einen BBCode
+ `[color=red]Wörter in rot[/color]` (Wörter in rot) verwenden. Du kannst Hexcodes
+ `#ff0000` und oder RGB- / RGBA-Anweisungen verwenden z.B. `rgba(255,0,0,0.6)`.
+
+Zusammengefasst:
+- Der Editor unterstützt Markdown (Das wird auch entsprechend angezeigt).
+- HTML mit Styleangaben (CSS) und Class wird unterstützt.
+- Emojies und Font-Icons werden unterstützt.
+- Bilder werden per Drag n Drop und / oder als Hintergrundbild unterstützt.
+- BBCode wird ebenfalls unterstützt. *(z.Zt. Keine Listenelemente)*
+
+Ebenfalls in der Toolbar enthalten sind die Buttons für den Zugriff auf den Mediamanager für dieses Slideset und ein
+ weiterer Dialog mit dem der aktuelle Slide detailiert gestylt werden kann. Siehe folgenden Screenshot.
+
+
+
+Hier können noch einmal Schriftgrösse, Schriftfarbe und Hintergrundfarbe speziell für den aktuellen Slide eingerichtet
+ werden. Ausserdem der Abstand vom Rand des Slides zum Inhalt des Slides. Ausserdem kann die Textausrichtung festgelegt
+ werden und es kann ein Hintergrundbild eingerichtet werden.
diff --git a/components/soundeffects.md b/components/soundeffects.md
new file mode 100644
index 0000000..06d7405
Binary files /dev/null and b/components/soundeffects.md differ
diff --git a/components/ticker.md b/components/ticker.md
new file mode 100644
index 0000000..339b9c8
--- /dev/null
+++ b/components/ticker.md
@@ -0,0 +1,80 @@
+---
+noindex: false
+comments: false
+#author: HaPe
+#author_tools: hape
+#level: beginner
+#article_type: info
+#date: 2019-10-28
+last_updated: 2019-10-28
+title: Komponente Ticker
+description: 'iStream Tools - Komponente Ticker'
+keywords: 'suggestions todo erweiterungen ideen'
+
+---
+
+# Ticker einrichten
+
+
+Mit der Ticker Komponente kannst Du eine Laufschrift in Deinen Stream integrieren. Einfach Text eintragen, nach Bedarf
+ noch ein paar Einstellungen vornehmen und über eine Browserquelle in OBS einbinden. Fertig!
+
+
+Um einen Ticker einzurichten wählst Du einen bereits vorhandenen Ticker aus oder erstellst
+ mit dem Add-Button einen neuen Ticker und wählst anschliessend diesen aus.
+
+Es stehen Dir nun folgende Einstellungen zur Verfügung:
+
+
+
+**Über die generelle Konfiguration: (Schalter `Setup` - rechts oben)**
+
+- Den Namen des Tickers anpassen.
+- Die Schriftart auswählen
+- Die Geschwindigkeit festelgen
+- Schriftgrösse
+- Hintergrund-, Schrift- und Randfarbe
+
+**Schriftart auswählen**
+
+Es gibt zwei Möglichkeiten um eine eigene Schriftart festzulegen.
+
+1. Du suchst Dir bei https://fonts.google.com oder einem ähnlichen Dienst eine Schriftart aus und kopierst den
+ zur Verfügung gestellten Code des Dienstes in das Feld `Schriftart`.
+2. Du suchst Dir eine auf Deinem System installierte Schriftart aus und gibst in das Feld `Schriftart` den Namen
+ der ausgewählten Schriftart ein.
+
+**Über den Ticker-Button selbst (der erste heisst `Default`)**
+
+- Den Namen und die Farbe des Schalters festlegen
+- Den Text bearbeiten
+- Die einzelne Komponente löschen
+
+**Text bearbeiten**
+
+Es ist ein normales Textfeld. Es zeigt keine Formatierungen an. Du kannst aber normale HTML-Tags verwenden um Teile
+ des Textes in der Laufschrift **FETT** (`FETT`) oder *KURSIV* (`KURSIV`) darzustellen.
+
+Ausserdem kannst Du Emojies und Font-Icons über einen Shortcut einfügen.
+
+- Für einen Emoji verwende einfach den Namen des Emojie eingeschlossen in Doppelpunkte `:nerd:`
+- Für ein Font-Icon verwedest Du ebenfalls die Doppelpunkte mit dem Code für das Icon. `:fas-cog:`, `:far-save:` oder
+ `:fab-facebook-square:`
+
+Welchen Code Du verwenden kannst, findest Du für Emojies auf https://unicode.org/emoji/charts/emoji-list.html Du kannst
+ auf dieser Seite in der Spalte `CLDR Short Name` den Namen rauskopieren und verwenden. Evtl. Leerzeichen werden
+ mit einem Bindestrich ersetzt. so wird aus dem Namen `grinning face` der Code `:grinning-face:`
+
+Die Font-Icons kannst Du auf der Seite https://fontawesome.com/icons?d=gallery aussuchen. Auf streamtool.net wird zur
+ Zeit die Version 5.4.1 verwendet. Es gibt bei der Suche nach Icons keine Unterscheidung zwischen Free und Pro Version.
+ Es wird alles angezeigt. Auf Streamtool.net können nur die `solid`, `regular` und `brand` Varianten verwendet werden.
+ Auf der Suchseite sind diese Icons dunkel, während die Pro-Varianten grau dargestellt werden.
+
+Wenn Du ein Icon ausgesucht hast gehst Du auf die Detailseite, indem Du das gewünschte Icon anklickst, und suchst Dir
+ dort den Namen und die Variante raus. Ein Beispiel für ein solid-Icon `fas-cog` ein regular-Icon `far-save` und ein
+ brand-Icon `fab-facebook-square`.
+
+## in die Encodersoftware einbinden
+
+Der Ticker kann auf der Seite Links leicht am Namen identifiziert werden. Einfach die zugrhörige Url kopieren und in
+ der Encodersoftware eine Browsersource einrichten. Die Höhe des Tickers ist `44px`.