--- title: "Modul Odběrná místa – v zákaznickém portálu Moje SPP" description: "Implementace modulu Odběrná místa v zákaznickém portálu Moje SPP podle redesignu 2025 a designového systému interního týmu SPP – seznam míst, spotřeba, odečty, žádosti a smluvní údaje v jednom rozhraní." canonical: "https://interfase.sk/cz/reference/spp/portal" lang: "cz" --- # Modul Odběrná místa – v zákaznickém portálu Moje SPP > Implementace modulu Odběrná místa v zákaznickém portálu Moje SPP podle redesignu 2025 a designového systému interního týmu SPP – seznam míst, spotřeba, odečty, žádosti a smluvní údaje v jednom rozhraní. - Klient: SPP, a.s. - Rok: 2026 - Služby: Frontend vývoj, Web App, Implementace designu ## Zákazníci s více odběrnými místy – vlastní i sdílené adresy a smlouvy SPP je největší dodavatel energií na Slovensku a obsluhuje téměř 1,5 milionu zákazníků. Mnozí z nich nemají jedno odběrné místo: k domácnosti přibude chata, pronajatý byt nebo místo, které s nimi sdílí někdo z rodiny. Moje SPP je zákaznický portál, ve kterém si zákazník spravuje všechna svá odběrná místa – adresy a k nim přiřazené smlouvy na plyn a elektřinu. Redesign 2025 i komponentový designový systém připravil interní tým SPP. Naším zadáním bylo implementovat rozhraní modulu Odběrná místa podle designového systému SPP: proměnit hotové návrhy ve funkční, responzivní rozhraní, které se ve všech stavech a interakcích chová tak, jak bylo navrženo. ## Požadavky na modul – víc smluv, druhy odečtů a historie spotřeby Modul musí obsloužit zákazníka s jedním plynoměrem stejně dobře jako toho, kdo má víc míst, víc produktů a k tomu místa sdílená jinou osobou. - **Víc smluv, víc lidí, jedno místo**: Odběrné místo může mít plynovou i elektrickou smlouvu a může patřit zákazníkovi, nebo mu být jen sdílené. Rozhraní to musí ukázat na první pohled. - **Tři druhy odečtu**: Distribuční odečet, odhad a zákaznický odečet mají různý význam. Zákazník nesmí omylem nahlásit informativní údaj v domnění, že ovlivní fakturu. - **Spotřeba napříč roky**: Roky fyzických, odhadovaných i vlastních odečtů je třeba proměnit v jeden graf, který rychle řekne, jestli zákazník spotřeboval víc, nebo méně než loni. - **Přidání nového místa**: „Mám smlouvu, chci ji jen načíst“ a „chci novou smlouvu“ jsou dvě různé cesty. Obě musí jít začít ze stejného místa na dvě kliknutí. ## Princip Rozhraní jsme implementovali podle hotového designu SPP včetně všech stavů a interakcí, které návrhy definují. - **Všechny stavy z návrhů**: Prázdný seznam, sdílené místo, neuhrazená faktura, otevřený filtr i modální okno – každý stav z návrhů má v portálu svou funkční podobu. - **Komponenty designového systému**: Štítky, záložky, tabulky, formuláře a modální okna jsme implementovali jako opakovaně použitelné prvky se sdílenými barvami a typografií SPP. - **Stejné chování na každém zařízení**: Modul je responzivní, takže seznam, detail i formuláře odečtů fungují na počítači i v telefonu. ## Seznam a detail odběrného místa – pět záložek pro vlastní i sdílená místa Seznam seskupuje karty podle vlastníka smlouvy a zvlášť ukazuje místa, která se zákazníkem sdílí jiná osoba. Štítky PLYN a ELEKTRINA prozradí produkty dřív, než zákazník klikne. Detail rozděluje všechno, co k adrese patří, do pěti záložek. Sdílené místo ohlásí lišta nad hlavičkou, neuhrazenou fakturu přímo záložka Faktury. - Faktury, Spotřeba a odečty, Žádosti, Údaje zákazníka, Údaje odběrného místa - Žádosti s filtrem podle služby, stavem a tlačítkem pro novou žádost - Smluvní údaje, měřidlo a číslo POD u každého produktu ## Spotřeba a odečty – graf po letech a tabulka všech odečtů Sloupcový graf ukazuje spotřebu po letech pro zvolenou službu a smlouvu. Po najetí myší ukáže přesnou hodnotu a období, za které byla naměřena. Pod grafem je tabulka všech odečtů s datem, typem, hodnotou a tarifem. Vlastní odečet nese zákazníkovu poznámku a dá se smazat. - Filtr zdrojů: všechny odečty, odečty distribuce, moje odečty - Fyzický odečet, odečet odhadem a vlastní odečet odlišené v tabulce - Podrobný filtr a export odečtů ## Informativní odečet – oddělený od samoodečtu pro fakturaci „Můj odečet“ slouží jen k průběžnému sledování spotřeby a formulář to řekne hned v úvodu: není závazný pro fakturaci. Zákazník ho může přidávat v libovolných intervalech, s poznámkou, a později upravit nebo smazat. Samoodečet, který se do fakturace počítá, má vlastní tlačítko, vlastní formulář a vlastní cestu. ## Závazný odečet plynoměru – od upozornění po odeslání údaje Samoodečet je závazný údaj, proto ho portál připomene sám a formulář drží jen to, co je opravdu potřeba. 1. **Upozornění** – Karta místa vyzve zákazníka k samoodečtu plynu. 2. **Odběrné místo** – Formulář už ví, o kterou adresu jde. 3. **Stav plynoměru** – Hodnota v m³ a datum odečtu, obě povinné. 4. **Návod** – „Jak správně odečíst plynoměr?“ přímo u polí. 5. **Přidat samoodečet** – Údaj, se kterým počítá fakturace. ## Přidání odběrného místa – načtení existující smlouvy nebo žádost o novou Přidání otevře modální okno se dvěma jasně oddělenými možnostmi: načíst údaje z existující smlouvy, nebo vytvořit žádost o novou smlouvu se SPP. Když zákazník ještě nemá žádné odběrné místo, prázdný seznam mu nabídne tytéž dvě cesty hned na začátku. ## Ověření mobilního čísla – přiřazení míst, notifikace a přihlášení Přes ověřené mobilní číslo umí portál přiřadit zákazníkovi jeho odběrná místa, doručovat notifikace a umožnit přihlášení do účtu. Obrazovka to vysvětlí dřív, než si číslo vyžádá. - Odkaz „Proč potřebujete moje číslo?“ přímo u formuláře - Ověření SMS kódem, který jde poslat znovu nebo na jiné číslo - Krok jde odložit přes „Nastavit později“ ## Detail odběrného místa – spotřeba, žádosti, údaje zákazníka a měřidlo Spotřeba, žádosti, údaje zákazníka a smluvní údaje s měřidlem – záložky detailu v jednom vizuálním jazyce designového systému SPP. ## Implementace modulu Odběrná místa – podle designu a designového systému SPP Modul Odběrná místa dává zákazníkům SPP jeden vstupní bod do smluv, faktur, spotřeby a odečtů všech jejich adres – vlastních i sdílených. Design a designový systém jsou dílem interního týmu SPP; díky naší implementaci fungují v portálu se všemi stavy a interakcemi. ### Co jsme dodali - Implementace modulu Odběrná místa podle designového systému SPP - Detail odběrného místa s pěti záložkami - Přehled spotřeby a odečtů - Formuláře odečtů a přidání odběrného místa - Ověření mobilního čísla - Rozhraní pro počítač i telefon --- Webová verze: https://interfase.sk/cz/reference/spp/portal llms.txt: https://interfase.sk/llms.txt