Vzhľad a branding kiosku

Postup a nastavenia

Najprv si pozrite, ktoré časti vzhľadu môžete prispôsobiť a ako môže výsledok vyzerať. Čísla v modelových ilustráciách zodpovedajú krokom nižšie. Všetky možnosti sú voliteľné; zmeňte iba tie, ktoré potrebujete.

Vzhľad kiosku na šírku a na výšku

Rovnaký kiosk na šírku a na výšku. Ide o modelový príklad; počet aplikácií na ukážke nie je pevne predpísané rozloženie.

Ako sa skladá dlaždica

Výzva na dotyk obrazovky

Zelená znázorňuje aplikačnú vrstvu, modrá prezentačnú vrstvu a horná priehľadná plocha výzvu na dotyk. Farebné obrysy iba vysvetľujú usporiadanie; nie sú súčasťou nahrávaného podkladu. Nastavenie vlastnej výzvy opisuje krok 5.

Rozloženie s fotogalériou

Rozloženie s fotogalériou mení usporiadanie ponuky (3). Fotografie a ich orezávanie nastavíte v kroku 4. Zapnuté orezávanie vyplní plochu za cenu orezu okrajov; vypnuté zachová celý snímok a doplní rozostrené pozadie.

Globálne pozadie a text dialógu

11

Upozornenie pri nečinnosti

Aplikácia sa zatvorí.

Pokračovať

Reálne ukážky aplikačnej vrstvy (kiosku): vlastný vzhľad aj obsah

Ukážky zachytávajú skutočne používané aplikačné vrstvy – ponuky aplikácií, ktoré si používatelia prispôsobili vlastným logom, farbami a obsahom. Aplikačnú vrstvu možno používať na obrazovke na šírku aj na výšku.

1. Vyberte logo aplikačnej vrstvy. Vyberte obrázok loga z médií. Ak má logo splývať s farbou panela, použite súbor s priehľadným pozadím. Biely obdĺžnik uložený priamo v obrázku zmena farby panela neodstráni. Logo ani jeho farby sa automaticky nepremaľujú.
2. Zadajte nadpis ponuky. Zadajte nadpis, ktorý návštevník uvidí v ponuke kiosku, napríklad „Infocentrum“. Názov lokality v administrácii a nadpis ponuky sú dve rôzne polia.
3. Zvoľte rozloženie ponuky a veľkosť ikon.
   • Typ rozloženia aplikácií — Vyberte variant „S fotogalériou“ alebo „Bez fotogalérie“. Fotografie menia dostupný priestor a usporiadanie ponuky. Bez fotogalérie sa priestor používa pre aplikácie.
   • Veľkosť ikon aplikácií — Posuvník mení veľkosť obrázka vnútri dlaždice. Napríklad 60 % znamená zmenšenie obrázka voči jeho ploche; neznamená 60 % počtu aplikácií ani veľkosti celej dlaždice. Rozsah posuvníka je 0–100 %. Pri 0 % obrázok ikony nevidno.

   Veľkosť a usporiadanie samotných dlaždíc vyberá kiosk podľa počtu aplikácií, orientácie a zvoleného rozloženia. Zostavy 5 × 3 a 4 × 5 na ilustrácii sú príklady, nie nastavenie počtu stĺpcov. Pri jedinej dostupnej aplikácii môže zariadenie otvoriť priamo túto aplikáciu namiesto ponuky.

4. Pridajte fotografie a nastavte ich orezávanie.

   Fotografie pridávate a odstraňujete v samostatnej karte „Fotogaléria aplikačnej vrstvy“. Potom v Brandovaní zvoľte rozloženie „S fotogalériou“. Samotné nahranie fotografií nenahrádza voľbu rozloženia.

   • Orezávať médiá vo fotogalérii aplikačnej vrstvy — Zapnuté: fotografia vyplní pridelenú plochu; okraje sa môžu orezať. Vypnuté: fotografia sa zobrazí celá a zvyšnú plochu doplní rozostrené pozadie z rovnakej snímky.

   Táto galéria je súčasťou ponuky kiosku. Je odlišná od samostatnej aplikácie Fotogaléria a od obrázkov prehrávaných v kampaniach.

