Vzhled a branding kiosku

Postup a nastavení

Nejprve si prohlédněte, které části vzhledu můžete přizpůsobit a jak může výsledek vypadat. Čísla v modelových ilustracích odpovídají krokům níže. Všechny možnosti jsou volitelné; změňte pouze ty, které potřebujete.

Vzhled kiosku na šířku a na výšku

Stejný kiosk na šířku a na výšku. Jde o modelový příklad; počet aplikací na ukázce není pevně předepsané rozložení.

Jak se skládá dlaždice

Výzva k dotyku obrazovky

Zelená znázorňuje aplikační vrstvu, modrá prezentační vrstvu a horní průhledná plocha výzvu k dotyku. Barevné obrysy pouze vysvětlují uspořádání; nejsou součástí nahrávaného podkladu. Nastavení vlastní výzvy popisuje krok 5.

Rozložení s fotogalerií

Rozložení s fotogalerií mění uspořádání nabídky (3). Fotografie a jejich ořezávání nastavíte v kroku 4. Zapnuté ořezávání vyplní plochu za cenu ořezu okrajů; vypnuté zachová celý snímek a doplní rozostřené pozadí.

Globální pozadí a text dialogu

11

Upozornění při nečinnosti

Aplikace se zavře.

Pokračovat

Reálné ukázky aplikační vrstvy (kiosku): vlastní vzhled i obsah

Ukázky zachycují skutečně používané aplikační vrstvy – nabídky aplikací, které si uživatelé přizpůsobili vlastním logem, barvami a obsahem. Aplikační vrstvu lze používat na obrazovce na šířku i na výšku.

1. Vyberte logo aplikační vrstvy. Vyberte obrázek loga z médií. Má-li logo splývat s barvou panelu, použijte soubor s průhledným pozadím. Bílý obdélník uložený přímo v obrázku změna barvy panelu neodstraní. Logo ani jeho barvy se automaticky nepřebarvují.
2. Zadejte nadpis nabídky. Zadejte nadpis, který návštěvník uvidí v nabídce kiosku, například „Infocentrum“. Název lokality v administraci a nadpis nabídky jsou dvě různá pole.
3. Zvolte rozložení nabídky a velikost ikon.
   • Typ rozložení aplikací — Vyberte variantu „S fotogalerií“ nebo „Bez fotogalerie“. Fotografie mění dostupný prostor a uspořádání nabídky. Bez fotogalerie se prostor používá pro aplikace.
   • Velikost ikon aplikací — Posuvník mění velikost obrázku uvnitř dlaždice. Například 60 % znamená zmenšení obrázku vůči jeho ploše; neznamená 60 % počtu aplikací ani velikosti celé dlaždice. Rozsah posuvníku je 0–100 %. Při 0 % není obrázek ikony vidět.

   Velikost a uspořádání samotných dlaždic vybírá kiosk podle počtu aplikací, orientace a zvoleného rozložení. Sestavy 5 × 3 a 4 × 5 na ilustraci jsou příklady, nikoli nastavení počtu sloupců. Při jediné dostupné aplikaci může zařízení otevřít přímo tuto aplikaci místo nabídky.

4. Přidejte fotografie a nastavte jejich ořezávání.

   Fotografie přidáváte a odstraňujete v samostatné kartě „Fotogalerie aplikační vrstvy“. Potom v Brandování zvolte rozložení „S fotogalerií“. Samotné nahrání fotografií nenahrazuje volbu rozložení.

   • Ořezávat média ve fotogalerii aplikační vrstvy — Zapnuto: fotografie vyplní přidělenou plochu; okraje se mohou oříznout. Vypnuto: fotografie se zobrazí celá a zbývající plochu doplní rozostřené pozadí ze stejného snímku.

   Tato galerie je součástí nabídky kiosku. Je odlišná od samostatné aplikace Fotogalerie a od obrázků přehrávaných v kampaních.

