Changes

Page history
Update Venue authored by Banu Sarikaya's avatar Banu Sarikaya
Hide whitespace changes
Inline Side-by-side
Venue.md
View page @ 7653ddd5
[[_TOC_]] ![Dark_Black_and_Yellow_Modern_Bold_Podcast_Youtube_Intro_Video__1_](uploads/21e7385fa2a4931a034d1b2bc8e8fa22/Dark_Black_and_Yellow_Modern_Bold_Podcast_Youtube_Intro_Video__1_.gif)
<img src="uploads/26b2d0b742bf5db6d146c141255e6983/Venue.gif" alt="Venue" width="200" /> [[_TOC_]]
## Einführung ## Einführung
Im Rahmen des Projekts Venue (ehemals "Accelerator") wurde das Ziel verfolgt, das Frontend einem umfassenden Redesign zu unterziehen. Hierfür wurde eine moderne UI mit einem neuen Logo gestaltet, um die Benutzerfreundlichkeit zu steigern. Zur Erreichung der Ziele in diesem Semester wurden diese wie folgt priorisiert: Im Rahmen des Projekts Venue (ehemals "Accelerator") wurde das Ziel verfolgt, das Frontend einem umfassenden Redesign zu unterziehen. Hierfür wurde eine moderne UI mit einem neuen Logo gestaltet, um die Benutzerfreundlichkeit zu steigern. Zur Erreichung der Ziele in diesem Semester wurden diese wie folgt priorisiert:
...@@ -25,7 +25,6 @@ Während dieses Semesters wurde der Fokus auf die Hauptziele gelegt, da sie esse ...@@ -25,7 +25,6 @@ Während dieses Semesters wurde der Fokus auf die Hauptziele gelegt, da sie esse
In dieser Dokumentation wird eine Übersicht über das Vorgehen, den Aufbau und das Design von Venue sowie ein Ausblick für die zukünftige Weiterentwicklung gegeben. In dieser Dokumentation wird eine Übersicht über das Vorgehen, den Aufbau und das Design von Venue sowie ein Ausblick für die zukünftige Weiterentwicklung gegeben.
## Vorgehen ## Vorgehen
### Branching-Strategie
Um eine strukturierte Entwicklung zu gewährleisten, wird im Projekt der Feature-Branch-Strategie gefolgt. Die gesamte Feature-Entwicklung erfolgt somit in separaten Branches und nicht im main-Branch. Diese Vorgehensweise ermöglicht es, an einem bestimmten Feature zu arbeiten, ohne die Haupt-Codebasis zu beeinträchtigen. Im Master-Branch befindet sich die Hauptversion von Venue. Für die Entwicklung neuer Funktionen werden Feature-Branches verwendet, die mit "venue-" beginnen, gefolgt von einer kurzen Beschreibung des Features, z. B. "venue-featurebeschreibung". Feature-Branches, die während der Entwicklung erstellt wurden: Um eine strukturierte Entwicklung zu gewährleisten, wird im Projekt der Feature-Branch-Strategie gefolgt. Die gesamte Feature-Entwicklung erfolgt somit in separaten Branches und nicht im main-Branch. Diese Vorgehensweise ermöglicht es, an einem bestimmten Feature zu arbeiten, ohne die Haupt-Codebasis zu beeinträchtigen. Im Master-Branch befindet sich die Hauptversion von Venue. Für die Entwicklung neuer Funktionen werden Feature-Branches verwendet, die mit "venue-" beginnen, gefolgt von einer kurzen Beschreibung des Features, z. B. "venue-featurebeschreibung". Feature-Branches, die während der Entwicklung erstellt wurden:
- **venue-meeting-room:** Hier wurden die grundlegenden Funktionen für die Meetingräume entwickelt. - **venue-meeting-room:** Hier wurden die grundlegenden Funktionen für die Meetingräume entwickelt.
...@@ -35,8 +34,6 @@ Um eine strukturierte Entwicklung zu gewährleisten, wird im Projekt der Feature ...@@ -35,8 +34,6 @@ Um eine strukturierte Entwicklung zu gewährleisten, wird im Projekt der Feature
Durch diese Struktur können neue Funktionen isoliert entwickelt und gleichzeitig die Stabilität des Master-Branches aufrechterhalten werden. Durch diese Struktur können neue Funktionen isoliert entwickelt und gleichzeitig die Stabilität des Master-Branches aufrechterhalten werden.
### Guidelines
## Dependencies ## Dependencies
### Frontend ### Frontend
**[React](https://react.dev/)** <br> **[React](https://react.dev/)** <br>
...@@ -73,63 +70,63 @@ Für Venue wurde ein ansprechendes Dark-Mode Farbschema gewählt, das ein modern ...@@ -73,63 +70,63 @@ Für Venue wurde ein ansprechendes Dark-Mode Farbschema gewählt, das ein modern
| Element | [Farbcode](https://encycolorpedia.com/) | Beschreibung | | Element | [Farbcode](https://encycolorpedia.com/) | Beschreibung |
|-------------------------|------------|--------------------------------------------------------------------------------------------------| |-------------------------|------------|--------------------------------------------------------------------------------------------------|
| **Hintergrund** | <img src="uploads/78e658a6c3bffa98944f71b030df6339/image.png" width="90" /> | Dunkler Hintergrund für hohen Kontrast zu anderen UI-Elementen, verbessert die Lesbarkeit. | | **Hintergrund** | <img src="uploads/78e658a6c3bffa98944f71b030df6339/image.png" width="90" /> | Dieses Grau/Schwarz symbolisiert den Masterstudiengang Human-centered Computing, weshalb für den Hintergrund diese Farbe genutzt wurde. Der dunkle Hintergrund bietet einen hohen Kontrast zu anderen UI-Elementen und verbessert dadurch die Lesbarkeit. |
| **Boxen** | <img src="uploads/d7ffe123facd4f801a83b9937c05deea/image.png" width="90" /> | Farbe für Boxen und Container, klare Abgrenzung der verschiedenen Bereiche. | | **Boxen** | <img src="uploads/d7ffe123facd4f801a83b9937c05deea/image.png" width="90" /> | Die etwas hellere Farbe für Boxen und Container sorgt für eine klare Abgrenzung der verschiedenen Bereiche innerhalb der Benutzeroberfläche. |
| **Buttons** | <img src="uploads/68e512fbb615053aa936d51fc883d666/image.png" width="90" /> | Gelbe Buttons zur Hervorhebung interaktiver Elemente, erleichtert die Navigation. | | **Buttons** | <img src="uploads/68e512fbb615053aa936d51fc883d666/image.png" width="90" /> | Dieses Gelb symbolisiert die Fakultät Informatik, weshalb für die Buttons diese Farbe genutzt wurde. Diese sind so gestaltet, dass sie interaktive Elemente hervorheben und die Navigation für den Benutzer erleichtern. |
| **Button Hover** | <img src="uploads/88cd111ace2d7484f5bf04b86bea0dea/image.png" width="90" /> | Hellere Gelbfarbe bei Maus-Hover über Buttons, visuelle Hervorhebung des interaktiven Zustands. | | **Button Hover** | <img src="uploads/88cd111ace2d7484f5bf04b86bea0dea/image.png" width="90" /> | Bei Maus-Hover über Buttons wird eine hellere Gelbfarbe angezeigt, die den interaktiven Zustand visuell hervorhebt und dem Benutzer Rückmeldung gibt. |
| **Deaktivierte Elemente** | <img src="uploads/00c2e769ad4284d60dd655415fa28ba1/image.png" width="90" />| Farbe für deaktivierte Elemente, zeigt nicht verfügbare Optionen an. | | **Deaktivierte Elemente** | <img src="uploads/00c2e769ad4284d60dd655415fa28ba1/image.png" width="90" />| Die Farbe für deaktivierte Elemente zeigt an, welche Optionen derzeit nicht verfügbar sind. |
| **Chat** | <img src="uploads/e82b3a953a9eaa9d48a64af935bf5f0e/image.png" width="90" /> | Farbe für den Chat-Bereich, verbessert die Lesbarkeit von Nachrichten. | | **Chat** | <img src="uploads/e82b3a953a9eaa9d48a64af935bf5f0e/image.png" width="90" /> | Die im Vergleich zum Hintergrund hellere Farbe für den Chat-Bereich verbessert die Lesbarkeit von Nachrichten und sorgt für eine klare Trennung von anderen Inhalten. |
Mit diesem Farbschema wird eine visuell ansprechende Oberfläche geschaffen, die den Nutzern eine angenehme Interaktion ermöglicht. Mit diesem Farbschema wird eine visuell ansprechende Oberfläche geschaffen, die den Nutzern eine angenehme Interaktion ermöglicht.
### Logo ### Logo
Das neue Logo von Venue ist eine stilisierte Audiowelle, die mit einem Farbverlauf in unseren Hauptfarben aus dem Farbschema gestaltet ist. Mit diesem neuen Logo möchten wir die Identität von Venue stärken. Das neue Logo von Venue ist eine stilisierte Audiowelle, die mit einem Farbverlauf der Hauptfarben aus dem Farbschema gestaltet ist. Mit diesem neuen Logo soll die Identität von Venue gestärkt werden.
<img src="uploads/8a1108862bf8de1927e03505bbb0595b/Logo_Venue.svg" width="200****" /> <img src="uploads/8a1108862bf8de1927e03505bbb0595b/Logo_Venue.svg" width="200" />
### Icons ### Icons
Icons spielen eine wichtige Rolle im Design, da sie zur visuellen Darstellung und Benutzerführung beitragen. Für das Design von Venue wurde eine Vielzahl von Icons aus der MUI-Icon-Bibliothek verwendet, um verschiedene Funktionen/Aktionen zu repräsentieren. Hier ist eine Auflistung der Icons, die eingesetzt wurden: Icons spielen eine wichtige Rolle im Design, da sie zur visuellen Darstellung und Benutzerführung beitragen. Für das Design von Venue wurde eine Vielzahl von Icons aus der MUI-Icon-Bibliothek verwendet, um verschiedene Funktionen/Aktionen zu repräsentieren. Hier ist eine Auflistung der Icons, die eingesetzt wurden:
| Icon | Beschreibung | [Darstellung](https://mui.com/material-ui/icons/) | | Icon | Beschreibung | [Darstellung](https://mui.com/material-ui/icons/) |
|-----------------------------|----------------------------------------------------------|-----------------------------------------------------------| |-----------------------------|----------------------------------------------------------|-----------------------------------------------------------|
| **AddAPhotoIcon** | Symbol für das Hinzufügen von Fotos oder Bildern. | <img src="uploads/ef4feb60f538781f8be1a4051748bf49/image.png" width="40" /> | | **AddAPhotoIcon** | Dieses Icon symbolisiert das Hinzufügen von Fotos oder Bildern. | <img src="uploads/ef4feb60f538781f8be1a4051748bf49/image.png" width="40" /> |
| **AddCircleIcon** | Symbol für das Hinzufügen von Inhalten. | <img src="uploads/64f0b9b30cb7b02a2793c5695cca60ca/image.png" width="40" /> | | **AddCircleIcon** | Dieses Icon symbolisiert das Hinzufügen von Inhalten. | <img src="uploads/64f0b9b30cb7b02a2793c5695cca60ca/image.png" width="40" /> |
| **BackHandIcon** | Symbole für Rückwärtsnavigation. | <img src="uploads/ef38e649c843c95f7e85f155e79b63d3/image.png" width="40" /> | | **BackHandIcon** | Dieses Icon symbolisiert eine Meldung. | <img src="uploads/ef38e649c843c95f7e85f155e79b63d3/image.png" width="40" /> |
| **CheckCircleIcon** | Symbol für Bestätigung oder Erfolg. | <img src="uploads/6635bce651fd95ea34b5d6d5a461a51d/image.png" width="40" /> | | **CheckCircleIcon** | Dieses Icon symbolisiert eine Bestätigung oder das Speichern von Einstellungen. | <img src="uploads/6635bce651fd95ea34b5d6d5a461a51d/image.png" width="40" /> |
| **ChevronLeftIcon** | Symbol für die Navigation nach links. | <img src="uploads/7b4777c8d732c78742ce236ca16d8fc5/image.png" width="40" /> | | **ChevronLeftIcon** | Dieses Icon symbolisiert die Navigation nach links. | <img src="uploads/7b4777c8d732c78742ce236ca16d8fc5/image.png" width="40" /> |
| **ChevronRightIcon** | Symbol für die Navigation nach rechts. | <img src="uploads/b351c1d8f62cc7adec1137b0fc2addca/image.png" width="40" /> | | **ChevronRightIcon** | Dieses Icon symbolisiert die Navigation nach rechts. | <img src="uploads/b351c1d8f62cc7adec1137b0fc2addca/image.png" width="40" /> |
| **DeleteIcon** | Symbolisiert die Löschfunktion. | <img src="uploads/4360acbdd3fd9f782022f48f07412f07/image.png" width="40" /> | | **DeleteIcon** | Dieses Icon symbolisiert die Löschfunktion. | <img src="uploads/4360acbdd3fd9f782022f48f07412f07/image.png" width="40" /> |
| **DescriptionIcon** | Wird für Dokumente oder Beschreibungen verwendet. | <img src="uploads/3f6c7a1e3c50b1ca71119efa7947550d/image.png" width="40" /> | | **DescriptionIcon** | Dieses Icon symbolisiert ein Dokument/ den Bereich, wo die Dokumente sind. | <img src="uploads/3f6c7a1e3c50b1ca71119efa7947550d/image.png" width="40" /> |
| **ErrorOutlineIcon** | Symbol für Fehler oder Probleme. | <img src="uploads/8fdd5fe3d5c972668504ad7204df86aa/image.png" width="40" /> | | **ErrorOutlineIcon** | Dieses Icon symbolisiert einen Hinweis oder ein Problem. | <img src="uploads/8fdd5fe3d5c972668504ad7204df86aa/image.png" width="40" /> |
| **FirstPageIcon** | Symbol für die Navigation zur ersten Seite. | <img src="uploads/b9c45d321ebc29f17fe4f3ab666905b5/image.png" width="40" /> | | **FirstPageIcon** | Dieses Icon symbolisiert die Navigation zur ersten Seite. | <img src="uploads/b9c45d321ebc29f17fe4f3ab666905b5/image.png" width="40" /> |
| **GroupsIcon** | Symbol für Gruppen oder Teamfunktionen. | <img src="uploads/39b41e92eb5fd008c8c7eb8db8d5e4ea/image.png" width="40" /> | | **GroupsIcon** | Dieses Icon symbolisiert den Meetingraum. | <img src="uploads/39b41e92eb5fd008c8c7eb8db8d5e4ea/image.png" width="40" /> |
| **HomeIcon** | Symbolisiert den Home-Bereich. | <img src="uploads/0fb37b258c5a4777184736a0860ff8f5/image.png" width="40" /> | | **HomeIcon** | Dieses Icon symbolisiert den Home-Bereich. | <img src="uploads/0fb37b258c5a4777184736a0860ff8f5/image.png" width="40" /> |
| **LoginIcon** | Symbolisiert den Anmeldevorgang. | <img src="uploads/df231c5c6b209a11d09ef3050d15d645/image.png" width="40" /> | | **LoginIcon** | Dieses Icon symbolisiert den Anmeldevorgang. | <img src="uploads/df231c5c6b209a11d09ef3050d15d645/image.png" width="40" /> |
| **LocalCafeIcon** | Symbol für Pause. | <img src="uploads/42dad6da2bacf0c238c177627c986290/image.png" width="40" /> | | **LocalCafeIcon** | Dieses Icon symbolisiert, dass sich jemand in der Pause befindet. | <img src="uploads/42dad6da2bacf0c238c177627c986290/image.png" width="40" /> |
| **ManageAccountsIcon** | Symbolisiert die Verwaltung von Benutzerkonten. | <img src="uploads/0bec92489f8ad735c294c14deba7fba3/image.png" width="40" /> | | **ManageAccountsIcon** | Dieses Icon symbolisiert die Settings. Sproch die Einstellungen für das Benutzerkonto sowie dem Set-Up. | <img src="uploads/0bec92489f8ad735c294c14deba7fba3/image.png" width="40" /> |
| **MicNoneIcon** | Symbol für Mikrofon an. | <img src="uploads/4677428ef335e41792b0e2abe8330c68/image.png" width="40" /> | | **MicNoneIcon** | Dieses Icon symbolisiert, dass das Mikrofon aktiviert ist. | <img src="uploads/4677428ef335e41792b0e2abe8330c68/image.png" width="40" /> |
| **MicOffIcon** | Symbol für Mikrofon stumm. | <img src="uploads/fb12ce50cf52f26bc0a4771ea43ffc6c/image.png" width="40" /> | | **MicOffIcon** | Dieses Icon symbolisiert, dass das Mikrofon deaktiviert ist. | <img src="uploads/fb12ce50cf52f26bc0a4771ea43ffc6c/image.png" width="40" /> |
| **NearMeIcon** | Zeigt eine Funktion in der Nähe an. | <img src="uploads/de4de1ec1712589b2368b5e2e2bf08aa/image.png" width="40" /> | | **NearMeIcon** | Dieses Icon symbolisiert die Navigation. | <img src="uploads/de4de1ec1712589b2368b5e2e2bf08aa/image.png" width="40" /> |
| **NoteAltIcon** | Steht für Notizen. | <img src="uploads/c1306810419a642741b55d5ff7bcc13c/image.png" width="40" /> | | **NoteAltIcon** | Dieses Icon symbolisiert ein Textfeld. | <img src="uploads/c1306810419a642741b55d5ff7bcc13c/image.png" width="40" /> |
| **NotificationsActiveIcon** | Symbolisiert aktive Benachrichtigungen. | <img src="uploads/614e2d2d31da4ac1724635a145239bc7/image.png" width="40" /> | | **NotificationsActiveIcon** | Dieses Icon symbolisiert aktive Benachrichtigungen. | <img src="uploads/614e2d2d31da4ac1724635a145239bc7/image.png" width="40" /> |
| **PersonIcon** | Symbolisiert einen Benutzer oder ein Benutzerkonto. | <img src="uploads/f02f3c36e0e55be5055924e3e8735261/image.png" width="40" /> | | **PersonIcon** | Dieses Icon symbolisiert einen Benutzer oder ein Benutzerkonto. | <img src="uploads/f02f3c36e0e55be5055924e3e8735261/image.png" width="40" /> |
| **PresentToAllIcon** | Zeigt die Funktion für die Bildschirmpräsentation an. | <img src="uploads/ef75951e3a47ab102d2e18852e784356/image.png" width="40" /> | | **PresentToAllIcon** | Dieses Icon symbolisiert die Funktion für die Bildschirmpräsentation. | <img src="uploads/ef75951e3a47ab102d2e18852e784356/image.png" width="40" /> |
| **SaveIcon** | Symbolisiert die Speicherfunktion. | <img src="uploads/bfeb0f16d2e6f0aad1eb2393f71ed4ac/image.png" width="40" /> | | **SaveIcon** | Dieses Icon symbolisiert die Speicherfunktion. | <img src="uploads/bfeb0f16d2e6f0aad1eb2393f71ed4ac/image.png" width="40" /> |
| **ScreenshotMonitorIcon** | Symbolisiert die Funktion für Bildschirm teilen. | <img src="uploads/5795611c13ce99ae60b94b6f5835595a/image.png" width="40" /> | | **ScreenshotMonitorIcon** | Dieses Icon symbolisiert die Funktion für das Teilen vom Bildschirm. | <img src="uploads/5795611c13ce99ae60b94b6f5835595a/image.png" width="40" /> |
| **SendIcon** | Symbolisiert den Sendevorgang. | <img src="uploads/84e381fac7372480fd3c6110bc30cb51/image.png" width="40" /> | | **SendIcon** | Dieses Icon symbolisiert den Sendevorgang im Chat. | <img src="uploads/84e381fac7372480fd3c6110bc30cb51/image.png" width="40" /> |
| **SentimentSatisfiedAltIcon** | Symbol für positive Stimmung oder Zufriedenheit. | <img src="uploads/b050549336cbaf9bb75db83671a0d897/image.png" width="40" /> | | Icon | Beschreibung | [Darstellung](https://mui.com/material-ui/icons/) | **SentimentSatisfiedAltIcon** | Dieses Icon symbolisiert das Emoji Set für den Chat. | <img src="uploads/b050549336cbaf9bb75db83671a0d897/image.png" width="40" /> | | Icon | Beschreibung | [Darstellung](https://mui.com/material-ui/icons/)
| **SignLanguageIcon** | Symbole für Klatschen. | <img src="uploads/ad2fceda787a50d30f268a6ae255ab03/image.png" width="40" /> | | **SignLanguageIcon** | Dieses Icon symbolisiert das Klatschen. | <img src="uploads/ad2fceda787a50d30f268a6ae255ab03/image.png" width="40" /> |
| **SpatialAudioIcon** | Symbole für Klatschen. | <img src="uploads/385cd3e85f1569e36efb5eef2ff35497/image.png" width="40" /> | | **SpatialAudioIcon** | Dieses Icon symbolisiert die Testfunktion für den Audio-Input. | <img src="uploads/385cd3e85f1569e36efb5eef2ff35497/image.png" width="40" /> |
| **SpatialAudioOffIcon** | Symbole für Klatschen. | <img src="uploads/ee1bebe320cad7053fae25449e21fb61/image.png" width="40" /> | | **SpatialAudioOffIcon** | Dieses Icon symbolisiert die Testfunktion für den Audio-Output. | <img src="uploads/ee1bebe320cad7053fae25449e21fb61/image.png" width="40" /> |
| **ThumbDownAltIcon** | Symbol für negative Bewertungen oder nicht Zustimmung. | <img src="uploads/6e30fdbe5a17b7c8f59ba49de532fd8d/image.png" width="40" /> | | **ThumbDownAltIcon** | Dieses Icon symbolisiert eine negative Bewertungen oder nicht Zustimmung. | <img src="uploads/6e30fdbe5a17b7c8f59ba49de532fd8d/image.png" width="40" /> |
| **ThumbUpIcon** | Symbol für positive Bewertungen oder Zustimmung. | <img src="uploads/6ba2c8a1348cdde172a82a66b2734b3f/image.png" width="40" /> | | **ThumbUpIcon** | Dieses Icon symbolisiert eine positive Bewertungen oder Zustimmung. | <img src="uploads/6ba2c8a1348cdde172a82a66b2734b3f/image.png" width="40" /> |
| **UnfoldMoreIcon** | Symbol für "Mehr anzeigen". | <img src="uploads/d75471f4f22e81c5e566fa9b01bad814/image.png" width="40" /> | | **UnfoldMoreIcon** | Dieses Icon symbolisiert die Funktion mehr anzeigen zu können. | <img src="uploads/d75471f4f22e81c5e566fa9b01bad814/image.png" width="40" /> |
| **ViewInArIcon** | Symbol für 3D Objekte. | <img src="uploads/460d361e463ac8cf9a203af6f147e1c8/image.png" width="40" /> | | **ViewInArIcon** | Dieses Icon symbolisiert die Funktion zum Hinzufügen von 3D-Modellen. | <img src="uploads/460d361e463ac8cf9a203af6f147e1c8/image.png" width="40" /> |
| **VideoCallIcon** | Symbol für Video an. | <img src="uploads/b98cbda74f48bf8640345f3f14b9f99a/image.png" width="40" /> | | **VideoCallIcon** | Dieses Icon symbolisiert das Hinzufügen einer Kamera. | <img src="uploads/b98cbda74f48bf8640345f3f14b9f99a/image.png" width="40" /> |
| **VideoCamIcon** | Symbol für Video an. | <img src="uploads/2748dd26b839d6764630dbdd59e74598/image.png" width="40" /> | | **VideoCamIcon** | Dieses Icon symbolisiert die Aktivierung der Kamera. | <img src="uploads/2748dd26b839d6764630dbdd59e74598/image.png" width="40" /> |
| **VideocamOffIcon** | Symbol für Video aus. | <img src="uploads/5976a9468b5eadb28bb9c5629cb53705/image.png" width="40" /> | | **VideocamOffIcon** | Dieses Icon symbolisiert die Deaktivierung der Kamera. | <img src="uploads/5976a9468b5eadb28bb9c5629cb53705/image.png" width="40" /> |
| **VolumeUpIcon** | Symbol für Lautstärke erhöhen. | <img src="uploads/ec0f1249f31bcce9257d2eda393ffb1e/image.png" width="40" /> | | **VolumeUpIcon** | Dieses Icon symbolisiert das Einschalten von Ton. | <img src="uploads/ec0f1249f31bcce9257d2eda393ffb1e/image.png" width="40" /> |
| **VolumeOffIcon** | Symbol für stummschalten. | <img src="uploads/3ef22f89d390b3100f52c4f737d95303/image.png" width="40" /> | | **VolumeOffIcon** | Dieses Icon symbolisiert das Abschalten von Ton. | <img src="uploads/3ef22f89d390b3100f52c4f737d95303/image.png" width="40" /> |
Mit diesem Styleguide wird sichergestellt, dass das Design von Venue nicht nur ästhetisch ansprechend, sondern auch benutzerfreundlich ist. Mit diesem Styleguide wird sichergestellt, dass das Design von Venue nicht nur ästhetisch ansprechend, sondern auch benutzerfreundlich ist.
... ...
......