Timer.md

@@ -4,6 +4,7 @@
 #### | 1 | [Einführung](#1--einführung)
 #### | 2 | [Konzeption](#2--konzeption)
 #### | 2.1 | [Anforderungen](#21-anforderungen)
+#### | 2.2 | [Design](#22-design)
 #### | 3 | [Tests](#3--tests)
 #### | 4 | [Implementierung](#4--implementierung)
 #### | 5 | [Ausblick](#5--ausblick)
@@ -14,26 +15,24 @@
 # 1  Einführung
 Im Rahmen des "Kollaborative Systeme" Moduls im Wintersemester 2019 / 2020 wurde ein Timer für den Accelerator konzipiert und implementiert. 
 
-Die Idee dazu entstand während einer Accelerator-Sitzung. Innerhalb dieser wurden alle Teilnehmer gebeten, eine Kurz-Präsentation zu halten. Dabei kam der Gedanke auf, dass eine zeitangebende Funktionalität ein expliziter Teil von Accelerator sein sollte, da dieser häufig für Vorlesungen und Präsentationen genutzt wird. Ein Timer wäre sowohl für die Rolle des Moderators als auch der Teilnhemr zur Gestaltung von Accelerator-Sitzungen nützlich. 
+Die Idee dazu entstand während einer Accelerator-Sitzung. Innerhalb dieser wurden alle Teilnehmer gebeten, eine Kurz-Präsentation zu halten. Dabei kam der Gedanke auf, dass eine zeitangebende Funktionalität ein expliziter Teil von Accelerator sein sollte, da dieser häufig für Vorlesungen und Präsentationen genutzt wird. Ein Timer wäre sowohl für die Rolle des Moderators als auch der Teilnehmer zur Gestaltung von Accelerator-Sitzungen nützlich. Der Timer ist hierbei von einer Stoppuhr zu unterscheiden. 
+Zielsetzung : Der implementierte Timer sollte die in den folgenden aufgezählten Anforderungen erfüllen.
 
-Der Timer ist hierbei von einer Stopuhr zu unterscheiden. 
-Zielsetzung : Der implemetierte Timer sollte die im folgenden aufgezählten Anfoderungen erfüllen.
-
-Projektkontext: Kurze Einführung in Accelerator (?), kurzer Überblick über die verwendete IDE, wo dieCode-Base liegt, Code-Versionierung und ähnliches.
+Projektkontext: Kurze Einführung in Accelerator (?), kurzer Überblick über die verwendete IDE, wo die Code-Base liegt, Code-Versionierung und ähnliches.
 
 Bedienelemente: Der Timer kann durch einen eigenen Button angesprochen werden.
 
 # 2  Konzeption
 
-In diesem Kapitel wird die Konzeption beschrieben (Anforderungen, Darstellung derverschiedenen Varianten mittels Mockups, etc.) 
+In diesem Kapitel wird die Konzeption beschrieben (Anforderungen, Darstellung der verschiedenen Varianten mittels Mockups, etc.) 
 
 ## 2.1  Anforderungen
 
-Im folgenden werden die grundlegenden Anforderungen festgehalten. 
+Im Folgenden werden die grundlegenden Anforderungen festgehalten. 
 
 | Kürzel | Beschreibung der Anforderung |
 | -------- | -------- |
-| A_01  | Timer-Funktionalität via eigenem Button.    |
+| A_01  | Timer-Funktionalität via eigenen Button.    |
 | A_02  | Eigenes Modal für die Konfigurierung des Timers.     |
 | A_03  | Einstellung der Zeit.     |
 | A_04  | Einstellung der Sichtbarkeit (für Moderator und / oder Teilnehmer).    |
@@ -44,11 +43,23 @@ Im folgenden werden die grundlegenden Anforderungen festgehalten.
 | A_09  | Positionierung des Timers (Vertikale und horizontale Ausrichtung).     |
 | A_10  | Dynamische Generierung von Anzeige-Elementen.    |
 | A_11  | „Andocken“ des Timers an Fenster innerhalb des Accelerators.     |
-| A_12  | Start / Stop – Funktionalität für den Timer.     |
-| A_13  | Visuelles Feedback für Start / Stop.     |
+| A_12  | Start / Stopp – Funktionalität für den Timer.     |
+| A_13  | Visuelles Feedback für Start / Stopp.     |
 | A_14  | Design „Punktetimer“ umsetzen.     |
 
