Skip to content
Snippets Groups Projects

Changes

Page history
  • New page
  • Templates
    • Design aktualisieren authored by Raphael Fritsch's avatar Raphael Fritsch
    Hide whitespace changes
    Inline Side-by-side
    Showing
    with 12 additions and 12 deletions
    Design.md
    View page @ 91de41dd
    ...@@ -25,7 +25,7 @@ So wird aus diesem Grund zwischen einer Nutzer- und Moderatorenansicht unterschi ...@@ -25,7 +25,7 @@ So wird aus diesem Grund zwischen einer Nutzer- und Moderatorenansicht unterschi
    Moderatoransicht Moderatoransicht
    ![](/raw/master/docs/img/useransicht.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/img/useransicht.PNG)
    Useransicht Useransicht
    ...@@ -35,7 +35,7 @@ Das Hintergrund besteht aus einem Subtle, welches aus einer Mischung von dunklen ...@@ -35,7 +35,7 @@ Das Hintergrund besteht aus einem Subtle, welches aus einer Mischung von dunklen
    **Farbpalette** **Farbpalette**
    ![](/raw/master/docs/img/Farbpalette.jpg) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/img/Farbpalette.jpg)
    ### Schriften ### Schriften
    Schriftart für die Anwendung ist [Roboto](https://www.google.com/fonts/specimen/Roboto). Schriftart für die Anwendung ist [Roboto](https://www.google.com/fonts/specimen/Roboto).
    ...@@ -49,36 +49,36 @@ Schriftart für die Anwendung ist [Roboto](https://www.google.com/fonts/specimen ...@@ -49,36 +49,36 @@ Schriftart für die Anwendung ist [Roboto](https://www.google.com/fonts/specimen
    Das Logo von Accelerator greift die Idee auf, dass im System viele Menschen an einem Projekt/Thema arbeiten und zusammen zu einem Ergebnis gelangen. Das Logo von Accelerator greift die Idee auf, dass im System viele Menschen an einem Projekt/Thema arbeiten und zusammen zu einem Ergebnis gelangen.
    Dies wird durch die Puzzle-Stücke repräsentiert, welche ineinander greifen. Die einzelnen Puzzle-Stücke können außerdem als Symbol für den einzelnen Menschen angesehen werden, was durch die Form abgebildet wird, die einem Kopf ähnelt. Die geschwungenen Linien weisen auf einen dynamischen und schnellen Prozess hin. Die verschiedenen Farben spiegeln hierbei die Vielfalt der Menschen wider, die zusammen arbeiten. Der Kreis symbolisiert abschließend den Zusammenhalt und die Iteration der Arbeit. Dies wird durch die Puzzle-Stücke repräsentiert, welche ineinander greifen. Die einzelnen Puzzle-Stücke können außerdem als Symbol für den einzelnen Menschen angesehen werden, was durch die Form abgebildet wird, die einem Kopf ähnelt. Die geschwungenen Linien weisen auf einen dynamischen und schnellen Prozess hin. Die verschiedenen Farben spiegeln hierbei die Vielfalt der Menschen wider, die zusammen arbeiten. Der Kreis symbolisiert abschließend den Zusammenhalt und die Iteration der Arbeit.
    ![](/raw/master/docs/img/logo.png) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/img/logo.png)
    ### Design-Entstehung ### Design-Entstehung
    Folgende Mockups zeigen in Teilen die Entstehung des Designs, wobei hierbei relevante Elemente im Vordergrund stehen. Die Mockups sind in höherer Auflösung und vollständiger Fassung abgelegt. An dieser Stelle wird des Weiteren die grundsätzliche Struktur abgebildet, wie sie in frühen Stadien des Projekts angedacht war. Das Kapitel [Aufbau und Komponenten](Aufbau-und-Komponenten) zeigt die Struktur auf, wie sie tatsächlich umgesetzt wurde. Folgende Mockups zeigen in Teilen die Entstehung des Designs, wobei hierbei relevante Elemente im Vordergrund stehen. Die Mockups sind in höherer Auflösung und vollständiger Fassung abgelegt. An dieser Stelle wird des Weiteren die grundsätzliche Struktur abgebildet, wie sie in frühen Stadien des Projekts angedacht war. Das Kapitel [Aufbau und Komponenten](Aufbau-und-Komponenten) zeigt die Struktur auf, wie sie tatsächlich umgesetzt wurde.
    ![](/raw/master/docs/Mocks/mainpage.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/mainpage.PNG)
    Die **Hauptseite** besteht aus einer Präsentationsfläche, die sich im Zentrum des Bildschirms befindet, einer Leiste unten, in der sich Chat, Notizen und Dateien befinden und über der die Toolbar sitzt. Auf der linken Seite ist das Userpanel, in welchem die Nutzer und Moderator abgebildet sind. Die **Hauptseite** besteht aus einer Präsentationsfläche, die sich im Zentrum des Bildschirms befindet, einer Leiste unten, in der sich Chat, Notizen und Dateien befinden und über der die Toolbar sitzt. Auf der linken Seite ist das Userpanel, in welchem die Nutzer und Moderator abgebildet sind.
    ![](/raw/master/docs/Mocks/notes.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/notes.PNG)
    Die **untere Leiste** zeigt standardmäßig nur die Chatleiste an. Sind die Notizen oder Dateien aktiviert, teilt sich die Leiste und beide aktiven Elemente werden angezeigt. Die **untere Leiste** zeigt standardmäßig nur die Chatleiste an. Sind die Notizen oder Dateien aktiviert, teilt sich die Leiste und beide aktiven Elemente werden angezeigt.
    ![](/raw/master/docs/Mocks/moderatorview.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/moderatorview.PNG)
    Die **Moderatoransicht** ist komplexer, da dieser über mehr Möglichkeiten verfügt. Die Moderatoren-Tools befinden sich oberhalb der Präsentationsfläche, sofern sie diese betreffen, und im linken Bereich am Moderatorenstuhl, wo die Verwaltung von Dokumenten und gruppenspezifischen Bereichen getätigt wird. Die **Moderatoransicht** ist komplexer, da dieser über mehr Möglichkeiten verfügt. Die Moderatoren-Tools befinden sich oberhalb der Präsentationsfläche, sofern sie diese betreffen, und im linken Bereich am Moderatorenstuhl, wo die Verwaltung von Dokumenten und gruppenspezifischen Bereichen getätigt wird.
    ![](/raw/master/docs/Mocks/changeinteraction.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/changeinteraction.PNG)
    Um zwischen **Interaktion umzuschalten**, wird ein Flyout-Menü eingesetzt. Standardmäßig ist immer eine Interaktion ausgewählt, bei Klick auf den rechten unteren Rand kann dann zwischen den gleichberechtigten Interaktionsformen gewechselt werden. Um zwischen **Interaktion umzuschalten**, wird ein Flyout-Menü eingesetzt. Standardmäßig ist immer eine Interaktion ausgewählt, bei Klick auf den rechten unteren Rand kann dann zwischen den gleichberechtigten Interaktionsformen gewechselt werden.
    ![](/raw/master/docs/Mocks/creategroup.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/creategroup.PNG)
    Um innerhalb eines Raumes **Arbeitsgruppen** zu erstellen, erscheint nach Klick auf "+" ein Flyout-Menü, in welchem der Gruppenname, die Anzahl der Mitglieder und die Gruppenmitglieder hinzugefügt werden können. Um innerhalb eines Raumes **Arbeitsgruppen** zu erstellen, erscheint nach Klick auf "+" ein Flyout-Menü, in welchem der Gruppenname, die Anzahl der Mitglieder und die Gruppenmitglieder hinzugefügt werden können.
    ![](/raw/master/docs/Mocks/groupview.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/groupview.PNG)
    Mit Erstellen von Gruppen ändert sich die Ansicht für alle Nutzer. Es erscheinen **Tabs** mit den einzelnen Gruppen, mindestens der eigene Gruppenraum und der Hauptraum. Der Moderator hingegen sieht alle erstellten Gruppen. Durch diese Reiter ist außerdem eine Navigation in die einzelnen Gruppen möglich. Mit Erstellen von Gruppen ändert sich die Ansicht für alle Nutzer. Es erscheinen **Tabs** mit den einzelnen Gruppen, mindestens der eigene Gruppenraum und der Hauptraum. Der Moderator hingegen sieht alle erstellten Gruppen. Durch diese Reiter ist außerdem eine Navigation in die einzelnen Gruppen möglich.
    ![](/raw/master/docs/Mocks/present.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/present.PNG)
    **Dokumente** können sowohl einzelnen Gruppen als auch dem Hauptraum hinzugefügt werden. Alle Dialoge befinden sich an dem jeweils aktiven Button, um die Klickwege kurz zu halten. **Dokumente** können sowohl einzelnen Gruppen als auch dem Hauptraum hinzugefügt werden. Alle Dialoge befinden sich an dem jeweils aktiven Button, um die Klickwege kurz zu halten.
    ...@@ -86,10 +86,10 @@ Mit Erstellen von Gruppen ändert sich die Ansicht für alle Nutzer. Es erschein ...@@ -86,10 +86,10 @@ Mit Erstellen von Gruppen ändert sich die Ansicht für alle Nutzer. Es erschein
    **Meldet** sich ein Nutzer, erscheint dies nicht in seiner Leiste, stattdessen wird diese Info global oben an die Nutzerleiste angehängt. Der Moderator kann dort reagieren, indem der die Meldung annimmt (und damit das Mikrofon vergibt), oder ablehnt. **Meldet** sich ein Nutzer, erscheint dies nicht in seiner Leiste, stattdessen wird diese Info global oben an die Nutzerleiste angehängt. Der Moderator kann dort reagieren, indem der die Meldung annimmt (und damit das Mikrofon vergibt), oder ablehnt.
    ![](/raw/master/docs/Mocks/groupwork.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/groupwork.PNG)
    In der **Gruppenarbeit** verfügt jeder Nutzer über das vom Moderator zugeteilte Dokument, einem Gruppen-Whiteboard und einem persönlichen Whiteboard. Während einer Gruppenarbeit unterscheidet sich die angezeigte Information von der Position der Gruppenmitglieder innerhalb der Arbeit. Befinden sie sich alle auf dem gleichen Bereich des Dokuments sind detailliertere Informationen notwendig, als wenn sie auf unterschiedlichen Dokumenten arbeiten. In der **Gruppenarbeit** verfügt jeder Nutzer über das vom Moderator zugeteilte Dokument, einem Gruppen-Whiteboard und einem persönlichen Whiteboard. Während einer Gruppenarbeit unterscheidet sich die angezeigte Information von der Position der Gruppenmitglieder innerhalb der Arbeit. Befinden sie sich alle auf dem gleichen Bereich des Dokuments sind detailliertere Informationen notwendig, als wenn sie auf unterschiedlichen Dokumenten arbeiten.
    ![](/raw/master/docs/Mocks/groupworksplitted.PNG) ![](https://gitlab.reutlingen-university.de/ksystem/Accelerator/raw/master/docs/Mocks/groupworksplitted.PNG)
    Der Nutzer kann seine **Ansicht** während der Gruppenarbeit personalisieren. Es ist also möglich, die Ansicht zu teilen und Texfelder oder Formen von einem Dokument/Bereich zum anderen schieben. Der Nutzer kann seine **Ansicht** während der Gruppenarbeit personalisieren. Es ist also möglich, die Ansicht zu teilen und Texfelder oder Formen von einem Dokument/Bereich zum anderen schieben.
    \ No newline at end of file