5. Nastavte výzvu k dotyku obrazovky.

   Překryvný obrázek se zobrazuje nad prezentační vrstvou a upozorňuje návštěvníka na možnost otevřít dotykem aplikační vrstvu. Nejde o logo ani fotografii v nabídce kiosku. Vyberte samostatný obrázek pro každou používanou orientaci. Průhledné části ponechají obsah pod obrázkem viditelný.

   Samotná výzva k dotyku nenahrazuje navigaci uvnitř webu. Pokud používáte aplikaci Webová stránka bez systémových ovládacích prvků, může vývojář webu přidat vlastní tlačítka pro návrat do nabídky nebo k přehrávání kampaní. Příklad a technické pokyny najdete v ovládání vrstev systému z vaší webové stránky.
   • Horizontální obrazovka: 16:9
   • Vertikální obrazovka: 9:16
   • Vlastní podklad: připravte transparentní obrázek v rozlišení cílové obrazovky, samostatně pro používanou orientaci na šířku a na výšku. Nahrajte jej a vyberte u odpovídajícího nastavení překryvného obrázku.
   • Grafika a umístění: do souboru můžete vložit libovolnou ikonu nebo text na libovolné místo. Průhledné části ponechají přehrávaný obsah viditelný.
   • Co překryv znamená: jde o doplněk nad prezentační vrstvou, nikoli třetí samostatnou obsahovou vrstvu. Poloha nakreslené ikony sama neurčuje dotykovou oblast; přechod řídí nastavení vrstev a aplikací.

   Použít můžete také původní průhledné PNG obrázky ke stažení níže. Nahrajte je v brandingu lokality do pole pro odpovídající orientaci obrazovky. Šachovnice v náhledu znázorňuje průhlednost a není součástí souboru.

   Na šířku

   

   PNG · 2048 × 1152 px

   Stáhnout PNG – Na šířku

   Na výšku

   

   PNG · 1152 × 2048 px

   Stáhnout PNG – Na výšku

   V následujících krocích 6–11 nastavíte barvy jednotlivých částí kiosku. Každá skupina nastavení se vztahuje k určitému prvku, například primárnímu panelu nebo podkladu ikon.

   Každá skupina obsahuje dvě volby: „Barva pozadí“ určuje podklad a „Barva textu a symbolů“ příslušné popředí. Začněte panelem a dlaždicemi; po každé změně ověřte čitelnost textů a ovládacích prvků.

   Klikněte na barevný čtvereček vedle pole. V otevřeném výběru myší nastavte odstín, jas a průhlednost a potvrďte tlačítkem OK. Pokud znáte přesný kód firemní barvy, můžete jej zadat přímo do pole.

   Zvolte dostatečný kontrast. Tmavý text patří na světlý podklad a světlý text na tmavý. Změna barev rozhraní nepřebarvuje fotografie, videa, nahraná loga ani obsah cizí webové stránky.
6. Nastavte barvy primárního panelu. Panel s logem, nadpisem a hodinami: vlevo na šířku, nahoře na výšku.
   • Barva pozadí: Pozadí primárního panelu.
   • Barva textu a symbolů: Texty a symboly, které používají barvu primárního panelu.
7. Nastavte barvy sekundárního panelu. Obsahová část nabídky: vpravo na šířku, pod primárním panelem na výšku.
   • Barva pozadí: Pozadí sekundárního panelu; používá se také v dalších obrazovkách aplikací.
   • Barva textu a symbolů: Příslušné texty a symboly na tomto pozadí.
8. Nastavte podklad ikon aplikací. Plocha pod obrázkem ikony aplikace.
   • Barva pozadí: Podklad ikony, viditelný zejména kolem menšího nebo průhledného obrázku.
   • Barva textu a symbolů: Tato barva se používá ve vybraných dalších prvcích aplikací. Nepřebarvuje obrázek ikony v nabídce.
9. Nastavte pozadí tlačítek a názvů aplikací. Podklad názvu aplikace a tlačítek používajících tuto barvu.
10. Nastavte barvu textu a symbolů tlačítek a aplikací. Text názvu aplikace a příslušné ovládací symboly.
11. Nastavte globální pozadí aplikace.

    Globální pozadí se používá například v dialogu před návratem při nečinnosti a v některých aplikacích, včetně USB přehrávače a Bludiště. Neurčuje hlavní plochu nabídky s dlaždicemi. Zkontrolujte kontrast pozadí a textu; pokud změnu nepotřebujete, ponechte výchozí hodnoty.

    • Barva pozadí: Barva ploch, které tuto skupinu používají.
    • Barva textu a symbolů: Barva příslušných textů a symbolů, například v upozornění na nečinnost.

Po dokončení uložte změny. Server zařadí odeslání aktualizované aplikační vrstvy zařízením v lokalitě. Zařízení musí být připojené a nové obrázky se musí stáhnout. Výsledek ověřte na zařízení přiřazeném k lokalitě; samotné uložení formuláře doručení nepotvrzuje.