S15 — Podpora / Kontakt
Účel obrazovky
Základní kontaktní informace a formulář pro podporu. MVP verze obsahuje telefon, email, provozní dobu a kontaktní formulář. FAQ a chat s agentem přijdou v F1.
Content Priority
- Kontaktní informace — telefon (tap-to-call), email (tap-to-compose), provozní doba List Item
- Kontaktní formulář — předmět, popis problému, příloha (volitelná), email pro odpověď (předvyplněno pokud přihlášen), CTA „Odeslat" Text InputPrimary Button
- Mapa kanceláře — volitelná, pokud má podpora fyzickou pobočku Map View
- Placeholder „FAQ" — text „Již brzy" (F1) List Item
- Placeholder „Chat s agentem" — text „Již brzy" (F1) List Item
Interakce
| Trigger | Akce | Cíl |
|---|---|---|
| Tap na telefon | Otevření dialeru | Volání na podporu |
| Tap na email | Otevření mail klienta | Nová zpráva na podporu |
| Tap „Přidat přílohu" | Výběr fotky ze zařízení | Natívní image picker (galerie / fotoaparát) |
| Tap „Odeslat" | Odeslání formuláře | API call → success stav |
| Změna pole | Validace | Předmět a popis povinné, email předvyplněn při přihlášení |
Stavy
| Stav | Popis | Vizuální chování |
|---|---|---|
| Default | Formulář prázdný nebo částečně předvyplněný | Pole dostupná |
| Submitting | Odesílání probíhá | Loading na CTA, formulář disabled |
| Success | Zpráva odeslána | „Vaši zprávu jsme přijali, odpovíme do 24 hodin" + CTA „Zpět" nebo „Nová zpráva" |
| Error | Odeslání selhalo | Toast „Nepodařilo se odeslat. Zkuste to znovu." + retry |
Edge Cases a Error States
| Scénář | Řešení |
|---|---|
| Dlouhý text zprávy | Limit např. 2000 znaků, character count, nebo bez limitu ( server-side handling) |
| Příloha příliš velká | Limit 10 MB — při překročení toast „Soubor je příliš velký. Max 10 MB." |
| Offline odeslání | Fronta zpráv — uložit lokálně, odeslat při obnovení připojení + indikace „Pošleme, až budete online" |
| Nepřihlášený uživatel | Email pole prázdné, povinné pro odpověď |
| Prázdný předmět nebo popis | Inline validace, CTA disabled dokud nevyplněno |
Mobilní patterny a odlišení od webu
Tap-to-call jako primární akce
- Na mobilu je volání častější než na webu — telefon prominentně, velké touch target
- Web: Telefon jako text nebo malý odkaz
- Mobil: Tlačítko „Zavolat" s ikonou, tap-to-call
Natívní výběr přílohy
- Web: File input (vybrat soubor)
- Mobil: Natívní image picker — galerie + fotoaparát, předvybraný formát (jpg, png)
- Haptic při výběru fotky
Formulář a klávesnice
- Email předvyplněn při přihlášení — méně psaní
- Předmět jako dropdown („Problém s objednávkou", „Technický problém", „Návrh", „Jiné") — rychlejší výběr na mobilu
Reference
Screen Podpora/Kontakt nemá specifické screenshoty z webu ani CineStar — v MVP jde o jednoduchý kontaktní formulář s praktickými informacemi. Referenční implementace budou dostupné v průběhu návrhu.