Symulator CyberBezpieczeństwa – dokumentacja
CyberSafe EDU Simulator — dokumentacja funkcjonalna i techniczna
1. Cel aplikacji
CyberSafe EDU Simulator to dwujęzyczna aplikacja edukacyjna PL/EN przeznaczona do nauki cyberbezpieczeństwa w szkole. Łączy interaktywne misje, scenariusze decyzyjne, tryb kampanii, pracę klasową, system osiągnięć, raportowanie, tryby nauczyciela i administratora oraz funkcje instalowalnej aplikacji PWA.
Aplikacja została zaprojektowana tak, aby mogła być używana zarówno indywidualnie przez ucznia, jak i w ramach pracy z klasą prowadzonej przez nauczyciela.
Główne założenia:
- nauka cyberbezpieczeństwa przez praktyczne decyzje i symulacje;
- brak wykonywania niebezpiecznych operacji na prawdziwym systemie;
- 43 wbudowane misje systemowe;
- pięć pakietów tematycznych;
- trzy role: Uczeń, Nauczyciel, Administrator;
- lokalne i serwerowe profile uczniów;
- praca online i offline;
- wersja polska i angielska;
- raportowanie wyników;
- możliwość tworzenia własnych scenariuszy i misji;
- możliwość późniejszej integracji z innymi systemami szkolnymi przez API READ-ONLY.
2. Adres i główne pliki aplikacji
Docelowy adres aplikacji:
Najważniejsze pliki:
| Plik | Funkcja | ||
|---|---|---|---|
| landing page aplikacji | ||
| główny plik symulatora | ||
| manifest aplikacji PWA | ||
| obsługa cache i działania offline | ||
| główny backend PHP | ||
| dokumentacja aplikacji | ||
| dokumentacja API statystycznego |
Aplikacja jest przygotowana do działania przez serwer HTTP/HTTPS z obsługą PHP 8.x.
3. Role użytkowników
3.1. Uczeń
Uczeń może korzystać z aplikacji w dwóch modelach.
Profil lokalny
Profil działa bez obowiązkowego logowania.
Dane przechowywane lokalnie obejmują między innymi:
- nazwę profilu;
- XP;
- ukończone misje;
- historię prób;
- najlepsze wyniki;
- odznaki;
- poziom ucznia;
- kampanię;
- Codzienne wyzwania;
- Incydent dnia;
- dane sezonowe;
- ustawienia interfejsu;
- preferencje dostępności;
- Centrum zdarzeń.
Profil lokalny jest przechowywany przede wszystkim w
1 | localStorage |
Uczeń może również:
- eksportować profil do pliku JSON;
- importować profil z pliku JSON;
- przenieść profil na inne urządzenie lub do innej przeglądarki;
- połączyć profil z klasą za pomocą kodu klasy.
Konto serwerowe ucznia
Nauczyciel może utworzyć uczniowi pełne konto serwerowe.
Konto serwerowe umożliwia:
- logowanie z innego komputera;
- pobieranie postępu z serwera;
- synchronizację XP;
- synchronizację ukończonych misji;
- synchronizację historii prób;
- synchronizację odznak;
- synchronizację Codziennych wyzwań;
- synchronizację wyników Generatora incydentów;
- pracę z klasą;
- zmianę własnego hasła.
Konto ucznia jest przypisane do konkretnej klasy.
3.2. Nauczyciel
Panel nauczyciela jest chroniony loginem i hasłem.
Nauczyciel może:
- tworzyć klasy;
- edytować klasy;
- generować kody klas;
- przypisywać misje do klas;
- ustalać poziom trudności;
- blokować zestaw misji;
- tworzyć własne zestawy misji;
- korzystać z zestawów systemowych;
- losować zestawy misji;
- tworzyć konta uczniów;
- blokować i odblokowywać konta uczniów;
- przeglądać postęp uczniów;
- analizować wyniki;
- prowadzić Lekcję na żywo;
- uruchamiać Tryb egzaminacyjny;
- tworzyć drużyny;
- konfigurować tablicę wyników;
- przeglądać odznaki klasowe;
- przeglądać rangi sezonowe;
- tworzyć własne scenariusze;
- tworzyć własne pięcioetapowe misje;
- generować Raport PDF ucznia;
- generować Raport PDF klasy;
- eksportować wyniki do CSV i JSON.
3.3. Administrator
Administrator ma wszystkie uprawnienia nauczyciela oraz dodatkowe funkcje systemowe.
Administrator może:
- utworzyć pierwsze konto administratora przy pierwszym uruchomieniu;
- tworzyć konta nauczycieli;
- blokować i odblokowywać nauczycieli;
- przeglądać wszystkie klasy;
- przeglądać dziennik audytu;
- zarządzać backupem;
- eksportować dane systemu;
- importować backup;
- eksportować konfigurację;
- importować konfigurację;
- zarządzać kluczami API;
- unieważniać klucze API;
- decydować, czy konkretny klucz API może zwracać dane identyfikujące uczniów.
4. Uwierzytelnianie i bezpieczeństwo kont
Backend korzysta z PHP.
Hasła są:
- hashowane za pomocą;1password_hash()
- sprawdzane za pomocą;1password_verify()
- niewysyłane w postaci jawnej do plików danych;
- przechowywane wyłącznie w postaci bezpiecznych hashy.
Dodatkowe zabezpieczenia:
- sesje PHP;
- blokada logowania po kolejnych błędnych próbach;
- zmiana hasła wymaga podania aktualnego hasła;
- po zmianie hasła sesja jest unieważniana;
- administrator nie ma stałego fabrycznego hasła;
- pierwsza konfiguracja administratora jest jednorazowa;
- katalogii1server/data/są chronione przez1server/config/.1.htaccess
5. Pięć pakietów misji
Aplikacja zawiera 43 wbudowane misje systemowe podzielone na pięć pakietów.
5.1. Pakiet 1 — Fundamenty cyberbezpieczeństwa
Misje 1–19.
- Silne hasła
- Phishing
- Fałszywe logowanie
- Publiczne Wi‑Fi
- Malware
- Ransomware
- Aktualizacje
- Antywirus
- Socjotechnika
- Media społecznościowe i prywatność
- Ślad cyfrowy
- Bezpieczeństwo telefonu
- Uprawnienia aplikacji
- Kody QR
- Kopia zapasowa i zasada 3-2-1
- Uwierzytelnianie 2FA
- Incydent bezpieczeństwa
- Cyber Escape Room
- Misja finałowa
Pakiet 1 stanowi kurs podstawowy.
Ukończenie wszystkich misji 1–19 odblokowuje certyfikat kursu podstawowego.
5.2. Pakiet 2 — Codzienne zagrożenia
Misje 20–25.
- Deepfake i treści AI
- Oszustwa BLIK
- Bezpieczne zakupy online
- Bezpieczeństwo komunikatorów
- Fałszywe konkursy i giveawaye
- Cyberprzemoc i nękanie
Pakiet posiada osobną odznakę za ukończenie.
5.3. Pakiet 3 — Bezpieczeństwo urządzeń i sieci
Misje 26–31.
- Router domowy
- Smart Home i IoT
- USB i nośniki zewnętrzne
- Bezpieczeństwo chmury
- Szyfrowanie danych
- Bezpieczne usuwanie danych
Pakiet obejmuje zagadnienia związane z urządzeniami, siecią lokalną, IoT, nośnikami i ochroną danych.
5.4. Pakiet 4 — Zaawansowane cyberbezpieczeństwo
Misje 32–37.
- SIM swapping
- Makra i dokumenty Office
- Firmware / BIOS / UEFI
- Bezpieczeństwo AI i chatbotów
- Zaawansowana analiza incydentów
- Scamy inwestycyjne i kryptowalutowe
Pakiet jest przeznaczony do bardziej zaawansowanej analizy zagrożeń.
5.5. Pakiet 5 — Tożsamość i prywatność
Misje 38–43.
- Kradzież tożsamości
- Wyciek danych
- Doxxing i ujawnianie danych
- Oszustwa telefoniczne / vishing
- Bezpieczeństwo dokumentów i skanów
- Dane w formularzach i serwisach
Pakiet koncentruje się na ochronie danych osobowych i tożsamości cyfrowej.
6. Mechanika misji
Większość misji wykorzystuje zestaw interaktywnych sytuacji i decyzji.
System obsługuje:
- pytania jednokrotnego wyboru;
- scenariusze decyzyjne;
- interaktywne symulacje;
- raport po zakończeniu;
- XP;
- poziom trudności;
- historię prób;
- najlepszy wynik;
- ostatni wynik;
- synchronizację z kontem serwerowym;
- wyniki w panelu nauczyciela.
7. Losowe warianty pytań
Aplikacja ogranicza możliwość uczenia się odpowiedzi na pamięć.
Przy kolejnych podejściach może być losowana:
- kolejność pytań;
- kolejność odpowiedzi;
- sformułowanie pytania;
- kontekst sytuacji.
Poprawna odpowiedź jest identyfikowana stabilnym identyfikatorem, a nie położeniem w interfejsie.
W misjach proceduralnych, w których kolejność etapów jest częścią materiału, kolejność etapów pozostaje stała.
Dotyczy to między innymi:
- Ransomware;
- reakcji na incydent;
- Cyber Escape Room.
8. Poziomy trudności
Dostępne są trzy poziomy:
- Łatwy;
- Standardowy;
- Trudny.
Nauczyciel może:
- ustawić domyślny poziom;
- ustawić poziom osobno dla konkretnej klasy.
Poziom trudności wpływa między innymi na:
- próg zaliczenia;
- dostępność podpowiedzi;
- wymagany wynik.
9. System XP i poziomów
Uczeń zdobywa XP za wykonywanie misji i aktywności.
Poziomy stałe ucznia obejmują:
- Cyberkadet;
- Cyberobrońca;
- Cyberanalityk;
- Specjalista SOC;
- Cyber Expert;
- Cyber Master.
XP nie jest resetowane przy zmianie sezonu.
10. Odznaki indywidualne
Aplikacja posiada rozbudowany system odznak.
Przykładowe osiągnięcia:
- Pierwszy krok;
- Cyber Strażnik;
- Cyber Analityk;
- Strażnik kont;
- Łowca manipulacji;
- Pogromca malware;
- Strażnik prywatności;
- Mistrz odporności;
- Cyber Escaper;
- Egzamin zdany;
- Perfekcyjna piątka;
- Nie poddawaj się;
- Cyber Master;
- Strażnik codziennych zagrożeń;
- Strażnik urządzeń i sieci;
- Cyberanalityk zaawansowany;
- Strażnik tożsamości;
- Mistrz kampanii;
- Tydzień czujności.
11. Certyfikat ukończenia
Certyfikat odblokowuje się po ukończeniu misji 1–19.
Certyfikat zawiera między innymi:
- nazwę ucznia;
- średni wynik;
- datę ukończenia;
- poziom XP;
- stabilny numer certyfikatu.
Certyfikat jest przygotowany do:
- wydruku;
- zapisania jako PDF.
12. Tryb kampanii
Tryb kampanii Operacja CyberSafe prowadzi ucznia przez wszystkie 43 misje.
Kampania jest podzielona na siedem rozdziałów:
- Pierwszy alarm
- Ochrona cyfrowego środowiska
- Operacja Odporność
- Codzienne zagrożenia
- Urządzenia i sieć
- Strefa eksperta
- Tożsamość na celowniku
Kampania wykorzystuje istniejące wyniki misji.
Nie tworzy osobnej kopii postępu.
Funkcje:
- odblokowywanie kolejnych rozdziałów;
- pasek postępu;
- status zablokowany / aktywny / ukończony;
- przycisk Kontynuuj operację;
- integracja z profilami lokalnymi i serwerowymi.
13. Codzienne wyzwanie
Uczeń otrzymuje jedno wyzwanie dziennie.
System obsługuje:
- deterministyczne wyzwanie na konkretny dzień;
- możliwość zdobycia nagrody tylko raz dziennie;
- XP;
- bieżącą serię;
- najlepszą serię;
- liczbę ukończonych wyzwań;
- odznakę za serię siedmiu dni;
- synchronizację z kontem serwerowym.
14. Incydent dnia
Na dashboardzie ucznia znajduje się karta Incydent dnia.
Jest to szybka, jednopytaniowa sytuacja cyberbezpieczeństwa.
Funkcje:
- nowy incydent każdego dnia;
- trzy warianty odpowiedzi;
- natychmiastowa informacja zwrotna;
- wyjaśnienie;
- historia prób;
- statystyka poprawnych odpowiedzi;
- zapis do Centrum zdarzeń;
- niezależność od Codziennego wyzwania.
15. Generator losowych incydentów
Generator buduje dynamiczny incydent z kilku niezależnych elementów.
Może losować:
- punkt wejścia ataku;
- typ zagrożenia;
- objaw;
- zagrożony zasób;
- właściwą reakcję.
Uczeń wybiera pierwsze działania w odpowiedniej kolejności.
Generator zapisuje:
- liczbę prób;
- najlepszy wynik;
- historię ostatnich incydentów;
- statystyki profilu.
16. Rangi i sezony
System sezonowy działa niezależnie od stałego XP.
Sezony są kwartalne:
- Q1;
- Q2;
- Q3;
- Q4.
Punkty sezonowe są resetowane przy rozpoczęciu nowego sezonu.
Stałe XP, misje i odznaki nie są resetowane.
Rangi sezonowe:
- Rekrut;
- Cyber Zwiadowca;
- Obrońca;
- Analityk;
- Incident Responder;
- Cyber Elita;
- Mistrz Sezonu.
Aplikacja zapisuje historię poprzednich sezonów.
17. Klasy
Nauczyciel może tworzyć klasy.
Każda klasa może zawierać:
- nazwę;
- kod klasy;
- zestaw misji;
- poziom trudności;
- ustawienia blokowania misji;
- uczniów;
- konfigurację tablicy wyników.
Uczeń może dołączyć do klasy za pomocą kodu.
18. Zestawy misji
Nauczyciel może tworzyć zestaw klasy na kilka sposobów:
- ręczny wybór misji;
- losowanie misji;
- gotowy zestaw systemowy;
- zapisany wcześniej zestaw własny.
Dostępne są zestawy odpowiadające pakietom tematycznym.
19. Wyniki uczniów i analityka
Panel nauczyciela zawiera podsumowanie wyników uczniów.
Dostępne dane obejmują między innymi:
- procent realizacji;
- liczbę ukończonych misji;
- XP;
- ostatnią aktywność;
- najlepsze wyniki;
- liczbę prób;
- datę ukończenia;
- historię aktywności.
Analityka klasy obejmuje:
- ranking;
- średni postęp;
- średni wynik;
- liczbę prób;
- najmocniejsze obszary;
- słabsze obszary;
- wyniki według misji;
- analizę kompetencji.
Brak danych nie jest zastępowany szacowaniem.
20. Lekcja na żywo
Nauczyciel może uruchomić aktywną misję dla całej klasy.
Funkcje:
- wybór klasy;
- wybór misji;
- uruchomienie lekcji;
- automatyczne odświeżanie statusów;
- status oczekuje / w trakcie / ukończona;
- tryb skupienia;
- blokowanie innych misji;
- odblokowywanie misji;
- reset wyniku wybranego ucznia;
- zakończenie lekcji;
- baner aktywnej lekcji u ucznia.
21. Tryb egzaminacyjny
Nauczyciel może uruchomić egzamin dla klasy.
Konfiguracja obejmuje:
- czas egzaminu;
- liczbę zadań;
- próg zaliczenia;
- losowanie pytań;
- wybór klasy.
W trakcie egzaminu:
- działa licznik czasu;
- F1 i podpowiedzi są wyłączone;
- próba jest zapisywana po stronie serwera;
- wyniki egzaminu są przechowywane osobno od zwykłych misji.
Nauczyciel widzi:
- wynik;
- liczbę poprawnych odpowiedzi;
- zaliczenie / niezaliczenie;
- czas wykonania;
- datę przesłania.
22. Odznaki klasowe
Klasa może wspólnie zdobywać osiągnięcia.
Przykłady:
- Wspólny start;
- Klasa bez phishingu;
- Mistrzowie 2FA;
- Backup Crew;
- Klasa 85+;
- Misja wykonana wspólnie;
- Aktywna cyberklasa;
- Codzienni obrońcy.
Odznaki klasowe są wyliczane automatycznie.
Widoczny jest również procent postępu do zdobycia odznaki.
23. Tablica wyników klasy
Nauczyciel może włączyć lub wyłączyć ranking.
Dostępne metryki:
- punkty sezonowe;
- XP;
- procent ukończenia zestawu.
Tryby prywatności:
- anonimowy pseudonim;
- samo imię;
- pełna nazwa.
Uczeń widzi tylko ranking swojej klasy.
Interfejs zawiera:
- podium TOP 3;
- pełną tabelę klasy.
24. Tryb drużynowy
Nauczyciel może utworzyć zespoły 2–4 osobowe.
Funkcje:
- nazwa zespołu;
- skład zespołu;
- przypisanie wspólnej misji;
- status członków;
- wynik zespołu;
- wspólny postęp.
Zadanie drużynowe jest ukończone, gdy wykonają je wszyscy członkowie.
Dane drużyn są przechowywane po stronie serwera.
25. Bank scenariuszy nauczyciela
Nauczyciel może tworzyć pojedyncze własne przypadki.
Scenariusz zawiera:
- tytuł;
- kategorię;
- poziom trudności;
- opis sytuacji;
- pytanie;
- cztery odpowiedzi;
- poprawną odpowiedź;
- wyjaśnienie.
Scenariusz można:
- zapisać;
- edytować;
- duplikować;
- usunąć;
- przypisać do jednej lub wielu klas.
Uczeń widzi tylko scenariusze przypisane do jego klasy.
Poprawna odpowiedź nie jest wysyłana uczniowi przed oceną.
26. Edytor własnej misji
Nauczyciel może utworzyć pełną własną misję złożoną z pięciu sytuacji.
Każda sytuacja zawiera:
- opis;
- pytanie;
- cztery odpowiedzi;
- poprawną odpowiedź;
- wyjaśnienie;
- liczbę punktów.
Misja zawiera:
- tytuł;
- opis;
- poziom trudności;
- próg zaliczenia;
- przypisanie do klas.
Wynik jest obliczany po stronie serwera.
Własne misje są przechowywane osobno od 43 misji systemowych.
27. Raport PDF ucznia
Uczeń może wygenerować raport swoich wyników.
Nauczyciel może wygenerować raport wskazanego ucznia.
Raport obejmuje między innymi:
- dane ucznia;
- klasę;
- XP;
- poziom;
- postęp misji;
- najlepsze wyniki;
- liczbę prób;
- odznaki;
- punkty sezonowe;
- Codzienne wyzwania;
- Generator incydentów;
- najmocniejsze wyniki;
- obszary do dalszej pracy;
- szczegółową tabelę misji.
Raport jest przygotowany do wydruku w formacie A4.
PDF powstaje przez systemowe okno:
Drukuj → Zapisz jako PDF
28. Raport PDF klasy
Nauczyciel lub administrator może wygenerować raport zbiorczy klasy.
Raport zawiera:
- nazwę klasy;
- kod klasy;
- nauczyciela;
- liczbę uczniów;
- średni postęp;
- liczbę uczniów, którzy ukończyli zestaw;
- łączną liczbę prób;
- średni wynik;
- analizę misji;
- analizę kompetencji;
- odznaki klasowe;
- ranking sezonowy;
- szczegółową tabelę uczniów.
Raport działa w PL/EN i jest przygotowany do wydruku A4.
29. Powiadomienia toast
Aplikacja wykorzystuje spójny system krótkich komunikatów.
Typy:
- sukces;
- informacja;
- ostrzeżenie;
- błąd.
Toast jest krótkim komunikatem ekranowym.
Ważne informacje mogą być dodatkowo zapisane do Centrum zdarzeń.
30. Centrum zdarzeń
Każdy profil posiada historię ważnych wydarzeń.
Przykładowe wpisy:
- ukończenie misji;
- zdobycie odznaki;
- awans rangi;
- wynik egzaminu;
- Codzienne wyzwanie;
- import profilu;
- przypisanie do drużyny.
Funkcje:
- licznik nieprzeczytanych;
- filtrowanie;
- oznaczanie jako przeczytane;
- oznaczanie wszystkich jako przeczytane;
- usuwanie przeczytanych wpisów.
Historia jest ograniczona do 250 najnowszych wpisów na profil.
31. Pomoc i F1
Aplikacja posiada pełne Centrum Pomocy.
Pomoc zawiera:
- wyszukiwarkę;
- kategorie dla ucznia;
- kategorie dla nauczyciela;
- kategorie dla administratora;
- opis kont;
- opis misji;
- rozwiązywanie problemów;
- opis nowych modułów.
Klawisz
1 | F1 |
32. Dostępność
Aplikacja posiada panel dostępności.
Opcje:
- większy tekst;
- wysoki kontrast;
- ograniczenie animacji;
- wyraźniejszy fokus;
- obsługa klawiatury.
Skróty i zachowania:
- — panel dostępności;1Alt+A
- /1Tab— przechodzenie między elementami;1Shift+Tab
- /1Enter— aktywacja;1Spacja
- — zamknięcie modala;1Escape
- — pomoc.1F1
Aplikacja respektuje:
1 | prefers-reduced-motion |
Ustawienia są przechowywane lokalnie.
33. Wersja PL/EN
Aplikacja posiada jeden wspólny kod dla języka polskiego i angielskiego.
Nie istnieje osobny
1 | start-en.html |
Język można zmienić:
- na landing page;
- w symulatorze.
Wybór jest zapamiętywany w
1 | localStorage |
Tłumaczenia obejmują:
- interfejs;
- wszystkie 43 misje;
- panele;
- pomoc;
- komunikaty dynamiczne;
- raporty;
- pytania egzaminacyjne;
- moduły nauczyciela;
- moduły administratora;
- daty i locale;
- wybrane metadane strony.
34. Import i eksport profilu lokalnego JSON
Profil lokalny można przenieść do pliku JSON.
Format posiada identyfikator:
1 | CyberSafeLocalProfile |
Eksport obejmuje między innymi:
- ID profilu;
- nazwę;
- XP;
- misje;
- wyniki;
- odznaki;
- historię;
- Codzienne wyzwania;
- sezony;
- Generator incydentów;
- ustawienia.
Import:
- waliduje strukturę;
- pokazuje podsumowanie;
- ostrzega przed konfliktem ID;
- wymaga świadomego potwierdzenia zastąpienia profilu.
Mechanizm nie importuje kont serwerowych.
35. Backup administratora
Administrator może utworzyć pełny backup danych systemowych.
Backup może obejmować:
- konta;
- klasy;
- postęp;
- zestawy misji;
- egzaminy;
- lekcje;
- drużyny;
- scenariusze nauczyciela;
- własne misje;
- wyniki;
- ustawienia;
- dane API.
Przed pełnym importem system tworzy kopię awaryjną bieżącego stanu.
Plik importu jest walidowany.
Operacja jest zapisywana w dzienniku audytu.
36. Eksport i import konfiguracji
Administrator może osobno eksportować konfigurację bez danych wynikowych uczniów.
Pozwala to przenosić ustawienia systemu bez przywracania pełnego backupu.
37. API statystyczne READ-ONLY
Aplikacja posiada API przeznaczone do późniejszej integracji z:
- LMS;
- dziennikiem elektronicznym;
- dashboardem szkolnym;
- innym systemem raportowym.
API jest tylko do odczytu.
Nie pozwala:
- zmieniać kont;
- zmieniać klas;
- zmieniać wyników;
- uruchamiać egzaminów;
- modyfikować konfiguracji.
Podstawowe zasoby:
- podsumowanie systemu;
- lista klas;
- statystyki klasy;
- statystyki ucznia.
Autoryzacja:
1 | X-CyberSafe-API-Key |
lub:
1 | Authorization: Bearer <klucz> |
Klucze:
- są generowane w panelu administratora;
- mają sekret pokazywany tylko raz;
- są zapisywane na serwerze jako SHA-256 hash;
- mogą być unieważnione.
Domyślnie API nie musi zwracać nazw uczniów.
Może stosować anonimowe identyfikatory
1 | anon_... |
Każda odpowiedź zawiera informacje typu:
- ;1schema_version
- ;1app_version
- .1generated_at
Dokumentacja znajduje się w:
1 | docs/api-statystyki.md |
38. PWA — instalowalna aplikacja
CyberSafe EDU może działać jako Progressive Web App.
Pliki:
- ;1manifest.webmanifest
- ;1service-worker.js
- ;1assets/icon-192.png
- .1assets/icon-512.png
Po pierwszym uruchomieniu przez HTTPS aplikację można zainstalować na urządzeniu.
Użytkownik może uruchamiać ją podobnie do zwykłej aplikacji.
39. Tryb offline-first
Po pierwszym uruchomieniu online Service Worker zapisuje kluczowe zasoby w cache.
Offline mogą działać między innymi:
- 43 misje;
- kampania;
- Incydent dnia;
- Generator incydentów;
- profile lokalne;
- XP;
- odznaki;
- Centrum zdarzeń;
- dostępność;
- PL/EN;
- raport ucznia;
- import/eksport profilu.
Dla wcześniej użytego konta serwerowego aplikacja może przechowywać lokalny snapshot roboczy.
40. Kolejka synchronizacji offline
Zmiany wykonywane bez Internetu trafiają do kolejki w
1 | IndexedDB |
Przykładowy przebieg:
- uczeń loguje się online;
- aplikacja zapisuje lokalny snapshot;
- Internet zostaje utracony;
- uczeń wykonuje misję;
- wynik zostaje zapisany lokalnie;
- aplikacja pokazuje liczbę oczekujących zmian;
- Internet wraca;
- aplikacja próbuje automatycznie zsynchronizować dane;
- po sukcesie kolejka jest opróżniana.
Status połączenia może pokazywać:
- Online;
- Offline;
- Synchronizacja;
- Zsynchronizowano.
Użytkownik może również wywołać synchronizację ręcznie.
41. Funkcje wymagające połączenia online
Niektóre moduły zależą od wspólnych danych serwera.
W pełni online działają przede wszystkim:
- panel nauczyciela;
- panel administratora;
- tworzenie klas;
- konta serwerowe;
- Lekcja na żywo;
- egzaminy zarządzane przez nauczyciela;
- tablica klasy;
- drużyny;
- backup serwerowy;
- API statystyczne;
- pobieranie nowych scenariuszy nauczyciela;
- pobieranie nowych własnych misji nauczyciela.
42. Landing page
Plik:
1 | index.html |
Landing page zawiera:
- opis aplikacji;
- przycisk uruchamiający;1start.html
- informacje o misjach;
- informacje dla ucznia;
- informacje dla nauczyciela;
- podstawowe informacje o funkcjach;
- favicon;
- metadane SEO;
- Open Graph;
- obsługę wersji PL/EN;
- responsywny wygląd.
43. Interfejs użytkownika
Styl aplikacji:
- ciemne tło;
- estetyka cyber / SOC;
- neonowe akcenty;
- glassmorphism;
- animowane elementy;
- responsywne karty;
- toast notifications;
- płynne przejścia;
- tryb pełnoekranowy;
- dźwięki interfejsu generowane lokalnie.
Aplikacja jest dostosowana do:
- komputerów;
- laptopów;
- tabletów;
- telefonów.
44. Dźwięki interfejsu
Aplikacja może generować krótkie dźwięki interfejsu bez zewnętrznych plików audio.
Dźwięki można wyłączyć.
Ustawienie jest przechowywane lokalnie.
45. Pełny ekran
Aplikacja posiada przycisk przełączający interfejs w tryb pełnoekranowy, jeśli przeglądarka obsługuje Fullscreen API.
46. Struktura frontendowa
Główne moduły JavaScript:
| Plik | Odpowiedzialność | ||
|---|---|---|---|
| główna logika aplikacji i widoków | ||
| definicje misji | ||
| profile, XP, osiągnięcia | ||
| warstwa przechowywania lokalnego | ||
| role, logowanie, klasy, panel użytkownika | ||
| tłumaczenia PL/EN | ||
| F1 i Centrum Pomocy | ||
| poziomy trudności | ||
| tryb egzaminacyjny | ||
| kampania | ||
| Codzienne wyzwanie | ||
| Incydent dnia | ||
| rangi i sezony | ||
| odznaki klasowe | ||
| tablica klasy | ||
| tryb drużynowy | ||
| generator incydentów | ||
| raport ucznia | ||
| raport klasy | ||
| backup administratora | ||
| zarządzanie API | ||
| import/eksport profilu | ||
| toasty i Centrum zdarzeń | ||
| dostępność | ||
| losowe warianty pytań | ||
| Bank scenariuszy nauczyciela | ||
| Edytor własnych misji | ||
| PWA, status sieci i kolejka synchronizacji | ||
| interakcje landing page |
Główne arkusze stylów:
- ;1css/style.css
- .1css/landing.css
47. Backend PHP
Głównym punktem backendu jest:
1 | server/api.php |
Backend obsługuje między innymi:
- sesje;
- logowanie;
- tworzenie kont;
- klasy;
- synchronizację postępu;
- wyniki;
- egzaminy;
- Live Lesson;
- zestawy misji;
- drużyny;
- własne scenariusze;
- własne misje;
- backup;
- konfigurację;
- API statystyczne;
- synchronizację danych ucznia.
48. Dane serwerowe
Dane są przechowywane bez klasycznej bazy SQL — w plikach JSON.
Aktualna struktura zawiera między innymi:
- ;1server/data/api_keys.json
- ;1server/data/audit.json
- ;1server/data/classes.json
- ;1server/data/custom_mission_results.json
- ;1server/data/custom_missions.json
- ;1server/data/exam_attempts.json
- ;1server/data/exam_results.json
- ;1server/data/exams.json
- ;1server/data/lessons.json
- ;1server/data/mission_sets.json
- ;1server/data/progress.json
- ;1server/data/scenario_results.json
- ;1server/data/teacher_scenarios.json
- ;1server/data/teacher_settings.json
- .1server/data/teams.json
Dane uwierzytelniające:
1 | server/config/credentials.php |
49. Ochrona katalogów serwerowych
Katalogi zawierające dane posiadają pliki:
- ;1server/.htaccess
- ;1server/config/.htaccess
- .1server/data/.htaccess
Ich zadaniem jest ograniczenie bezpośredniego dostępu HTTP do wrażliwych plików.
50. Dziennik audytu
Operacje administracyjne mogą być zapisywane w:
1 | server/data/audit.json |
Dziennik może rejestrować między innymi:
- działania administratora;
- import backupu;
- eksport backupu;
- zarządzanie kontami;
- operacje konfiguracyjne.
51. Dane lokalne
Przeglądarka może wykorzystywać:
localStorage
Do lekkich danych lokalnych, takich jak:
- profile lokalne;
- język;
- ustawienia UI;
- preferencje dostępności;
- dźwięki;
- część postępu lokalnego.
IndexedDB
Do bardziej złożonych danych offline, przede wszystkim:
- kolejki synchronizacji;
- lokalnych danych wymagających późniejszej synchronizacji.
Cache Storage
Wykorzystywany przez Service Worker do przechowywania plików PWA.
52. Service Worker
1 | service-worker.js |
- cache plików aplikacji;
- uruchamianie aplikacji bez sieci;
- obsługę aktualizacji cache;
- usuwanie starszych cache;
- dostarczanie zasobów PWA.
Service Worker wymaga bezpiecznego kontekstu HTTPS.
Wyjątkiem do testów jest
1 | localhost |
53. Mechanizm startowy
Aplikacja posiada ekran inicjalizacji.
Aby zapobiec trwałemu zawieszeniu interfejsu:
- ekran startowy posiada mechanizm awaryjnego zamknięcia;
- błędy pojedynczych modułów nie powinny trwale blokować całej aplikacji;
- mechanizm tłumaczeń nie powinien reagować rekurencyjnie na własne zmiany DOM;
- Service Worker sprawdza aktualizację przy starcie.
54. Prywatność danych
Założenia prywatności:
- API domyślnie może działać bez nazw uczniów;
- ranking klasy może używać pseudonimów;
- nauczyciel decyduje o widoczności tablicy klasy;
- hasła nie są przechowywane jawnie;
- dane lokalne pozostają w przeglądarce użytkownika;
- pełne dane klasowe wymagają autoryzacji po stronie serwera.
55. Responsywność
Interfejs został zaprojektowany dla różnych rozdzielczości.
Obsługiwane są:
- desktop;
- laptop;
- tablet;
- telefon.
Elementy interfejsu dostosowują:
- liczbę kolumn;
- wielkość kart;
- menu;
- panele;
- formularze;
- tabele;
- modale.
56. Wymagania techniczne
Minimalne założenia środowiska:
- serwer HTTP/HTTPS;
- PHP 8.x;
- możliwość zapisu danych przez PHP do wymaganych plików JSON;
- nowoczesna przeglądarka obsługująca JavaScript;
- HTTPS dla PWA i Service Workera.
Zalecane przeglądarki:
- Chrome;
- Edge;
- Firefox;
- współczesne przeglądarki mobilne.
Nie zaleca się uruchamiania aplikacji przez:
1 | file:// |
ponieważ wtedy część serwerowa nie będzie działać.
57. Wdrożenie
Typowy układ wdrożenia:
- rozpakować aplikację na serwerze;
- upewnić się, że PHP 8.x działa;
- sprawdzić prawa zapisu katalogów wymaganych przez backend;
- wejść na;1index.html
- przejść do;1start.html
- utworzyć pierwsze konto administratora;
- utworzyć nauczycieli;
- skonfigurować klasy;
- uruchomić aplikację przynajmniej raz online, aby PWA zapisała zasoby;
- opcjonalnie zainstalować aplikację jako PWA.
58. Aktualizacja PWA
Po podmianie plików na serwerze przeglądarka może przez krótki czas posiadać starszy cache.
W razie problemów można:
- wykonać;1Ctrl+F5
- odświeżyć cache z poziomu ustawień aplikacji;
- wyczyścić dane witryny;
- ponownie uruchomić aplikację online.
Service Worker usuwa starsze cache zgodnie z aktualną konfiguracją aplikacji.
59. Raportowanie i eksport danych
Dostępne mechanizmy eksportu:
- CSV wyników klasy;
- JSON wyników;
- Raport PDF ucznia;
- Raport PDF klasy;
- eksport profilu lokalnego JSON;
- pełny backup administratora;
- eksport konfiguracji;
- API READ-ONLY.
60. Zakres bezpiecznej symulacji
CyberSafe EDU jest aplikacją edukacyjną.
Nie wykonuje rzeczywistych:
- ataków sieciowych;
- infekowania urządzenia;
- szyfrowania prawdziwych plików;
- modyfikacji systemu operacyjnego;
- przejmowania kont;
- zmian routera;
- operacji destrukcyjnych.
Wszystkie tego typu działania są przedstawiane w formie kontrolowanej symulacji, scenariusza lub decyzji edukacyjnej.
61. Najważniejsze możliwości aplikacji — skrót
CyberSafe EDU Simulator oferuje obecnie:
- 43 misje;
- 5 pakietów;
- PL/EN;
- profile lokalne;
- konta serwerowe;
- klasy;
- XP i poziomy;
- odznaki;
- certyfikat;
- trzy poziomy trudności;
- losowe warianty pytań;
- kampanię;
- Codzienne wyzwanie;
- Incydent dnia;
- Generator incydentów;
- sezony i rangi;
- odznaki klasowe;
- ranking klasy;
- tryb drużynowy;
- Lekcję na żywo;
- tryb egzaminacyjny;
- Bank scenariuszy nauczyciela;
- Edytor własnych misji;
- Raport PDF ucznia;
- Raport PDF klasy;
- toasty;
- Centrum zdarzeń;
- Centrum Pomocy i F1;
- tryb dostępności;
- import/eksport profilu JSON;
- backup administratora;
- import/eksport konfiguracji;
- API statystyczne READ-ONLY;
- PWA;
- instalację aplikacji;
- tryb offline-first;
- kolejkę synchronizacji IndexedDB;
- automatyczną synchronizację po odzyskaniu Internetu;
- responsywny interfejs;
- tryb pełnoekranowy;
- lokalnie generowane dźwięki interfejsu.
62. Struktura projektu
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74 /
├── index.html
├── start.html
├── manifest.webmanifest
├── service-worker.js
├── README.txt
│
├── assets/
│ ├── favicon.svg
│ ├── icon-192.png
│ └── icon-512.png
│
├── css/
│ ├── landing.css
│ └── style.css
│
├── js/
│ ├── accessibility.js
│ ├── admin_api.js
│ ├── admin_backup.js
│ ├── app.js
│ ├── auth.js
│ ├── campaign.js
│ ├── class_badges.js
│ ├── class_report.js
│ ├── custom_missions.js
│ ├── daily.js
│ ├── daily_incident.js
│ ├── difficulty.js
│ ├── exam.js
│ ├── help.js
│ ├── i18n.js
│ ├── incident_generator.js
│ ├── landing.js
│ ├── leaderboard.js
│ ├── local_profile_transfer.js
│ ├── missions.js
│ ├── notifications.js
│ ├── offline.js
│ ├── profiles.js
│ ├── question_variants.js
│ ├── seasons.js
│ ├── storage.js
│ ├── student_report.js
│ ├── teacher_scenarios.js
│ └── teams.js
│
├── server/
│ ├── .htaccess
│ ├── api.php
│ ├── config/
│ │ ├── .htaccess
│ │ └── credentials.php
│ └── data/
│ ├── .htaccess
│ ├── api_keys.json
│ ├── audit.json
│ ├── classes.json
│ ├── custom_mission_results.json
│ ├── custom_missions.json
│ ├── exam_attempts.json
│ ├── exam_results.json
│ ├── exams.json
│ ├── lessons.json
│ ├── mission_sets.json
│ ├── progress.json
│ ├── scenario_results.json
│ ├── teacher_scenarios.json
│ ├── teacher_settings.json
│ └── teams.json
│
└── docs/
├── api-statystyki.md
└── opis-aplikacji.md
63. Podsumowanie
CyberSafe EDU Simulator jest kompletną platformą edukacyjną do nauki cyberbezpieczeństwa, która łączy:
- interaktywne treści dydaktyczne;
- grywalizację;
- pracę indywidualną;
- pracę klasową;
- pracę drużynową;
- ocenianie;
- raportowanie;
- zarządzanie użytkownikami;
- własne materiały nauczyciela;
- bezpieczeństwo kont;
- działanie offline;
- instalację PWA;
- integrację przez API.
Architektura pozostaje stosunkowo lekka: frontend HTML/CSS/JavaScript, backend PHP 8.x i pliki JSON zamiast klasycznej bazy danych. Dzięki temu aplikację można wdrożyć na typowym hostingu obsługującym PHP bez konieczności utrzymywania oddzielnego serwera baz danych.


