Update Venue authored by Banu Sarikaya's avatar Banu Sarikaya
......@@ -86,7 +86,8 @@ Der bidirektionale Kanal zwischen dem Socket.IO-Server (Node.js) und dem Socket.
Die Socket.IO-Codebasis ist in zwei unterschiedliche Ebenen aufgeteilt: die Low-Level-Infrastruktur, die als Engine.IO bezeichnet wird, und die High-Level-API, die Socket.IO selbst darstellt. Engine.IO ist für die Herstellung der Low-Level-Verbindung zwischen Server und Client verantwortlich.
## Design
In diesem Abschnitt werden die Designprinzipien des Venue-Frontends beschrieben.
In diesem Abschnitt werden die Designprinzipien des Venue-Frontends beschrieben. <br>
![image](uploads/d566b2bcb7ab74386ac2d142a6d81748/image.png){width=229 height=223}
### Farbschema
Für Venue wurde ein ansprechendes Dark-Mode Farbschema gewählt, das ein modernes Erscheinungsbild bietet. Die Farbpalette umfasst die folgenden Hauptfarben:
......@@ -103,7 +104,7 @@ Mit diesem Farbschema wird eine visuell ansprechende Oberfläche geschaffen, die
### Light-Modus
Die Möglichkeit in den Light-Modus zu wechseln besteht ebenfalls. Die _theme-provider.tsx_ Datei von shadcn verbindet die CSS Variablen entsprechend und sorgt dafür, dass sie in der gesamten Anwendung einheitlich angewendet werden. Die _mode-toggle.tsx_ Komponente bietet eine einfache Möglichkeit, zwischen verschiedenen Anzeigemodi umzuschalten, indem sie als _<ModeToggle>_ Komponente auf Seiten integriert wird.
Die Farben werden in der index.css Datei festgelegt und können bei Bedarf angepasst werden. Die _background_ Variable steuert die Hintergrundfarben von Komponenten, während foreground für Texte und Icons verwendet wird. Diese CSS-Variablen können in der tailwind.config.js Datei konfiguriert werden und als Klassen über className="" genutzt werden.
Die Farben werden in der index.css Datei festgelegt und können bei Bedarf angepasst werden. Die _background_ Variable steuert die Hintergrundfarben von Komponenten, während _foreground_ für Texte und Icons verwendet wird. Diese CSS-Variablen können in der _tailwind.config.js_ Datei konfiguriert werden und als Klassen über _className=""_ genutzt werden.
### Logo
Das neue Logo von Venue ist eine stilisierte Audiowelle, die mit einem Farbverlauf der Hauptfarben aus dem Farbschema gestaltet ist. Der Farbverlauf beginnt auf der linken Seite mit der Farbe der Informatik (#FFCC00), geht in der Mitte in ein Grün über, dass die Hochschule Reutlingen symbolisieren soll und endet auf der rechten Seite mit der Farbe des Studiengangs Human-centered Computing (#13678A). Mit diesem neuen Logo soll die Identität von Venue gestärkt werden.
......@@ -252,7 +253,8 @@ Für das Design wurde eine Vielzahl von UI-Komponenten genutzt, um eine ansprech
Diese Komponenten wurden mit Blick auf Benutzerfreundlichkeit, Barrierefreiheit und Anpassbarkeit ausgewählt und tragen dazu bei, eine intuitive und effiziente Benutzeroberfläche für Venue zu gestalten.
## Herausforderungen
Während der Entwicklung traten mehrere Herausforderungen auf, die zu einer Anpassung der ursprünglichen Pläne führten. Diese werden im folgenden genauerer erläutert.
Während der Entwicklung traten mehrere Herausforderungen auf, die zu einer Anpassung der ursprünglichen Pläne führten. Diese werden im folgenden genauerer erläutert. <br>
![image](uploads/0d782db6f0b11951a9f95f59ffef07da/image.png){width=224 height=312}
### Backend
Der ursprüngliche Plan sah vor, das alte Backend auszugliedern. Jedoch konnte trotz enger Zusammenarbeit mit Raphael der Loadbalancer nicht zum Laufen gebracht werden. Es traten Probleme bei der Einbindung des “ezMCU” auf (siehe Screenshot). Statt nutzbarer Daten wurden HTML-Codeabschnitte gerendert und an das Frontend geschickt. Sprich das ezMCU konnte nicht richtig verwendet werden. Deshalb konnte auch zum Beispiel die Funktion zur Steuerung von Audio nicht implementiert werden. <br>
......@@ -282,4 +284,11 @@ Im Rahmen des Projekts Venue wurden die priorisierten Hauptziele in diesem Semes
- Eine Funktion zur Geräuschunterdrückung für eine verbesserte Audioqualität während der Meetings sollte implementiert werden.
- Die Möglichkeit für Benutzer, Nachrichten zu liken, um Zustimmung oder Interesse auszudrücken sollte implementiert werden.
- Es sollte eine ausführliche Tour durch Venue, die neuen Nutzern hilft sich besser zurechtzufinden, bereitgestellt werden. Die Tour sollte zu jeder Zeit erneut aufrufbar sein.
- Die Lightmode Version steht bereits zur Verfügung, sollte aber optimiert und auf alle Seiten angewendet werden.
\ No newline at end of file
- Die Lightmode Version steht bereits zur Verfügung, sollte aber optimiert werden.
- JoinRoom wird aktuell noch nicht aufgerufen, dieser sollte bei der Weiterleitung zum Meetingroom noch angezeigt werden.
- Login als Gast ohne ein Passwort ist noch nicht möglich, dies sollte entsprechend implementiert werden.
- Im Meetingroom stehen noch offene Aufgaben wie zum Beispiel; Emojos im Chat, Notes und Controllbar, Draggables, Präsentationsmodus und Upload, Screenshare, 3D, Whiteboard, YT Cast.
- Des Weiteren sollte die Suchfunktion im Home Bereich implementiert werden.
<br>
Vielen Dank an alle Beteiligten für ihre Arbeit. <br>
![image](uploads/80a979f1af9d602a2f8cbb37e3b46c45/image.png){width=228 height=229}
\ No newline at end of file