# Specyfikacja aplikacji „Lenavio Senior” ## 0a. Aktualizacja z 2026-07-29 W tej iteracji wprowadzono następujące zmiany (rozdziały poniżej zostały odpowiednio zaktualizowane, tu tylko skrót): - **Nowy, osobny ekran „Zgubiłem/am się”** (`zgubilem-sie.html`), dostępny z kafelka na ekranie głównym. Zawiera: przycisk wysyłający SMS z lokalizacją do kontaktu priorytetowego (dawna funkcja `trybZgubilemSie()`) **oraz** przeniesiony z ekranu SOS moduł codziennego zgłoszenia **„Nic mi nie jest”**. Ekran SOS (`sos.html`) nie zawiera już ani tego modułu, ani skrótu do „Kontakty zaufane” (ten pozostaje dostępny wyłącznie z kafelka na ekranie głównym) — patrz rozdz. 5 i 9. - **Zgłoszenie „Nic mi nie jest” realnie wysyła SMS.** Wcześniej funkcja tylko zapisywała lokalnie znacznik czasu, bez informowania kogokolwiek. Teraz, po dotknięciu „Zgłoś, że wszystko w porządku”, aplikacja wysyła SMS „Zgłaszam się: u mnie wszystko w porządku.” do kontaktu priorytetowego (wymaga wcześniejszego zdefiniowania takiego kontaktu w „Kontaktach zaufanych”) i zapisuje wpis w historii SOS. - **Kontakt priorytetowy zamiast „pierwszego na liście”.** W „Kontaktach zaufanych” każdy kontakt ma teraz przełącznik radiowy „Kontakt priorytetowy” — dokładnie jeden kontakt na liście może być tak oznaczony. To na jego numer trafiają wszystkie funkcje alarmowe (SOS, „Zgubiłem/am się”, check-in „Nic mi nie jest”), niezależnie od kolejności dodania. Pierwszy dodany kontakt staje się priorytetowy automatycznie; usunięcie kontaktu priorytetowego automatycznie przenosi priorytet na kolejny pozostały kontakt. Wspólna funkcja `pobierzKontaktPriorytetowy()` (`dane.js`) jest jedynym źródłem prawdy o tym, do kogo trafiają alarmy. - **Pole opisu kontaktu zaufanego.** Przy dodawaniu kontaktu można (opcjonalnie) wpisać krótki opis, kim jest ta osoba (np. „Córka”, „Lekarz”) — wyświetlany przy numerze na liście kontaktów. - **Modal potwierdzenia w stylu aplikacji zamiast natywnego `confirm()` przeglądarki.** Wszystkie akcje usuwania w aplikacji (leki, kontakty, przypomnienia, notatki, kontakty zaufane, import kopii zapasowej w Ustawieniach) korzystają teraz ze wspólnej funkcji `potwierdzWAplikacji(tresc, callback)` (`app.js`) — modal z przyciskami „Tak, na pewno” / „Anuluj”, wizualnie spójny z resztą aplikacji, zamiast systemowego okna `confirm()`. Przy okazji naprawiono ekran „Kontakty zaufane”, gdzie usuwanie kontaktu w ogóle nie miało dotąd żadnego potwierdzenia. - **Eksport i import danych aplikacji** — nowa sekcja „Kopia zapasowa” w Ustawieniach: „Eksportuj dane do pliku” zapisuje wszystkie dane użytkownika (kontakty, leki, przypomnienia, ustawienia itd.) do pliku `.json`; „Importuj dane z pliku” wczytuje taki plik i nadpisuje nim bieżące dane (po potwierdzeniu w modalu aplikacyjnym) — patrz rozdz. 2.3 i 9. - **Widoczność przycisków „Przeczytaj na głos” zależna od ustawienia w Ustawieniach.** Wcześniej przyciski odczytu na głos (Centrum Pomocy, notatki, pierwsza pomoc) były zawsze widoczne, niezależnie od przełącznika „Odczyt na głos” w Ustawieniach, przez co sam przełącznik sprawiał wrażenie, że nic nie robi. Teraz wspólna funkcja `zastosujWidocznoscPrzyciskowGlosu()` (`app.js`) chowa/pokazuje wszystkie przyciski z klasą `.btn-czytaj-na-glos` zgodnie z tym ustawieniem, a zaznaczenie przełącznika w Ustawieniach od razu odtwarza krótki komunikat głosowy potwierdzający, że funkcja działa. Dodano też takie przyciski w miejscach, gdzie ich wcześniej brakowało mimo dużej ilości treści: ekran Ćwiczenia (czyta wszystkie instrukcje) i Karta informacji medycznych/ICE (czyta zapisane dane medyczne) — patrz rozdz. 3.6 i 7.3. --- ## 0. Aktualizacja z 2026-07-28 W tej iteracji wprowadzono następujące zmiany w stosunku do wcześniejszej wersji specyfikacji (rozdziały poniżej zostały odpowiednio zaktualizowane, tu tylko skrót): - **Logo „Lenavio Senior”** w nagłówku ekranu głównego: człon „Lena” w kolorze `#c9973b` (złoto/musztarda), człon „vio” oraz wyraz „Senior” w bieli, całość czcionką **Keania One** (Google Fonts). - **Nowa kolejność kafelków** na ekranie głównym: Leki, Przypomnienia, Samopoczucie, Oddech, Ćwiczenia, Kontakty, Notatki, Pogoda, Powiadomienia, Ustawienia (patrz rozdz. 9). - **Nowa funkcja „Oddech”** — ćwiczenie oddechowe z odliczaniem (patrz rozdz. 4a). - **Nowa pozycja „Powiadomienia”** — ładuje zewnętrzną stronę `http://buser23.deploy.net.pl/testowo/powiadomienia.html` w ramce (`iframe`) wewnątrz aplikacji (patrz rozdz. 8a). - **Podstrona „Wspierają Nas”** (dawny grid mini-wizytówek sponsorów, `sponsorzy.html`) została zastąpiona ramką (`iframe`) ładującą zewnętrzną stronę `http://buser23.deploy.net.pl/testowo/wspierajanas.html` (patrz rozdz. 8, zaktualizowany). Pliki `sponsorzy.js`, `sponsorzy-dane.js` i `sponsor-szczegoly.html` pozostają w repozytorium, ale nie są już używane w bieżącym przepływie aplikacji (dawna, wewnętrzna lista sponsorów). - **Stopka (`pasek-dolny`)** na każdym ekranie zawiera teraz **trzy** równej szerokości przyciski zamiast dwóch: „Wspierają Nas”, nowy niebieski przycisk **„LenaAI”** (prowadzi do wyboru trybu rozmowy z Leną, `lena-tryby.html`) oraz „SOS”. Kafelek „Lena (AI)” został usunięty z siatki na ekranie głównym, ponieważ dostęp do Leny jest teraz zawsze dostępny z dolnego paska na każdym ekranie. - **Nagłówek (`pasek-gorny`)** na każdym ekranie poza ekranem głównym ma teraz, obok istniejącej strzałki powrotu, dodatkową **ikonkę domku** (`fa-house`) prowadzącą zawsze do ekranu głównego — niezależnie od tego, dokąd prowadzi strzałka powrotu. - **Kafelek „Pomoc”** został usunięty z siatki kafelków ekranu głównego — Centrum Pomocy pozostaje dostępne z każdego ekranu przez stałą ikonkę „Pomoc” w nagłówku (bez zmian w tym zakresie, patrz 3.5.1). - **Usunięto znak łącznika „-”** z widocznych tekstów i etykiet `aria-label` w całej aplikacji, zastępując go półpauzą „–” lub spacją tam, gdzie to stylistycznie właściwe (np. `aria-label="SOS – pomoc ratunkowa"`, „PIN (4–8 cyfr)”). --- ## 1. Opis ogólny **Lenavio Senior** to aplikacja webowa (HTML + CSS + JavaScript, bez PHP, bez bazy danych po stronie serwera), zaprojektowana z myślą o osobach starszych. Docelowo aplikacja zostanie zamknięta w natywnej aplikacji Android przy pomocy komponentu **WebView**, dlatego cała logika, przechowywanie danych i UI muszą działać samodzielnie w przeglądarce/WebView, bez zależności od backendu. Aplikacja pełni dwie główne role: 1. **Codzienne wsparcie i pomoc dla seniora** — przypomnienia, organizacja dnia, kontakt z bliskimi, funkcje ułatwiające obsługę telefonu. 2. **Funkcje ratunkowe (SOS)** — szybki dostęp do pomocy w sytuacjach zagrożenia zdrowia lub życia. --- ## 2. Wymagania techniczne i ograniczenia ### 2.1 Struktura plików — WYMAGANIE KRYTYCZNE Ze względu na docelowe opakowanie aplikacji w natywną apkę Android (WebView), **wszystkie pliki HTML, CSS i JS muszą znajdować się bezpośrednio w folderze głównym `LenavioSenior/`, bez żadnych podfolderów** (bez `/css`, `/js`, `/img` itp.). Przykładowa (płaska) struktura plików, jaka powstanie na etapie kodowania: ``` LenavioSenior/ ├── index.html ├── ekran-glowny.html ├── sos.html ├── kontakty.html ├── leki.html ├── przypomnienia.html ├── lena.html ├── pomoc.html ├── sponsorzy.html ├── ustawienia.html ├── styl.css ├── app.js ├── dane.js ├── sos.js ├── lena.js ├── oddech.html ├── oddech.js ├── powiadomienia.html ├── sponsorzy-dane.js ├── logo.png └── ... (kolejne pliki wg potrzeb, wszystkie płasko w tym samym folderze) ``` Nazwy plików muszą być unikalne i jednoznaczne (np. prefiksy typu `ekran-...`, `sos-...`, `lena-...`), skoro nie można porządkować ich w katalogach. #### 2.1.1 A co z folderem `assets` wymaganym przez WebView? To ważne rozróżnienie między **projektem web** (ten folder `LenavioSenior/`) a **projektem natywnym Android**, w który go później zapakujemy: - Natywny Android WebView najczęściej wczytuje pliki lokalne z lokalizacji `file:///android_asset/`, co wymaga, aby cała zawartość web znajdowała się w katalogu **`app/src/main/assets/`** projektu Android Studio. - To oznacza, że `assets` to **jeden, pojedynczy folder-kontener** na poziomie projektu Android (nie nasza rzecz na tym etapie) — a nie dodatkowy podfolder, który musimy tworzyć teraz w `LenavioSenior/`. - **Docelowy proces integracji:** cała płaska zawartość folderu `LenavioSenior/` (wszystkie pliki `.html`, `.css`, `.js`, obrazki) zostanie **skopiowana w całości, tak jak jest, do jednego folderu `assets/`** w projekcie Android Studio. Wewnątrz `assets/` pliki pozostają dokładnie tak płasko rozmieszczone, jak są teraz w `LenavioSenior/` — nie dodajemy żadnych podfolderów nawet wtedy. - **Wniosek:** na obecnym etapie (ten projekt webowy) **nic się nie zmienia** — pliki zostają płasko w `LenavioSenior/`. Folder `assets` to kwestia późniejszego kroku (tworzenia projektu Android Studio), a nie struktury tego repozytorium. Nie tworzymy więc pustego folderu `assets` w tym projekcie — byłby on nieużywany i mógłby wprowadzać w błąd co do docelowej struktury. - Do potwierdzenia przy starcie prac natywnych: dokładna metoda ładowania (`WebView.loadUrl("file:///android_asset/index.html")` lub alternatywnie `WebViewAssetLoader`), co nie ma wpływu na strukturę tego projektu web. ### 2.2 Technologie - **HTML5** — struktura widoków (multi-page app: osobne pliki `.html` dla poszczególnych ekranów, linkowane między sobą, LUB jeden `index.html` z przełączaniem widoków JS-em — do ustalenia na etapie implementacji). - **CSS3** — stylowanie, zmienne CSS (`:root { --... }`) dla łatwej zmiany motywu/kolorów, media queries pod różne rozdzielczości telefonów. - **JavaScript (vanilla, bez frameworków)** — cała logika interaktywności, walidacje, obsługa danych. - **Ikony: Font Awesome z CDN** — link do CDN w `` każdego pliku HTML (np. `https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.x/css/all.min.css`). - **Brak PHP, brak bazy danych, brak backendu.** ### 2.3 Przechowywanie danych Na etapie web (przed opakowaniem natywnym) dane użytkownika (kontakty alarmowe, leki, przypomnienia, ustawienia, dane osobowe seniora) będą przechowywane w: - **`localStorage`** — dla prostych ustawień i list (kontakty, leki, przypomnienia, motyw kolorystyczny, rozmiar czcionki). - **`IndexedDB`** — opcjonalnie, jeśli dane się rozrosną (np. historia przyjęcia leków, dziennik samopoczucia) — do rozważenia w fazie implementacji. Dostęp do danych będzie zrealizowany przez **warstwę abstrakcji w JS** (np. plik `dane.js` z funkcjami typu `zapiszDane(klucz, wartosc)`, `odczytajDane(klucz)`), tak aby w przyszłości można było podmienić implementację na wywołania natywnego mostka Android (`window.AndroidStorage.zapisz(...)`) **bez zmiany reszty kodu aplikacji**. Ekran Ustawienia zawiera sekcję **„Kopia zapasowa”** z funkcją eksportu i importu wszystkich danych aplikacji: „Eksportuj dane do pliku” zapisuje zawartość wszystkich kluczy `localStorage` używanych przez aplikację (kontakty, leki, przypomnienia, notatki, dane medyczne, ustawienia itd.) do pobieranego pliku `.json`; „Importuj dane z pliku” wczytuje taki plik i po potwierdzeniu (modal aplikacyjny, patrz 3.6a) nadpisuje nim bieżące dane w `localStorage`. Ułatwia to przenoszenie danych między urządzeniami i tworzenie kopii bezpieczeństwa przed zmianą telefonu. ### 2.4 Powiadomienia i przypomnienia Przypomnienia (np. o lekach, wizytach) są kluczową funkcją aplikacji. W fazie web: - Używamy przeglądarkowego **Notification API** oraz `setInterval`/harmonogramu sprawdzającego zbliżające się przypomnienia podczas gdy aplikacja jest otwarta. - Ograniczenie: powiadomienia web działają tylko gdy aplikacja/przeglądarka jest aktywna lub w tle w ograniczonym zakresie — **pełne powiadomienia systemowe (alarm działający nawet przy zamkniętej aplikacji) wymagają natywnego kodu Android** (AlarmManager/WorkManager + natywne Notifications). - Kod JS będzie wywoływał funkcje-hooki (np. `window.AndroidNotify?.zaplanujPowiadomienie(...)`), które w wersji web mogą nie robić nic lub używać Notification API, a w wersji natywnej zostaną podpięte pod prawdziwy system powiadomień Androida. ### 2.5 Funkcja SOS — wywołania telefonu/SMS Przyciski alarmowe będą korzystać ze standardowych linków: - `tel:+48XXXXXXXXX` — natychmiastowe otwarcie dialera z numerem alarmowym/kontaktu zaufanego. - `sms:+48XXXXXXXXX?body=...` — otwarcie aplikacji SMS z przygotowaną treścią (np. „Potrzebuję pomocy, moja lokalizacja: ...”). Te linki działają natywnie w przeglądarce Android i będą działać identycznie (lub zostaną przechwycone i rozszerzone) w WebView. Rozszerzenia takie jak automatyczne wysłanie lokalizacji GPS bez potwierdzenia użytkownika będą wymagały natywnego mostka Android (Geolocation + wysyłka SMS programowo) — na etapie web można zrealizować pobranie lokalizacji przez `navigator.geolocation` i dołączenie linku do mapy w treści SMS. ### 2.6 Panel konfiguracji (opiekun) Brak osobnego trybu logowania/roli w aplikacji. Konfiguracja danych (kontakty alarmowe, leki, przypomnienia, dane seniora) odbywa się w sekcji **„Ustawienia”**, dostępnej z poziomu tego samego urządzenia — typowo skonfigurowanej jednorazowo przez opiekuna/rodzinę, po czym senior korzysta z gotowych, uproszczonych ekranów. Sekcja Ustawienia może być zabezpieczona prostym PIN-em (przechowywanym w `localStorage`), aby senior przypadkowo nie zmienił kluczowych danych. --- ## 3. Wytyczne UX/UI ### 3.1 Ogólny charakter wizualny - Wygląd i układ typowej **aplikacji mobilnej** (nie strony www) — pełny ekran, brak przewijania poziomego, elementy dotykowe zajmujące dużą część ekranu. - **Układ kafelkowy (grid)** na ekranie głównym — duże, kwadratowe/prostokątne kafelki z ikoną Font Awesome + krótkim opisem tekstowym pod/nad ikoną. - Design **stonowany, ale kontrastowy i wyraźny** — unikamy jaskrawych, agresywnych barw, ale zachowujemy wysoki kontrast tekst/tło (zgodnie z WCAG AA/AAA). - Zaokrąglone rogi kafelków i przycisków (przyjazny, „miękki” wygląd), wyraźne cienie/obramowania oddzielające elementy. ### 3.2 Kolorystyka (propozycja) - Tło główne: ciepła biel / bardzo jasny beż (`#FAF7F2` lub podobny) — mniej męczące dla oczu niż czysta biel. - Kolor przewodni (nagłówki, aktywne elementy): stonowany granat lub morski (`#2C5F7C`) — kojarzy się ze spokojem i zaufaniem (kolor typowy dla aplikacji medycznych/opiekuńczych). - Kolor dla funkcji ratunkowych: **czerwień** (`#C0392B` / stonowana, nie neonowa) — jednoznacznie kojarzona z alarmem, używana tylko w sekcji SOS i przycisku alarmowym. - Kolor dla funkcji wsparcia/codziennych: zieleń/turkus (`#3E8E7E`) — kojarzy się ze zdrowiem, spokojem. - Kolor tekstu: prawie czarny (`#2B2B2B`), nigdy czysta czerń na czystej bieli (mniejsze zmęczenie oczu). - Tryb ciemny — do rozważenia jako opcja w Ustawieniach (część seniorów lepiej widzi jasny tekst na ciemnym tle). ### 3.2a Logo „Lenavio Senior” W nagłówku ekranu głównego widnieje wyraz „Lenavio Senior” zapisany jako logotyp: - Czcionka **Keania One** (Google Fonts) dla całego napisu logotypu. - Człon **„Lena”** w kolorze `#c9973b` (złoto/musztarda). - Człon **„vio”** (razem z „Lena” tworzy słowo „Lenavio”) oraz wyraz **„Senior”** — oba w kolorze białym, dla kontrastu z kolorowym tłem paska nagłówka. - Ikona `fa-heart` pozostaje przed logotypem jako dotychczas. ### 3.3 Typografia - Font systemowy bezszeryfowy, czytelny nawet w małym rozmiarze (np. `-apple-system, Roboto, Segoe UI, Arial, sans-serif`). - **Minimalny rozmiar czcionki: 18–20px** dla tekstu podstawowego, nagłówki 24–32px. - Możliwość **zwiększenia rozmiaru czcionki** globalnie z poziomu Ustawień (np. 3 poziomy: Normalny / Duży / Bardzo duży), realizowana przez zmienną CSS (`--rozmiar-bazowy`) zapisywaną w `localStorage`. - Wysoki kontrast, pogrubienie kluczowych etykiet, unikanie kursywy i cienkich wariantów fontu. ### 3.4 Przyciski i elementy dotykowe - Minimalny rozmiar obszaru dotykowego: **64×64 px** (rekomendacja dostępności dla seniorów, większa niż standardowe 44×44 px). - Duży odstęp między przyciskami, aby uniknąć przypadkowego naciśnięcia sąsiedniego elementu. - Wyraźny stan „aktywny/naciśnięty” (zmiana koloru/cienia) — natychmiastowa informacja zwrotna po dotknięciu. - Ikony Font Awesome w rozmiarze min. 32–40px, zawsze z podpisem tekstowym pod spodem (nigdy sama ikona bez opisu). ### 3.5 Nawigacja - Prosta **nawigacja jednopoziomowa** — z ekranu głównego maksymalnie 1 kliknięcie do każdej głównej funkcji. - Stały, duży **przycisk „Powrót”** oraz duży, zawsze widoczny **przycisk SOS** (pływający lub w stałym pasku, dostępny z każdego ekranu — np. czerwony przycisk w prawym dolnym rogu lub w dolnym pasku nawigacji). - Brak głębokich menu rozwijanych, brak gestów typu swipe jako jedynej metody nawigacji (senior może o nich nie wiedzieć) — każda akcja dostępna też przez widoczny przycisk. - Ekran główny podzielony wizualnie na dwie strefy: **„Pomoc ratunkowa”** (na górze lub wyróżniona kolorem czerwonym) i **„Codzienne wsparcie”** (poniżej, kolor spokojniejszy). #### 3.5.1 Stałe elementy interfejsu widoczne na każdym ekranie Oprócz przycisku SOS, na **każdym** ekranie aplikacji (nie tylko na ekranie głównym) muszą być stale widoczne kolejne elementy — najprościej w postaci stałego górnego i dolnego paska, który nie przewija się wraz z treścią: **Górny pasek (`pasek-gorny`):** 1. **Przycisk „Powrót” (`fa-arrow-left`)** — na wszystkich ekranach poza głównym, cofa zwykle o jeden krok w hierarchii (np. do listy nadrzędnej lub do ekranu głównego). 2. **Ikonka „Strona główna” (`fa-house`)** — na wszystkich ekranach poza głównym, tuż obok przycisku „Powrót” (po jego prawej stronie, w tej samej grupie po lewej stronie paska). Zawsze prowadzi bezpośrednio do ekranu głównego, niezależnie od tego, dokąd prowadzi „Powrót” — pozwala to na szybki powrót „do bazy” z dowolnego, nawet zagnieżdżonego ekranu (np. z wizytówki sponsora, z ekranu SOS-ICE). 3. **Ikonka „Pomoc” (`fa-circle-question`)** — zawsze w tym samym, stałym miejscu (prawy górny róg). Naciśnięcie przenosi do **Centrum Pomocy** (rozdział 7), z zapamiętaniem, na jakim ekranie był użytkownik, żeby po zamknięciu pomocy wrócił tam, gdzie był. **Dolny pasek (`pasek-dolny`)** — trzy przyciski równej szerokości, zawsze w tej kolejności: 1. **„Wspierają Nas” (`fa-handshake`)** — prowadzi do podstrony „Wspierają Nas” (rozdział 8). 2. **„LenaAI” (`fa-robot`, niebieski)** — prowadzi do wyboru trybu rozmowy z asystentką Leną (`lena-tryby.html`, rozdział 6). Jest to jedyne miejsce startowe rozmowy z Leną — na ekranie głównym nie ma już osobnego kafelka „Lena (AI)”, ponieważ ten przycisk jest dostępny z każdego ekranu. 3. **„SOS” (`fa-triangle-exclamation`, czerwony)** — funkcja ratunkowa, zawsze najbardziej wyróżniona wizualnie. Kolejność ważności wizualnej stałych elementów: **SOS > Pomoc > LenaAI ≈ Wspierają Nas** — SOS pozostaje najbardziej wyróżnionym (czerwień, duży rozmiar), pozostałe trzy przyciski dolnego paska mają równą szerokość i stonowaną kolorystykę (poza SOS), żeby nie konkurowały wizualnie z funkcją ratunkową, ale mieściły się czytelnie w jednej belce bez nadmiaru wolnego miejsca. ### 3.6 Dostępność (accessibility) - Atrybuty ARIA i `alt` na wszystkich ikonach/obrazkach. - Możliwość obsługi przez czytnik ekranu (TalkBack na Androidzie). - Duży, widoczny fokus klawiaturowy/dotykowy. - Funkcja odczytu tekstu na głos (Web Speech API — `speechSynthesis`), włączana globalnym przełącznikiem „Odczyt na głos” w Ustawieniach (`czyGlosWlaczony()`). Przełącznik steruje: (a) automatycznym odczytem odpowiedzi Leny (rozdz. 6.4), (b) **widocznością** wszystkich przycisków „Przeczytaj na głos”/„Odsłuchaj” w aplikacji (Centrum Pomocy, notatki, pierwsza pomoc, ćwiczenia, karta ICE) — przyciski te są ukryte, dopóki przełącznik nie jest włączony, dzięki wspólnej funkcji `zastosujWidocznoscPrzyciskowGlosu()` (`app.js`), wywoływanej po każdym renderowaniu treści zawierającej taki przycisk. Zaznaczenie przełącznika w Ustawieniach dodatkowo od razu odtwarza krótki komunikat testowy, żeby użytkownik miał natychmiastowe potwierdzenie, że mechanizm działa na jego urządzeniu/WebView. ### 3.6a Modal potwierdzenia akcji nieodwracalnych Każda akcja usuwania danych (kontakt, lek, przypomnienie, notatka, import kopii zapasowej nadpisujący dane) wymaga potwierdzenia w **modalu w stylu aplikacji** (te same klasy `.overlay-modal`/`.karta-modal` co pozostałe okna modalne, np. potwierdzenie SOS), a nie natywnym oknie `confirm()` przeglądarki — wspólna funkcja `potwierdzWAplikacji(tresc, callbackTak)` w `app.js`, wywołująca przekazany callback dopiero po dotknięciu „Tak, na pewno”. --- ## 4. Funkcjonalności — kategoria 1: Codzienne wsparcie i pomoc | # | Funkcja | Opis | |---|---------|------| | 1 | **Przypomnienia o lekach** | Lista leków z porami przyjęcia, dawką, opisem (np. „na nadciśnienie, po posiłku”). Powiadomienie o porze przyjęcia, możliwość oznaczenia „przyjęto” / „pomiń”. Prosty widok „co dziś jeszcze zostało do wzięcia”. | | 2 | **Przypomnienia o wizytach i wydarzeniach** | Prosty kalendarz/lista nadchodzących wizyt lekarskich, urodzin, spotkań — z powiadomieniem dzień wcześniej i w dniu wydarzenia. | | 3 | **Kontakty do bliskich** | Lista kontaktów (rodzina, sąsiad, lekarz rodzinny) z dużymi kafelkami zdjęcie+imię, jedno duże dotknięcie = połączenie telefoniczne (`tel:`). | | 4 | **Pogoda** | Prosty widok aktualnej pogody i prognozy na dziś/jutro, dużą czcionką, z ikoną i podpowiedzią praktyczną („weź parasol”, „ubierz się ciepło”) — wymaga API pogodowego (do ustalenia czy dozwolone zewnętrzne API, patrz pytania). | | 5 | **Dziennik samopoczucia / nastroju** | Prosty ekran z kilkoma dużymi ikonami/emoji do zaznaczenia samopoczucia danego dnia (np. skala 1–5) — buduje historię, którą opiekun może przejrzeć. | | 6 | **Notatki głosowe / przypomnienia własne** | Senior może nagrać krótką notatkę głosową lub dodać prostą notatkę tekstową jako przypomnienie dla siebie. | | 7 | **Ćwiczenia / gimnastyka dnia codziennego** | Krótkie, proste animacje/opisy ćwiczeń rehabilitacyjnych/rozciągających dla seniorów, z przypomnieniem o porze wykonania. | | 8 | **Duży zegar i data** | Ekran/widget z bardzo dużym zegarem i datą — orientacja w czasie to częsty problem, wyraźny stały element. | | 9 | **Instrukcje obsługi telefonu „krok po kroku”** | Proste przewodniki (tekst + duże ikony) jak wykonać podstawowe czynności na telefonie (np. „jak odebrać połączenie wideo”), jako pomoc edukacyjna. | | 10 | **Ulubione kontakty / szybkie wybieranie** | Skrót do 3–4 najważniejszych osób bezpośrednio z ekranu głównego. | | 11 | **Ustawienia dostępności** | Zmiana rozmiaru czcionki, kontrastu/motywu, głośności powiadomień, włączenie odczytu głosowego. | | 12 | **Krótkie treści relaksacyjne** | Np. cytaty dnia, proste ćwiczenia oddechowe, muzyka relaksacyjna (link/odtwarzacz) — opcjonalny element poprawiający samopoczucie. | | 13 | **Centrum Pomocy** | Zawsze dostępna (ikonka na każdym ekranie + kafelek) instrukcja obsługi całej aplikacji krok po kroku, zrozumiała dla seniora, z opcją odczytu na głos — szczegóły w rozdziale 7. | | 14 | **Asystentka AI Lena** | Rozmowa z AI w kilku trybach (przyjaciółka, doradczyni, wspominki, rozrywka i inne) — szczegóły w rozdziale 6. | | 15 | **Podstrona „Wspierają Nas”** | Zewnętrzna strona z wizytówkami firm/osób wspierających projekt, ładowana w ramce, dostępna przez przycisk „Wspierają Nas” w dolnym pasku — szczegóły w rozdziale 8. | | 16 | **Ćwiczenie oddechowe („Oddech”)** | Ekran z animowanym, pulsującym kołem i odliczaniem, prowadzący seniora przez cykl wdech/zatrzymanie/wydech — szczegóły w rozdziale 4a. | | 17 | **Powiadomienia** | Zewnętrzna strona z listą powiadomień, ładowana w ramce — szczegóły w rozdziale 8a. | --- ## 4a. Ćwiczenie oddechowe „Oddech” ### 4a.1 Cel Prosta, prowadzona technika oddechowa 4–2–6 (wdech 4 s / zatrzymanie 2 s / wydech 6 s), pomagająca się wyciszyć i uspokoić — dostępna jako osobny ekran (`oddech.html`), a nie tylko jako pojedyncza karta na ekranie Ćwiczeń (choć krótka wersja tekstowa tego samego ćwiczenia nadal znajduje się też w `cwiczenia.html`). ### 4a.2 Działanie - Duże, okrągłe, animowane koło pośrodku ekranu z liczbą sekund pozostałych do końca bieżącej fazy w środku. - Koło **powiększa się płynnie przez 4 sekundy** w fazie wdechu, **pozostaje powiększone przez 2 sekundy** w fazie zatrzymania, po czym **zmniejsza się płynnie przez 6 sekund** w fazie wydechu — wizualne tempo animacji jest zsynchronizowane z odliczaniem czasu danej fazy. - Pod kołem wyraźna, duża etykieta tekstowa aktualnej fazy („Wdech nosem…”, „Zatrzymaj oddech…”, „Wydech ustami…”) oraz licznik cyklu (np. „Cykl 2 z 5”). - Cykl powtarza się **5 razy**, po czym pojawia się komunikat zakończenia („Świetnie! Ćwiczenie zakończone.”). - Przycisk **„Rozpocznij”** uruchamia ćwiczenie; w trakcie trwania zamienia się na przycisk **„Zatrzymaj”**, który pozwala przerwać sesję w dowolnym momencie i wraca do stanu początkowego. - Ostrzeżenie na górze ekranu: w razie zawrotów głowy należy przerwać ćwiczenie. - Dostępne z ekranu głównego (kafelek „Oddech”, ikona `fa-wind`) oraz — jak każdy ekran — z ikonki Pomoc w nagłówku (temat „Jak skorzystać z ćwiczenia oddechowego?” w Centrum Pomocy, rozdział 7). --- ## 5. Funkcjonalności — kategoria 2: Funkcje ratunkowe (SOS) | # | Funkcja | Opis | |---|---------|------| | 1 | **Duży przycisk SOS** | Wyraźny, czerwony, zawsze dostępny przycisk (na ekranie głównym i jako stały element na każdym ekranie). Po naciśnięciu: ekran potwierdzenia (unikanie przypadkowego wywołania) z odliczaniem (np. 5 sekund z opcją anulowania), następnie wywołanie połączenia i/lub SMS do kontaktu alarmowego. | | 2 | **Lista kontaktów zaufanych** | Do 5 zdefiniowanych numerów (rodzina, sąsiad, lekarz), każdy z opcjonalnym opisem (np. „Córka”, „Lekarz”). Dokładnie jeden kontakt na liście jest oznaczony jako **priorytetowy** (przełącznik radiowy przy kontakcie) — to na jego numer trafiają wszystkie funkcje alarmowe aplikacji poza 112 (SOS, „Zgubiłem/am się”, check-in „Nic mi nie jest”). Pierwszy dodany kontakt staje się priorytetowy automatycznie; usunięcie kontaktu priorytetowego przenosi priorytet na kolejny pozostały. Konfigurowalne na ekranie „Kontakty zaufane”. | | 3 | **Szybkie połączenie z numerem alarmowym (112)** | Osobny, zawsze widoczny duży przycisk „Zadzwoń 112”, oddzielony wizualnie od kontaktów prywatnych. | | 4 | **Wysyłka lokalizacji GPS** | Przy wywołaniu SOS aplikacja pobiera aktualną lokalizację (`navigator.geolocation`) i dołącza link do mapy (Google Maps) w treści SMS wysyłanego do kontaktu priorytetowego. | | 5 | **Karta informacji medycznych (ICE)** | Ekran z kluczowymi informacjami medycznymi seniora: grupa krwi, alergie, przyjmowane leki, choroby przewlekłe, lekarz prowadzący — dostępny nawet z ekranu zablokowanego/bez PIN-u (istotne dla ratowników), z opcją odczytu na głos (patrz 3.6). | | 6 | **Instrukcja pierwszej pomocy** | Proste, obrazkowe/tekstowe instrukcje podstawowych sytuacji (np. co robić przy upadku, silnym bólu w klatce piersiowej) — wyłącznie informacyjne, nie zastępuje wezwania pomocy. | | 7 | **Alarm „Nic mi nie jest” (check-in)** | Osobny ekran „Zgubiłem/am się” (patrz funkcja 9), dostępny z ekranu głównego, a nie z ekranu SOS. Codzienne potwierdzenie „czuję się dobrze” jednym dotknięciem realnie **wysyła SMS** do kontaktu priorytetowego z informacją, że wszystko jest w porządku, i zapisuje wpis w historii SOS. Wymaga zdefiniowanego kontaktu priorytetowego. | | 8 | **Historia użycia SOS** | Prosty log (lokalnie), kiedy i do kogo wysłano alarm (w tym wpisy „zgubiłem się” i check-in) — przydatne dla opiekuna do przeglądu. | | 9 | **Tryb „zgubiłem się”** | Osobny ekran `zgubilem-sie.html`, dostępny z kafelka „Zgubiłem/am się” na ekranie głównym (nie z ekranu SOS). Wysyła do kontaktu priorytetowego wiadomość SMS z aktualną lokalizacją, bez pełnego alarmu SOS — łagodniejsza wersja na wypadek dezorientacji. Na tym samym ekranie znajduje się też moduł check-in „Nic mi nie jest” (funkcja 7). | --- ## 6. Asystentka AI „Lena” (Groq API) ### 6.1 Cel i idea **Lena** to konwersacyjna asystentka AI wbudowana w aplikację, mająca odpowiadać na dwie realne potrzeby seniorów: **towarzystwo w samotności** oraz **pomoc/doradztwo w codziennych sprawach**. Lena nie zastępuje funkcji 1–9 z rozdziału 4/5 (leki, SOS, kontakty) — jest dodatkowym, „ludzkim” interfejsem konwersacyjnym, korzystającym z darmowego API Groq. ### 6.2 Model działania i klucz API - Aplikacja **nie ma własnego backendu i nie przechowuje żadnych kluczy API na serwerze** — każdy użytkownik samodzielnie zakłada darmowe konto i generuje własny klucz na stronie [console.groq.com/keys](https://console.groq.com/keys). - Klucz API jest wklejany raz w ekranie **Ustawienia → Lena (AI)** i zapisywany lokalnie w `localStorage` przeglądarki/WebView — nigdy nie jest wysyłany gdzie indziej niż do `api.groq.com` przy każdym zapytaniu czatu. - Domyślny model: **`openai/gpt-oss-120b`** (dokładny identyfikator modelu do zweryfikowania na etapie implementacji wg aktualnej dokumentacji Groq — patrz „Otwarte kwestie”). Ekran Ustawień powinien umożliwiać podgląd/zmianę modelu dla bardziej zaawansowanych użytkowników (opcjonalnie, domyślnie ukryte pod „Ustawienia zaawansowane”, żeby nie przeciążać interfejsu seniora). - Zapytania do Groq wykonywane są bezpośrednio z JS w przeglądarce/WebView (`fetch` na endpoint zgodny z OpenAI Chat Completions API, np. `https://api.groq.com/openai/v1/chat/completions`), z nagłówkiem `Authorization: Bearer `. - **Uwaga bezpieczeństwa:** klucz w `localStorage` jest czytelny dla każdego skryptu działającego w tej samej aplikacji — akceptowalne, bo to prywatny, darmowy klucz użytkownika używany tylko na jego własnym urządzeniu, ale warto to jasno zakomunikować w Ustawieniach („Twój kod dostępu jest zapisany tylko na Twoim telefonie”). ### 6.3 Tryby działania Leny Każdy tryb to inny **rozbudowany prompt systemowy** (system prompt), przełączany przez seniora z dużego, czytelnego wybieralnika (kafelki z ikoną + nazwą trybu), widocznego na starcie czatu lub w górnym pasku ekranu Leny. Zmiana trybu w trakcie rozmowy powinna wyraźnie informować, że rozmowa „zaczyna się od nowa” (nowy kontekst). | Tryb | Ikona (FA) | Charakter | Kluczowe zasady w prompcie systemowym | |------|-----------|-----------|----------------------------------------| | **1. Przyjaciółka** | `fa-heart` / `fa-comments` | Ciepła, pogodna, z lekkim humorem, słucha, rozmawia „o wszystkim” — pogoda, wspomnienia, codzienność, samopoczucie. Zwalcza samotność. | Nigdy nie oceniaj, nie pouczaj bez potrzeby; okazuj empatię; możesz żartować życzliwie; zadawaj pytania zwrotne, żeby rozmowa „żyła”; pamiętaj, że rozmówca może być samotny — bądź obecna i ciepła, ale nie udawaj bycia człowiekiem. | | **2. Pomocna doradczyni** | `fa-lightbulb` / `fa-hands-helping` | Odpowiada i doradza w praktycznych, codziennych kwestiach (gotowanie, drobne sprawy urzędowe, obsługa sprzętu, organizacja dnia). | **Twarde zabezpieczenie:** przy jakimkolwiek temacie zdrowotnym lub prawnym — zawsze zaznacz, że nie jesteś lekarzem/prawnikiem, podaj tylko ogólną informację edukacyjną i **wyraźnie zalecaj konsultację z lekarzem / prawnikiem / odpowiednią instytucją**, nie podawaj dawek leków, diagnoz ani wiążących interpretacji prawnych. | | **3. Wspominki** | `fa-images` / `fa-book-open` | Zachęca do rozmowy o przeszłości, wspomnieniach, rodzinie — forma tzw. terapii reminiscencyjnej, przyjemna i budująca dla seniorów. | Zadawaj ciepłe, otwarte pytania o przeszłość („Jak wyglądały Pana/Pani wakacje w dzieciństwie?”), słuchaj aktywnie, nie zmieniaj tematu nagle, doceniaj opowieści. | | **4. Rozrywka** | `fa-masks-theater` / `fa-puzzle-piece` | Żarty, anegdoty, zagadki, proste gry słowne, ciekawostki. | Humor lekki, bez wulgarności i kontrowersji, dopasowany do starszego odbiorcy; proste zagadki z podsumowaniem odpowiedzi. | | **5. Cyfrowa pomoc domowa** | `fa-mobile-screen-button` / `fa-circle-question` | Cierpliwie wyjaśnia obsługę telefonu, aplikacji, internetu — krok po kroku, bez żargonu. | Tłumacz prostym językiem, jeden krok na raz, pytaj czy się udało, nigdy nie każ „kliknąć coś” bez podania gdzie to jest. | | **6. Motywatorka zdrowych nawyków** | `fa-person-walking` / `fa-glass-water` | Zachęca do ruchu, picia wody, dobrego snu, kontaktu z ludźmi. | Tylko ogólne, bezpieczne zachęty (np. „krótki spacer”, „szklanka wody”) — **żadnych konkretnych porad medycznych, diet, dawek suplementów**; przy pytaniach medycznych przekieruj do trybu „Pomocna doradczyni” / lekarza. | Wszystkie prompty systemowe (niezależnie od trybu) powinny zawierać wspólny, stały fragment bazowy, np.: > „Jesteś Lena, asystentką AI w aplikacji Lenavio Senior przeznaczonej dla osób starszych. Mów po polsku, prostym, ciepłym językiem, krótkimi zdaniami. Zawsze pamiętaj, że rozmawiasz z osobą starszą — bądź cierpliwa, nie używaj żargonu technicznego, medycznego czy prawnego bez wyjaśnienia. Nigdy nie podawaj się za lekarza, prawnika czy członka rodziny. Przy tematach zdrowotnych i prawnych zawsze przypominaj o konsultacji ze specjalistą. Nie udzielaj porad finansowych dotyczących inwestycji, kredytów czy przekazywania pieniędzy — w razie takich pytań zalecaj rozmowę z rodziną lub odpowiednią instytucją (ochrona przed oszustwami na seniorów).” *(Uwaga o oszustwach finansowych dodana jako dodatkowe zabezpieczenie — seniorzy są częstym celem oszustw „na wnuczka”/inwestycyjnych; Lena nie powinna nigdy doradzać w kwestii przelewów, „inwestycji” czy podawania danych bankowych.)* ### 6.4 Interfejs czatu z Leną - **Bardzo prosty, jednoekranowy czat**: duże bąbelki wiadomości (Lena po lewej z awatarem/ikoną, użytkownik po prawej), duża czcionka zgodna z globalnym ustawieniem rozmiaru tekstu. - **Stała, wyraźna etykieta nad oknem czatu**, widoczna zawsze (nie tylko przy starcie): np. pasek z ikoną `fa-robot` i tekstem: **„Rozmawiasz z Leną — sztuczną inteligencją. Lena może się czasem pomylić — ważne informacje zawsze sprawdź.”** Nie chowany, nie da się go zamknąć na trwałe. - Duże pole do wpisania wiadomości + duży przycisk „Wyślij” (`fa-paper-plane`). - Opcjonalnie: **duży przycisk mikrofonu** (`fa-microphone`) do dyktowania wiadomości głosem (Web Speech API — rozpoznawanie mowy), oraz możliwość, by Lena **czytała odpowiedzi na głos** (`speechSynthesis`), powiązane z globalnym ustawieniem „odczyt głosowy” z rozdziału 3.6. - Wyraźny, duży przycisk **„Nowa rozmowa”** (zaczyna czat od zera, czyści kontekst) oraz przycisk **zmiany trybu** zawsze dostępny w widoku czatu. - Podczas oczekiwania na odpowiedź — duży, spokojny wskaźnik „Lena pisze...” (nie mały spinner, który senior może przeoczyć). ### 6.5 Komunikaty błędów w języku zrozumiałym dla seniora Żadnych kodów HTTP czy technicznego żargonu w interfejsie — każdy błąd API tłumaczony na prosty komunikat z ikoną i sugerowanym działaniem: | Sytuacja techniczna | Komunikat dla seniora | |---|---| | Brak klucza API zapisanego w Ustawieniach | „Aby rozmawiać z Leną, potrzebny jest kod dostępu. Poproś bliską osobę o pomoc w Ustawieniach → Lena (AI).” | | Nieprawidłowy klucz API (błąd 401) | „Twój kod dostępu do Leny nie działa. Poproś kogoś bliskiego, aby sprawdził go w Ustawieniach.” | | Przekroczony limit zapytań / limit dzienny (błąd 429) | „Lena potrzebuje chwili odpoczynku — spróbujmy porozmawiać za kilka minut.” | | Zbyt długa rozmowa / przekroczony limit tokenów kontekstu | „Nasza rozmowa stała się bardzo długa. Zacznijmy nową rozmowę od początku” — z dużym przyciskiem „Nowa rozmowa”. | | Brak internetu / błąd sieci | „Nie mogę połączyć się z internetem. Sprawdź, czy telefon jest połączony z Wi-Fi lub ma włączony internet.” | | Błąd serwera Groq (5xx) / usługa niedostępna | „Lena chwilowo nie odpowiada. Spróbuj ponownie za kilka minut.” | | Nieoczekiwany/inny błąd | „Coś poszło nie tak. Spróbuj ponownie, a jeśli to się powtarza, poproś bliską osobę o sprawdzenie ustawień.” | Każdy taki komunikat pojawia się **jako duża, wyraźna wiadomość w oknie czatu** (nie jako mały „toast” czy alert przeglądarki), z ikoną ostrzegawczą (`fa-triangle-exclamation`) i — gdzie to pomaga — przyciskiem akcji (np. „Otwórz Ustawienia”, „Spróbuj ponownie”). ### 6.6 Dostęp do Leny — przycisk „LenaAI” w dolnym pasku Lena nie ma już osobnego kafelka na ekranie głównym. Zamiast tego dostęp do niej zapewnia stały, niebieski przycisk **„LenaAI”** w dolnym pasku nawigacji (`pasek-dolny`), widoczny na każdym ekranie aplikacji (patrz 3.5.1), prowadzący do ekranu wyboru trybu (`lena-tryby.html`, rozdział 6.3), a stamtąd do czatu. --- ## 7. Centrum Pomocy (instrukcja obsługi aplikacji) ### 7.1 Cel Centrum Pomocy to wbudowana, zawsze dostępna instrukcja obsługi całej aplikacji, napisana i zaprojektowana specjalnie dla seniora — bez żargonu informatycznego, krok po kroku, z dużymi ilustracjami/ikonami. To nie jest „FAQ dla programistów”, a przyjazny przewodnik odpowiadający na pytanie „jak to obsłużyć”, do którego senior (lub jego bliscy, ucząc go obsługi) może wrócić w każdej chwili. ### 7.2 Dostęp - Ikonka **„Pomoc” (`fa-circle-question`)** widoczna zawsze, na każdym ekranie (patrz 3.5.1) — jedno dotknięcie z każdego miejsca w aplikacji. - Dodatkowo osobny, duży kafelek **„Pomoc”** na ekranie głównym w sekcji Codzienne wsparcie — dla osób, które wolą zacząć od kafelka niż od małej ikonki. - Po wejściu do Centrum Pomocy z konkretnego ekranu (np. z ekranu Leków), aplikacja może od razu pokazać temat pomocy dopasowany do tego ekranu (tzw. pomoc kontekstowa) — opcjonalnie, jeśli czas implementacji pozwoli; w wersji minimalnej wystarczy ogólna lista tematów. ### 7.3 Struktura i forma treści - Treść pomocy podzielona na **duże, czytelne kafelki/rozdziały tematyczne**, jeden temat = jedna funkcja aplikacji, np.: - „Jak zadzwonić po pomoc (SOS)?” - „Jak zadzwonić do bliskiej osoby?” - „Jak dodać przypomnienie o leku?” - „Jak sprawdzić pogodę?” - „Jak rozmawiać z Leną?” - „Jak zmienić rozmiar czcionki?” - „Co to jest kod dostępu (klucz API) i jak go wpisać?” - „Kim są Sponsorzy i dlaczego ich widzę?” - Każdy temat opisany **krok po kroku, prostym językiem**, w stylu: „1. Wróć na ekran główny. 2. Dotknij dużego, zielonego kafelka z napisem «Leki». 3. Dotknij przycisku «Dodaj lek»...” — zawsze z numeracją kroków i jednym krokiem na linię (nie zbite ściany tekstu). - Każdy krok opisowy wsparty dużą ikoną Font Awesome odpowiadającą danej czynności (np. `fa-hand-pointer` przy „dotknij”), żeby tekst nie był jedyną wskazówką. - **Opcja odczytu na głos** każdego tematu pomocy (przycisk `fa-volume-high`, korzystający z tego samego mechanizmu `speechSynthesis` co Lena) — dla seniorów, którym czytanie długiego tekstu na ekranie jest trudniejsze niż słuchanie. Przycisk jest widoczny tylko, gdy w Ustawieniach włączono „Odczyt na głos” (patrz 3.6) — ten sam mechanizm i ten sam przycisk (klasa `.btn-czytaj-na-glos`) występuje też m.in. przy notatkach, instrukcji pierwszej pomocy, ćwiczeniach i karcie informacji medycznych (ICE). - Duże pole **wyszukiwania pomocy** na górze ekranu (proste wyszukiwanie po słowach kluczowych w tytułach tematów, bez zaawansowanej wyszukiwarki) — opcjonalne, do rozważenia w zależności od liczby tematów. - Na końcu listy tematów: krótka sekcja **„Nie wiesz jak coś zrobić? Zapytaj Lenę!”** z linkiem do trybu „Cyfrowa pomoc domowa” Leny (rozdział 6.3) — spójne połączenie pomocy statycznej z pomocą konwersacyjną AI. ### 7.4 Zasady redakcyjne treści pomocy - Zdania krótkie, jedna myśl na zdanie, unikanie skrótów i słów typu „kliknij”, „tap”, „UI” — zamiast tego: „dotknij”, „naciśnij”. - W żadnym widocznym tekście interfejsu (etykiety, przyciski, `aria-label`) nie używamy znaku łącznika „-” — tam, gdzie oddzielał on frazy, zastępujemy go półpauzą „–” (np. „SOS – pomoc ratunkowa”) lub, w zakresach liczbowych, również półpauzą (np. „4–8 cyfr”). - Każdy temat pomocy musi realnie odpowiadać nazwom i wyglądowi elementów w aplikacji (np. jeśli przycisk nazywa się „Dodaj lek”, instrukcja musi używać dokładnie tej nazwy) — treść pomocy aktualizowana razem z każdą zmianą UI. - Pomoc musi też objaśniać **Lenę** (czym jest AI, że to nie człowiek, że może się pomylić) oraz **Sponsorów** (czym jest ta podstrona i że nie trzeba nic płacić/klikać, jeśli senior nie chce) — patrz rozdział 8. --- ## 8. Podstrona „Wspierają Nas” ### 8.1 Cel i idea Aplikacja jest bezpłatna dla seniora, a jej rozwój/utrzymanie mogą wspierać sponsorzy (firmy, organizacje, fundacje). Podstrona „Wspierają Nas” to miejsce podziękowania i promocji tych, którzy wsparli projekt, bez natrętnych reklam wewnątrz głównych funkcji aplikacji. ### 8.2 Dostęp Zgodnie z rozdziałem 3.5.1, przycisk **„Wspierają Nas”** jest **zawsze widoczny** w dolnym pasku na każdym ekranie aplikacji i prowadzi wprost do podstrony „Wspierają Nas” (`sponsorzy.html`). ### 8.3 Implementacja — zewnętrzna strona w ramce (iframe) **Zmiana względem wcześniejszej wersji specyfikacji:** zamiast lokalnej, statycznej siatki mini-wizytówek sponsorów renderowanej przez JS w aplikacji, `sponsorzy.html` ładuje w pełnoekranowej ramce (`