... | @@ -2,6 +2,7 @@ |
... | @@ -2,6 +2,7 @@ |
|
|
|
|
|
Das Ziel der Gruppe Redesign bestand darin, das Design vom Accelerator hinsichtlich des Farbschemas, der Icons, der Raum-Verlassen-Funktion und des Designs anzupassen und umzusetzen. Dabei wurden alle verwendeten Icons nach dem Material Design umgesetzt, um ein einheitliches Ergebnis zu erhalten. Als Inspirations-Grundlage stand das Design System von der Studentin, Hannah Kruck, aus dem vorherigen Semester zur Verfügung.
|
|
Das Ziel der Gruppe Redesign bestand darin, das Design vom Accelerator hinsichtlich des Farbschemas, der Icons, der Raum-Verlassen-Funktion und des Designs anzupassen und umzusetzen. Dabei wurden alle verwendeten Icons nach dem Material Design umgesetzt, um ein einheitliches Ergebnis zu erhalten. Als Inspirations-Grundlage stand das Design System von der Studentin, Hannah Kruck, aus dem vorherigen Semester zur Verfügung.
|
|
|
|
|
|
|
|
|
|
**Projektergebnisse**
|
|
**Projektergebnisse**
|
|
|
|
|
|
Im aktuellen Stand wurden folgende Aspekte abgeschlossen:
|
|
Im aktuellen Stand wurden folgende Aspekte abgeschlossen:
|
... | @@ -10,15 +11,11 @@ Im aktuellen Stand wurden folgende Aspekte abgeschlossen: |
... | @@ -10,15 +11,11 @@ Im aktuellen Stand wurden folgende Aspekte abgeschlossen: |
|
- Beim Verlassen des Raumes wird dem Nutzer/der Nutzerin eine Meldung angezeigt, die ihn/sie frägt, ob er/sie den Raum wirklich verlassen möchte
|
|
- Beim Verlassen des Raumes wird dem Nutzer/der Nutzerin eine Meldung angezeigt, die ihn/sie frägt, ob er/sie den Raum wirklich verlassen möchte
|
|
- In der Raumauswahl gibt es die Möglichkeit, die Räume alphabetisch zu sortieren
|
|
- In der Raumauswahl gibt es die Möglichkeit, die Räume alphabetisch zu sortieren
|
|
|
|
|
|
|
|
|
|
**Umsetzung**
|
|
**Umsetzung**
|
|
|
|
|
|
Das Repository des Accelerator wurde lokal auf den Rechnern der Gruppenmitglieder geklont und in Visual Studio Code geöffnet. Auf Basis des Masterbranches wurde ein eigener Branch "Redesign2021" erstellt, der als Entwicklunsgbrach für das neue Design gedient hat. Nach jeder Iteration wurde ein Release im GitLab erstellt, der einen lauffähigen Stand repräsentiert.
|
|
Das Repository des Accelerator wurde lokal auf den Rechnern der Gruppenmitglieder geklont und in Visual Studio Code geöffnet. Auf Basis des Masterbranches wurde ein eigener Branch "Redesign2021" erstellt, der als Entwicklunsgbrach für das neue Design gedient hat. Nach jeder Iteration wurde ein Release im GitLab erstellt, der einen lauffähigen Stand repräsentiert.
|
|
|
|
|
|
**_Accelerator Logo_**
|
|
|
|
|
|
|
|
Das Accelerator Logo wurde bezüglich der Schattierung und des Farbschemas angepasst ?
|
|
|
|
Bild von Logo muss hinzugefügt werden (Vorher und nachher Bild am besten ?)
|
|
|
|
|
|
|
|
**_Material Design_**
|
|
**_Material Design_**
|
|
|
|
|
|
[Material Design](https://material.io/design) ist eine sehr berühmte visuelle Designsprache von Google. Da Google zu den [meistgenutzen Suchmaschinen](https://de.statista.com/statistik/daten/studie/225953/umfrage/die-weltweit-meistgenutzten-suchmaschinen/) gehört, entwickeln die Nutzer gegenüber Material-Design-Anwendungen ein Vertrauens- und Sicherheitsgefühl. Sie kennen das Design und schaffen laut [William Woodhead](https://medium.com/pilcro/should-you-use-material-design-bfb596a04bae) eine Verbindung zu Google. Aus diesem Grund wurde Material Design verwendet.
|
|
[Material Design](https://material.io/design) ist eine sehr berühmte visuelle Designsprache von Google. Da Google zu den [meistgenutzen Suchmaschinen](https://de.statista.com/statistik/daten/studie/225953/umfrage/die-weltweit-meistgenutzten-suchmaschinen/) gehört, entwickeln die Nutzer gegenüber Material-Design-Anwendungen ein Vertrauens- und Sicherheitsgefühl. Sie kennen das Design und schaffen laut [William Woodhead](https://medium.com/pilcro/should-you-use-material-design-bfb596a04bae) eine Verbindung zu Google. Aus diesem Grund wurde Material Design verwendet.
|
... | @@ -29,6 +26,18 @@ Die neuen Icons sind Material Design Icons und stammen aus folgenden beiden Seit |
... | @@ -29,6 +26,18 @@ Die neuen Icons sind Material Design Icons und stammen aus folgenden beiden Seit |
|
- [Google Fonts](https://fonts.google.com/icons)
|
|
- [Google Fonts](https://fonts.google.com/icons)
|
|
- [Material Design Icons](https://materialdesignicons.com/)
|
|
- [Material Design Icons](https://materialdesignicons.com/)
|
|
|
|
|
|
|
|
**_Accelerator Logo_**
|
|
|
|
|
|
|
|
Die Icons von Material Design entsprechen einem geometrischen Design, daher wurde die Schattierung vom Accelerator Logo entfernt, damit das Logo auch zum neuen Redesign passt.
|
|
|
|
|
|
|
|
Accelerator vorher
|
|
|
|
|
|
|
|

|
|
|
|
|
|
|
|
Accelerator nachher
|
|
|
|
|
|
|
|

|
|
|
|
|
|
**_Material Design Dialogs_**
|
|
**_Material Design Dialogs_**
|
|
|
|
|
|
Im Accelerator gibt es zwei Dialoge die angepasst wurden. Nach [Material Design](https://material.io/components/dialogs) müssen die Aktionen auf einem Dialog klar sein und zum Kontext passen. Zudem wird nach Material Design die eigentliche Aktion im rechten Button und die nebenläufige Aktion im linken Button dargestellt. Daher wurde auf den Dialogen der Cancel Button nach links verschoben und die eigentlichen Aktionn nach rechts wie auf folgenden Bildern zu sehen ist:
|
|
Im Accelerator gibt es zwei Dialoge die angepasst wurden. Nach [Material Design](https://material.io/components/dialogs) müssen die Aktionen auf einem Dialog klar sein und zum Kontext passen. Zudem wird nach Material Design die eigentliche Aktion im rechten Button und die nebenläufige Aktion im linken Button dargestellt. Daher wurde auf den Dialogen der Cancel Button nach links verschoben und die eigentlichen Aktionn nach rechts wie auf folgenden Bildern zu sehen ist:
|
... | | ... | |