Design systém a stavová knihovna

Červená má dvě role a nikdy se nepletou

Červená jako plocha = primární akce (Odeslat objednávku). Červená jako 2px lišta + ikona + text = chyba nebo blokace. Plocha nikdy nenese chybu, lišta nikdy nenese akci.

Stav = barva + ikona + text

Vždy všechny tři. Odznak bez ikony nebo bez slova neexistuje — v odlesku kuchyňského světla a při deuteranopii zbyde jen tvar a slovo.

Offline je provozní stav, ne chyba

Šedočerný pruh s šrafou, nikoli červený alert. Práce pokračuje, změny se řadí do fronty a počítají se viditelně.

48 px na dotyk, 32 px na klávesnici

Táž komponenta, dvě hustoty. Notebook smí být hustší, protože má kurzor a zkratky — ne proto, že se vejde víc dat.

Peníze, jednotky a stav nikdy neschovat

Cena za základní jednotku na 4 desetinná místa je hlavní porovnávací veličina — je vždy v řádku, nikdy v tooltipu ani v rozbalovátku.

Modál jen pro nevratné

Informace jdou inline nebo do toastu s možností vrátit akci. Nic nepřeruší rozpracovaný košík kvůli sdělení.

„Nelze porovnat" není chyba

Když systém nezná převod nebo mapování, přizná to neutrálně a položku nechá objednat. Červená je vyhrazená pro to, co blokuje odeslání — ne pro poctivé „tohle nehádám".

Archivo 800 / Archivo 400 — dva řezy, šest kroků

Čísla vždy font-variant-numeric: tabular-nums, aby se ceny ve sloupci daly srovnat okem. Pod 12 px se v systému nesází nic.

Spacing — 4px grid, 7 kroků

Radius, elevace, pohyb

radius 0 px všude. Pohyb: 120 ms stisk, 200 ms příchod panelu — nic delšího, nic s pružením. Starší Android tablet nesmí čekat na animaci.

Dotyk — mobil / tablet: 48 × 48, mezera 8

Kurzor — notebook: 32 px, táž komponenta

Popisek je vždy vlevo — oko ho hledá na stejném místě u všech šířek tlačítka.

Zakázané tlačítko bez důvodu v systému neexistuje. Důvod stojí pod tlačítkem, ne v tooltipu.

Krok = balení dodavatele (0,5 kg). Střed je editovatelné pole — na tabletu se dá psát i klikat. Hodnota a jednotka stojí pohromadě uprostřed, aby se číslo dalo přečíst i z ruky na pultu. Jednotka je součást komponenty, ne popisek nad ní.

Pořadí informací je pevné: co to je → od koho a v jakém balení → za kolik na jednotku → kolik beru → kolik to dělá. Cena za jednotku má vždy 4 desetinná místa (i s nulami — je to porovnávací veličina), cena za balení 2, množství nejvýš 3 bez koncových nul — a cena za jednotku je vždy bez dopravy, aby zůstala porovnatelná. Doprava, minima a cut-off vstupují až do optimalizace a do rekapitulace. Stav řádku nese výplň a odznak s ikonou.

Potvrzeno je očekávaná cesta — dodavatelé jsou zavedené HoReCa firmy a potvrzení zapisuje ops tým z e-mailu. Objednávka bez potvrzení není rovnocenná varianta, je to termín k dotažení. Osm stavů, žádný devátý. Naléhavost nese počítadlo v odznaku, ne další barva: „Částečně potvrzeno · 3 změny" je jiná situace než jedna změna ceny o 2 %. Přeskočení potvrzení (odesláno → dodáno) i storno nesou povinný důvod a v UI ustupují do pozadí — jsou to východiska, ne volby. U stornování je v odznaku vidět, že důvod existuje — rozklikne se na časovou osu s aktérem a časem.

Objednávka po předání čeká ve frontě ops konzole a je pořád koncept — restaurace o tom ví, práce uživatele skončila. Předání, offline fronta ani chyba odeslání nejsou stavy objednávky — mají proto jiný tvar (šrafa, odpočet, plná destička) a v seznamu stojí vedle stavu, nikdy místo něj.

Odznak má vždy tři nosiče významu: výplň, ikonu, slovo. Na 32 px vysoký odznak se vejde i nejdelší český popisek; při zúžení se láme text, nekrátí se slovem „…".

Frontu obsluhuje ops / support tým Hunters — trvale, ne jen v pilotu. Proto se navrhuje pro notebook 1280 px a pro člověka, který v ní stráví hodiny: hustota, zkratky, hromadné akce. Tablet je čtecí režim. Ops smí filtrovat a přepínat pohled, ne přepsat pořadí. Nad 50 položkách se skupiny 4 a 5 sbalí na počty; první tři zůstávají rozbalené. Automatická výjimka „bez potvrzení déle než 4 h" patří do skupiny 3 — je to hlídač termínu, ne omluva.

Restaurace nemá vlastní frontu úkolů. Dostane jen to, co vyžaduje její rozhodnutí, v kontextu objednávky — dvě tlačítka, obě s vyčísleným dopadem.

Výjimka není hlášení, je to rozcestí. Každé řešení má vyčíslený dopad na cenu.

Toast potvrzuje, že práce skončila, a nabízí jen pohled na výsledek — žádné okno na vrácení. Dokud je objednávka u ops týmu, dá se upravit přes ně; jakmile e-mail odejde, mění se to telefonem. Toast se drží 8 s a nikdy nezakrývá součet.

Šrafa je vyhrazená tomuto jednomu prvku — celoplošnému pruhu — aby se nepletl s toastem ani s inline hlášením; v odznacích se nepoužívá. Pruh sedí pod hlavičkou, nezakrývá obsah a nezmizí sám.

Dialog je jen pro to, co e-mailem nenávratně opustí systém — proto ho vidí ops při odesílání, ne restaurace při předání. Storno odeslané objednávky se v pilotu nestaví: dokud proces není dojednaný, UI nesmí předstírat zrušení, které se k dodavateli nedostane.

Žádné odvozování z názvu, žádná výchozí 1,0, žádné řetězení převodů. Bez potvrzeného koeficientu položka do optimalizace nevstoupí — zůstane objednatelná, jen neporovnaná.

První tři jsou neutrální stav, ne chyba, a vždy nechávají položku objednat. Poslední je jediná, která zakládá výjimku — položka se do optimalizace nepoužije potichu.

Podmínky zadává v pilotu procurement manažer, po MVP si je dodavatel nastaví sám. Je to jeden formulář ve dvou režimech — stejná struktura i pole, jen jiná míra doprovodného textu (interní: rychlost, self-service: vysvětlení). Ne dva různé formuláře.

Dvě úrovně čísel, které se nikdy nesmí smíchat: cena zboží u řádku (bez dopravy, porovnatelná) a celkem v rekapitulaci a na PDF (s dopravou a poplatky). Optimalizace košíku počítá s dopravou i minimy — práh dopravy zdarma umí obrátit vítěze.

Ikona nikdy bez slova. 64 px vysoké cíle, protože se maká palcem a naslepo.