@@ -87,25 +87,6 @@ Unsere Farbpalette umfasst die folgenden Hauptfarben:
| Deaktivierte Elemente | #6D909E | Farbe für deaktivierte Elemente, zeigt nicht verfügbare Optionen an. |  |
| Chat | #374D56 | Farbe für den Chat-Bereich, verbessert die Lesbarkeit von Nachrichten. |  |
-**Hintergrund**: #1E2B31
- Der dunkle Hintergrund bietet einen hohen Kontrast zu den anderen UI-Elementen, was die Lesbarkeit und Benutzererfahrung verbessert.
-**Boxen**: #344045
- Diese Farbe wird für Boxen und Container verwendet und sorgt für eine klare Abgrenzung der verschiedenen Bereiche.
-**Buttons**: #ffcc00
- Die gelben Buttons sind auffällig und lenken die Aufmerksamkeit auf interaktive Elemente, was die Navigation erleichtert.
-**Button Hover**: #ffe163
- Beim fahren mit der Maus über Buttons wechselt die Farbe zu einem helleren Gelb, wodurch der interaktive Zustand visuell hervorgehoben wird und der Benutzer Feedback erhält.
-**Deaktivierte Elemente**: #6D909E
- Diese Farbe wird für deaktivierte Elemente verwendet und zeigt klar an, welche Optionen derzeit nicht verfügbar sind.
-**Chat**: #374D56
- Diese Farbe für den Chat-Bereich bietet einen angenehmen Kontrast, der die Lesbarkeit von Nachrichten verbessert und gleichzeitig zum Gesamtfarbschema passt.
Mit diesem Farbschema wird eine benutzerfreundliche und visuell ansprechende Oberfläche geschaffen, die den Nutzern eine angenehme Interaktion ermöglicht.
### UI-Komponenten
...
...
@@ -130,70 +111,6 @@ Für das Design wurde eine Vielzahl von UI-Komponenten genutzt, um eine ansprech
| **Textarea** | Textarea-Komponenten werden verwendet, um mehrzeilige Texteingaben oder Kommentare entgegenzunehmen. |  |
| **Toggle-Group und Toggle** | Toggle-Group- und Toggle-Komponenten werden genutzt, um Umschaltfunktionen bereitzustellen. |  |
-**Alert**
(Bild: Placeholder)
Alerts wurden verwendet, um wichtige Benachrichtigungen oder Hinweise anzuzeigen.
-**Avatar**
(Bild: Placeholder)
Avatare wurden genutzt, um Benutzerbilder darzustellen.
-**Button**
(Bild: Placeholder)
Buttons sind ein wesentlicher Bestandteil der Benutzeroberfläche und wurden verwendet, um Aktionen auszulösen oder Navigationen innerhalb der Anwendung zu erleichtern.
-**Card**
(Bild: Placeholder)
Cards wurden eingesetzt, um Informationen oder Inhalte in einem übersichtlichen und ansprechenden Format darzustellen. Sie helfen dabei, Inhalte zu strukturieren und visuell hervorzuheben.
-**Command**
(Bild: Placeholder)
Command-Komponenten wurden genutzt, um interaktive Befehle oder Aktionen zu repräsentieren. Sie bieten die Möglichkeit, bestimmte Aufgaben auszuführen oder Funktionen zu aktivieren.
-**Dialog**
(Bild: Placeholder)
Dialogs wurden verwendet, um wichtige Informationen oder Interaktionsmöglichkeiten in einem modalen Fenster darzustellen. Damit wird der Fokus des Benutzers auf spezifische Inhalte gelenkt, da der Rest der Anwendung abgedunkelt wird.
-**Input**
(Bild: Placeholder)
Input-Komponenten wurden genutzt, um Benutzereingaben entgegenzunehmen. Sie bieten eine Schnittstelle für die Interaktion mit Venue.
-**Label**
(Bild: Placeholder)
Labels wurden verwendet, um Beschriftungen für andere UI-Elemente bereitzustellen. Sie helfen dabei, die Benutzerführung zu verbessern.
-**Menubar**
(Bild: Placeholder)
Menubars wurden genutzt, um Navigationsoptionen bereitzustellen. Sie bieten eine strukturierte Möglichkeit, zwischen verschiedenen Bereichen oder Funktionen zu wechseln.
-**Resizable**
(Bild: Placeholder)
Die Resizable-Komponente ermöglicht es, bestimmte UI-Elemente in der Größe anzupassen, um die Anpassbarkeit zu verbessern.
-**Scroll-Area**
(Bild: Placeholder)
Scroll-Area-Komponenten wurden eingesetzt, um Inhalte darzustellen, die größer sind als der verfügbare Anzeigebereich. Sie ermöglichen es den Benutzern, durch umfangreiche Inhalte zu navigieren und dabei den Überblick zu behalten.
-**Select**
(Bild: Placeholder)
Select-Komponenten wurden verwendet, um Dropdown-Listen bereitzustellen. Sie ermöglichen es den Benutzern, aus einer Liste von Optionen auszuwählen.
-**Separator**
(Bild: Placeholder)
Separator-Komponenten wurden genutzt, um visuelle Trennlinien zwischen verschiedenen Elementen in der Benutzeroberfläche zu erstellen. Sie verbessern die visuelle Struktur und Lesbarkeit.
-**Tabs**
(Bild: Placeholder)
Tabs wurden eingesetzt, um verschiedene Ansichten/ Reiter im Meeting Raum zu organisieren. Sie ermöglichen es den Benutzern, zwischen verschiedenen Inhalten/ Funktionen zu navigieren.
-**Textarea**
(Bild: Placeholder)
Textarea-Komponenten wurden verwendet, um mehrzeilige Texteingaben oder Kommentare entgegenzunehmen. Sie bieten eine Schnittstelle für die Eingabe und Bearbeitung von längeren Texten.
-**Toggle-Group und Toggle**
(Bild: Placeholder)
Toggle-Group- und Toggle-Komponenten wurden genutzt, um Umschaltfunktionen bereitzustellen. Sie ermöglichen es den Benutzern, zwischen zwei Zuständen zu wählen.
Diese Komponenten wurden mit Blick auf Benutzerfreundlichkeit, Barrierefreiheit und Anpassbarkeit ausgewählt und trugen dazu bei, eine intuitive und effiziente Benutzeroberfläche für Venue zu gestalten.
### Icons
...
...
@@ -202,8 +119,8 @@ Icons spielen eine wichtige Rolle in unserem Design, da sie zur visuellen Darste