5. Nastavte výzvu na dotyk obrazovky.

   Prekryvný obrázok sa zobrazuje nad prezentačnou vrstvou a upozorňuje návštevníka na možnosť otvoriť dotykom aplikačnú vrstvu. Nejde o logo ani fotografiu v ponuke kiosku. Vyberte samostatný obrázok pre každú používanú orientáciu. Priehľadné časti ponechajú obsah pod obrázkom viditeľný.

   Samotná výzva na dotyk nenahrádza navigáciu vo webe. Ak používate aplikáciu Webová stránka bez systémových ovládacích prvkov, vývojár webu môže pridať vlastné tlačidlá na návrat do ponuky alebo k prehrávaniu kampaní. Príklad a technické pokyny nájdete v ovládanie vrstiev systému z vašej webovej stránky.
   • Horizontálna obrazovka: 16:9
   • Vertikálna obrazovka: 9:16
   • Vlastný podklad: pripravte transparentný obrázok v rozlíšení cieľovej obrazovky, osobitne pre používanú orientáciu na šírku a na výšku. Nahrajte ho a vyberte pri zodpovedajúcom nastavení prekryvného obrázka.
   • Grafika a umiestnenie: do súboru môžete vložiť ľubovoľnú ikonu alebo text na ľubovoľné miesto. Priehľadné časti ponechajú prehrávaný obsah viditeľný.
   • Význam prekryvu: ide o doplnok nad prezentačnou vrstvou, nie o tretiu samostatnú obsahovú vrstvu. Poloha nakreslenej ikony sama neurčuje dotykovú oblasť; prechod riadi nastavenie vrstiev a aplikácií.

   Použiť môžete aj pôvodné priehľadné PNG obrázky na stiahnutie nižšie. Nahrajte ich v brandingu lokality do poľa pre zodpovedajúcu orientáciu obrazovky. Šachovnica v náhľade znázorňuje priehľadnosť a nie je súčasťou súboru.

   Na šírku

   

   PNG · 2048 × 1152 px

   Stiahnuť PNG – Na šírku

   Na výšku

   

   PNG · 1152 × 2048 px

   Stiahnuť PNG – Na výšku

   V nasledujúcich krokoch 6–11 nastavíte farby jednotlivých častí kiosku. Každá skupina nastavení sa vzťahuje na konkrétny prvok, napríklad primárny panel alebo podklad ikon.

   Každá skupina obsahuje dve voľby: „Farba pozadia“ určuje podklad a „Farba textu a symbolov“ príslušné popredie. Začnite panelom a dlaždicami; po každej zmene overte čitateľnosť textov a ovládacích prvkov.

   Kliknite na farebný štvorček vedľa poľa. V otvorenom výbere myšou nastavte odtieň, jas a priehľadnosť a potvrďte tlačidlom OK. Ak poznáte presný kód firemnej farby, môžete ho zadať priamo do poľa.

   Zvoľte dostatočný kontrast. Tmavý text patrí na svetlý podklad a svetlý text na tmavý. Zmena farieb rozhrania nepremaľuje fotografie, videá, nahrané logá ani obsah cudzej webovej stránky.
6. Nastavte farby primárneho panelu. Panel s logom, nadpisom a hodinami: vľavo na šírku, hore na výšku.
   • Farba pozadia: Pozadie primárneho panela.
   • Farba textu a symbolov: Texty a symboly, ktoré používajú farbu primárneho panela.
7. Nastavte farby sekundárneho panelu. Obsahová časť ponuky: vpravo na šírku, pod primárnym panelom na výšku.
   • Farba pozadia: Pozadie sekundárneho panela; používa sa aj v ďalších obrazovkách aplikácií.
   • Farba textu a symbolov: Príslušné texty a symboly na tomto pozadí.
8. Nastavte podklad ikon aplikácií. Plocha pod obrázkom ikony aplikácie.
   • Farba pozadia: Podklad ikony, viditeľný najmä okolo menšieho alebo priehľadného obrázka.
   • Farba textu a symbolov: Táto farba sa používa vo vybraných ďalších prvkoch aplikácií. Nepremaľuje obrázok ikony v ponuke.
9. Nastavte pozadie tlačidiel a názvov aplikácií. Podklad názvu aplikácie a tlačidiel používajúcich túto farbu.
10. Nastavte farbu textu a symbolov tlačidiel a aplikácií. Text názvu aplikácie a príslušné ovládacie symboly.
11. Nastavte globálne pozadie aplikácie.

    Globálne pozadie sa používa napríklad v dialógu pred návratom pri nečinnosti a v niektorých aplikáciách vrátane USB prehrávača a Bludiska. Neurčuje hlavnú plochu ponuky s dlaždicami. Skontrolujte kontrast pozadia a textu; ak zmenu nepotrebujete, ponechajte predvolené hodnoty.

    • Farba pozadia: Farba plôch, ktoré túto skupinu používajú.
    • Farba textu a symbolov: Farba príslušných textov a symbolov, napríklad v upozornení na nečinnosť.

Po dokončení uložte zmeny. Server zaradí odoslanie aktualizovanej aplikačnej vrstvy zariadeniam v lokalite. Zariadenia musia byť pripojené a nové obrázky sa musia stiahnuť. Výsledok overte na zariadení priradenom k lokalite; samotné uloženie formulára doručenie nepotvrdzuje.