- 
+
+## 2.2  Design 
+
+
+### 2.2.1  Ampelmetapher 
+ A metaphor expresses things unfamiliar in terms of things familiar. When we talk about something abstract, we often use metaphors to explain it clearly and easily (Lakoff, & Johnson, 1980). 
+“Metaphor is a device for seeing something in terms of something else. It brings out the thisness of a that, or the thatness of a this.” (Burke, 1945) 
+
+Metaphor is a literary figure of speech that uses images, stories or tangible things to represent less tangible things or some intangible qualities or ideas. 
+This function allows metaphors also to be used for any rhetorical figures of speech that achieve their effectiveness and persuasiveness via association, comparison or resemblance. This verbal use of metaphors is a very effective skill in communication because it does not only provide better understanding but it can also form a powerful emotional attachment between the audience and the intended meaning of the subject. This advantage in metaphors is not only used in verbal communication but also applied in non-verbal communication, especially in the design domain, from products, graphics and UI (User Interface) to services. 
+Designers communicate with users through products, and design is the mean of communication for them. As metaphor has a role in communication, design engages also the cross-mapping process between the idea (the source) and the product (the target). Knowing and applying this in the design process, metaphors can provide designers with intuition and inspiration to trigger their imagination. It can also deliver better understanding to users when they experience the product since the embedded metaphor makes the product familiar to them. 
+Consequently, when metaphors are applied in design, designers can provide familiar and meaningful products to users (Hekkert & Cila, 2009).
+
 
 # 3  Tests
 
@@ -60,16 +71,53 @@ Zwischenstand zum 13.01. - Dieser Abschnitt beschreibt den aktuellen Stand des T
 
 Finale Version zum 21.01. - Dieser Abschnitt beschreibt den aktuellen Stand des Timers zum Zeitpunkt der Abschlusspräsentation.
 
-Implementierungs-Stichworte: 
--	Bedienelement Button
+
+## 4.1  Implementierungsdetails
+
 -	Modal Timer Settings 
--	Start /Stop Funktionalität 
--	Designs 
+-	Start /Stopp Funktionalität 
 -	Löschen 
 
+**Timer Button**
+Der Timer wird über den Timer-Button geöffnet. 
+Dieser befindet sich in der Toolbar, die der Rolle des Moderators zur Verfügung steht. 
+Der Button ist aktuell neben dem Clock-Button platziert. Dies kann jedoch sehr leicht geändert werden. 
+Die Sanduhr als Symbol wurde für den Timer ausgewählt, da eine Uhrdarstellng schon existierte. Das Zahnrad deutet darauf hin, dass hier weitere Einstellungen ausgewählt werden können. 
+
+**Timer Settings Modal**
+Ein Click auf den timer Botton öffnet das Settings modal. In diesem ist es möglich verschiedene Einstellungen für den timer festzulegen. Dazu gehört folgendes. 
+
+**Visibility** 
+An dieser Stelle kann der Nutzer auswählen, wer den timer nutzt / wem dieser angezeigt wird. Je nach Einstellung ist hier der Rollen Wechsel zu beachten. 
+
+**Time**
+Die Eingabe einer Zeitdauer erfolgt an dieser Stelle. Dabei werden Input Felder für Stunden, Minuten und Sekunden zur Verfügung gestellt. Im code wird dies wie folgt verarbeitet …
+
+**Position**
+Der Nutzer wählt an hier aus, ob der Timer vertikal oder horizontal angezeigt werden soll. 
+
+**Style** 
+Der Nutzer kann an dieser Stelle festlegen, welches Design der Timer aufweisen soll. Dabei stehen die folgenden Optionen zur Verfügung. 
+Diese können in zukünftigen Iterationen erweitert werden und dann als Option im Drop Down Menü erweitert werden. 
+
+**Delete Timer**
+Das Settings Modal enthält auch einen Button um den Timer zu löschen und dessen Anzeige zu beenden.  
+
+**Start / Stopp Funktionalität**
+Der Timer lässt sich bei Bedarf pausieren. Dazu werden Button zu Verfügung gestellt. 
+
+
+## 4.2  Deployment
+Beschreibung des Test-Branch ?
+
 
 # 5  Ausblick
 
-Stichwort: Zukünftige Nutzung und Erweiterung 
 
-Dieser Abschnitt gibt einen Ausblick auf die zukünftige Nutzung bzw. Erweiterungder implementierten Timer-Funktionalität. Zudem wird skizziert wie die Funktionalitäterweitert werden könnte.
\ No newline at end of file
+## 5.1  Zukünftige Nutzung und Erweiterung 
+
+Dieser Abschnitt gibt einen Ausblick auf die zukünftige Nutzung bzw. Erweiterung der implementierten Timer-Funktionalität. Zudem wird skizziert wie die Funktionalität erweitert werden könnte.
+
+## 5.2  Lessons learned
+
+Reflexion über die Arbeitsweise