Entwickeln Sie das Design einer Webanwendung (Telegram-Webanwendung).

Es muss ein Design für den VPN-Service in Figma entwickelt werden.  Referenz für das Design füge ich bei.  Es müssen Designs für 14 Seiten erstellt werden:

1. Startseite

Systembeschreibung: Informationen darüber, wie das System funktioniert.

Buttons: Einloggen, Registrierung, kurze Beschreibung der Abonnementstufen.

Sprachumschalter: Möglichkeit, die Sprache auszuwählen (Ukrainisch, Englisch).

2. Anmeldeseite

Anmeldeformular: Benutzername und Passwort.

Rollenwahl: Möglichkeit, eine Rolle auszuwählen (Benutzer, Assistent, Administrator).

Registrierung: Möglichkeit, sich zu registrieren, wenn der Benutzer noch kein Konto hat.

3. Profilseite

Benutzerinformationen: Name, E-Mail, Abonnementstatus, Coin-Balance (für Assistenten).

Konto-Einstellungen: Passwort ändern, Sprache der Benutzeroberfläche auswählen.

Referral-System: Generierung eines Referral-Links, Anzeige von Statistiken zu Referrals und Boni.

4. Benutzer-Dashboard

Anfrage erstellen: Formular zum Senden einer neuen Anfrage.

Aktuelle Anfragen: Liste aktiver Anfragen mit Status.

Anfragehistorie: Schneller Zugriff auf kürzlich abgeschlossene Anfragen.

5. Anfragehistorie des Benutzers

Vollständige Liste der Anfragen: Sortierung nach Status (erledigt, in Bearbeitung, storniert).

Filter: Nach Datum, Kategorie, Status.

Anfragedetails: Vollständige Informationen zu jeder Anfrage.

6. Verwaltung der Benutzerabonnements

Informationen zum aktuellen Abonnement: Verfügbare Funktionen, Anzahl der verbleibenden Anfragen.

Abonnement ändern: Möglichkeit, eine neue Abonnementstufe auszuwählen.

Abonnement verlängern: Button zur Verlängerung der Abonnementlaufzeit.

7. Assistenten-Dashboard

Aktuelle Anfragen: Liste von Anfragen, die der Assistent annehmen oder ablehnen kann.

Anfragedetails: Vollständige Informationen zu jeder Anfrage.

Buttons: Anfrage annehmen oder ablehnen, Timer für die Annahme.

8. Anfragehistorie des Assistenten

Liste der erledigten Anfragen: Anfragen, die der Assistent erfolgreich bearbeitet hat.

Filter: Nach Datum, Kategorie, Status.

Anfragedetails: Vollständige Informationen zu jeder abgeschlossenen Anfrage.

9. Aktivitätsstatistik des Assistenten

Gesamtaktivität: Statistik über erledigte, versäumte und abgelehnte Anfragen.

Durchschnittliche Antwortzeit: Analyse der Arbeitsgeschwindigkeit.

Coin-Balance: Aktuelle Coin-Balance mit Details zu jeder Anfrage.

10. Administrator-Dashboard

Gesamtstatistik: Anzahl aktiver Anfragen, Benutzer und Assistenten.

Aktive Anfragen: Möglichkeit zur Überwachung aktueller Anfragen, manuelle Zuweisung eines Assistenten.

Datenexport: Export von Daten zu Anfragen und Aktivitäten.

11. Überwachung der Aktivitäten der Assistenten

Übersicht der Assistenten: Statistik für jeden Assistenten (erledigte, versäumte, abgelehnte Anfragen).

Filter: Nach Datum, Aktivität, Anzahl der angenommenen Anfragen.

Details: Möglichkeit zur Ansicht detaillierter Informationen zu jedem Assistenten.

12. Möglichkeit zur Verwaltung der Benutzerabonnements für den Administrator

Einstellungen der Abonnementstufen: Möglichkeit, Abonnements hinzuzufügen, zu bearbeiten oder zu löschen.

Anfrage-Limits: Einstellungen für Beschränkungen für jede Abonnementstufe.

Preise und Angebote: Verwaltung von Preisen und Aktionen für Abonnenten.

13. Möglichkeit zur Verwaltung der Coins der Benutzer für den Administrator

Coin-Balance der Assistenten: Ansicht und Bearbeitung der Salden.

Coins hinzufügen/abbuchen: Möglichkeit, die Anzahl der Coins bei Assistenten manuell zu ändern.

Historie der Coin-Transaktionen: Protokoll aller Transaktionen mit Coins (wer Coins gutgeschrieben oder abgebucht bekam und warum).

14. Zahlungsseite für das Abonnement

Liste der verfügbaren Abonnements: Auswahl eines Abonnements mit Beschreibung der Stufen.

Zahlungsmethoden: Kreditkarte, PayPal, Kryptowährung.

Zahlungsbestätigung: Mitteilung über erfolgreiche Zahlung.

Zahlungsverwaltung (für Administrator): Ansicht der Zahlungshistorie, Überwachung aktiver Abonnements.