# Components

#### Folgende Komponenten stehen zur Verfügung:

<p class="callout info">**Demomodul** mit allen Komponenten zum Ausprobieren:  
[https://cdn.swisslearninghub.app/cc-schulung/module/06\_demo-modul-alle-komponenten-de/](https://cdn.swisslearninghub.app/cc-schulung/module/06_demo-modul-alle-komponenten-de/)</p>




#####   
Navigationskomponenten

<table id="bkmrk-beschreibung-footer-" style="width: 100%;"><thead><tr><th class="align-left" style="width: 24.0788%;">  
</th><th style="width: 75.9212%;">Beschreibung</th></tr></thead><tbody><tr><td style="width: 24.0788%;">**Footer Navigation**</td><td style="width: 75.9212%;">Eine Textkomponente mit Symbol oder Seitenzahlen und einer Schaltfläche, über die man zu einem beliebigen Artikel, Block oder einer Komponente auf einer beliebigen Seite springen kann.</td></tr><tr><td style="width: 24.0788%;">**Page Jumper**</td><td style="width: 75.9212%;">Schaltfläche, über die man zu einem beliebigen Artikel, Block oder zu einer Komponente auf einer beliebigen Seite springen kann</td></tr></tbody></table>




#####   
Inhaltskomponenten

<table id="bkmrk-inhaltskomponenten-b" style="width: 100%; height: 510.344px;"><thead><tr style="height: 29.7969px;"><th class="align-left" style="width: 24.0788%; height: 29.7969px;">  
</th><th style="width: 75.9212%; height: 29.7969px;">Beschreibung</th></tr></thead><tbody><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Blank**</td><td style="width: 75.9212%; height: 29.7969px;">Eine leere Komponente, die als Platzhalter oder Abstand verwendet werden kann.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Chat**</td><td style="width: 75.9212%; height: 29.7969px;">Eine Komponente, die eine Unterhaltung (oder einen Chat) zwischen zwei oder mehr Personen anzeigt. Sie kann auch als interaktive Aufzählungsliste verwendet werden.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Collapsible Boxes**</td><td style="width: 75.9212%; height: 29.7969px;">Zeigt Boxen mit anklickbaren Titeln, die den Anzeigetext öffnen und darstellen.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Flip Card**</td><td style="width: 75.9212%; height: 29.7969px;">Interaktive Flip Card / Drehkarte mit Text und Bildern.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Graphic**</td><td style="width: 75.9212%; height: 29.7969px;">Darstellung von Grafiken</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Graphic Zoomer**</td><td style="width: 75.9212%; height: 29.7969px;">Darstellung von zoombaren Grafiken</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Info Graphic**</td><td style="width: 75.9212%; height: 29.7969px;">Grafik mit klickbaren Bereichen, die ein Popup oder einen Link öffnen.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Lottiefiles Player**</td><td style="width: 75.9212%; height: 29.7969px;">Erlaubt das Abspielen von Lottiefiles Animationen.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Media**</td><td style="width: 75.9212%; height: 29.7969px;">Wiedergabe von Videos und Audios</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Media Story**</td><td style="width: 75.9212%; height: 29.7969px;">Eine Komponente, die ein Video anzeigt, wobei andere Komponenten zu bestimmten Zeitpunkten angezeigt werden können und das Video nach Abschluss dieser Komponente weiterläuft.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Open Text Input**</td><td style="width: 75.9212%; height: 29.7969px;">Eine Komponente zur Anzeige eines Textfeldes, in das der Benutzer Text eingeben und speichern kann.</td></tr><tr style="height: 63.3906px;"><td style="width: 24.0788%; height: 63.3906px;">**Slide Show**</td><td style="width: 75.9212%; height: 63.3906px;">Eine Komponente, die eine Bildergalerie mit begleitendem Text anzeigt. Die Komponente ersetzt die Narrative- und Image Gallery-Komponente und kann als Alternative zur Grafik-Komponente mit Textplatzierung verwendet werden.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Step-by-Step**</td><td style="width: 75.9212%; height: 29.7969px;">Eine Komponente, die per Weiter-Button Blöcke untereinander auflistet.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Tabs**</td><td style="width: 75.9212%; height: 29.7969px;">Darstellung von Text und Bildern in unterschiedlichen Reitern</td></tr><tr style="height: 29.7969px;"><td style="width: 24.0788%; height: 29.7969px;">**Text**</td><td style="width: 75.9212%; height: 29.7969px;">Darstellung von Text</td></tr><tr><td style="width: 24.0788%;">**Video Feedback**</td><td style="width: 75.9212%;">Eine Komponente, die ein Video abspielt. Die Lernenden müssen den Videoinhalt bei bestimmten Ereignissen anhalten und erhalten dann eine Rückmeldung.</td></tr></tbody></table>




#####   
Fragenkomponenten

<table id="bkmrk-fragenkomponenten-be" style="width: 100%; height: 275.766px;"><thead><tr style="height: 29.7969px;"><th class="align-left" style="width: 24.4312%; height: 29.7969px;">  
</th><th style="width: 75.558%; height: 29.7969px;">Beschreibung</th></tr></thead><tbody><tr style="height: 46.5938px;"><td style="width: 24.4312%; height: 46.5938px;">**Graphical Multiple Choice Question**</td><td style="width: 75.558%; height: 46.5938px;">Eine Multiple-Choice-Frage-Komponente mit Bildern</td></tr><tr style="height: 46.5938px;"><td style="width: 24.4312%; height: 46.5938px;">**Matching Question**</td><td style="width: 75.558%; height: 46.5938px;">Zuordnungsfrage, die es dem Lerner ermöglicht, per Dropdown die Antwort/en zur Frage auszuwählen</td></tr><tr style="height: 29.7969px;"><td style="width: 24.4312%; height: 29.7969px;">**Matrix Question**</td><td style="width: 75.558%; height: 29.7969px;">Eine Fragekomponente in Form einer Matrixtabelle.</td></tr><tr style="height: 29.7969px;"><td style="width: 24.4312%; height: 29.7969px;">**Multiple Choice Question**</td><td style="width: 75.558%; height: 29.7969px;">Eine Multiple-Choice-Frage-Komponente</td></tr><tr style="height: 46.5938px;"><td style="width: 24.4312%; height: 46.5938px;">**Slider**</td><td style="width: 75.558%; height: 46.5938px;">Eine Fragekomponente, die es dem Lernenden ermöglicht, einen Schieberegler auf einer Skala zu positionieren</td></tr><tr style="height: 46.5938px;"><td style="width: 24.4312%; height: 46.5938px;">**Text Input**</td><td style="width: 75.558%; height: 46.5938px;">Eine Fragekomponente, die es den Lernenden ermöglicht, einen Antworttext zu einer Frage einzugeben</td></tr></tbody></table>




##### Testkomponenten

<table id="bkmrk-beschreibung-assessm" style="width: 100%;"><thead><tr><th class="align-left" style="width: 24.4312%;">  
</th><th style="width: 75.558%;">Beschreibung</th></tr></thead><tbody><tr><td style="width: 24.4312%; height: 29.7017px;">**Assessment Results**</td><td style="width: 75.558%; height: 29.7017px;">Darstellung der Ergebnisse eines Testkapitels (Assessments) als Text.</td></tr><tr><td style="width: 24.4312%; height: 29.7017px;">**Assessment Result Table**</td><td style="width: 75.558%; height: 29.7017px;">Stellt die Auswertung der einzelnen Testfragen in einer Tabelle dar.</td></tr><tr><td style="width: 24.4312%;">**Assessment Aggregation**</td><td style="width: 75.558%;">Eine Komponente, die aggregierte Ergebnisse aus mehreren Assessments als Tabelle, Grafik oder beides anzeigt.</td></tr><tr><td style="width: 24.4312%;">**Assessment Banks Results**</td><td style="width: 75.558%;">Eine Komponente, die die Ergebnisse eines Assessments nach Fragengruppen gruppiert und diese als Tabelle, Grafik oder beides anzeigt.</td></tr><tr><td style="width: 24.4312%;">**Certificate**</td><td style="width: 75.558%;">Eine Komponente, die die Komponente "Assessment Results" ersetzt. Sie enthält einen Resultat-Text und die Möglichkeit, ein Zertifikat herunterzuladen.</td></tr></tbody></table>