V rámci třetí Daily UI výzvy jsem měl navrhnout Landing page (nad zlomem) pro nějaký produkt, službu nebo cokoliv by mě napadlo.
Abych se přiznal, landing pages mi nikdy příliš nešly. Jsou hodně o detailech a ladění konverzních poměrů, což se od stolu dělá těžce. Nicméně jsem se do výzvy i přesto pustil a navrhl stránku pro fiktivní kurýrní službu.
Jsem víceméně spokojený
Pro řešení landing page jsem vymyslel kurýrní službu safecart, která staví na bezpečnosti a spolehlivosti přepravy. Tedy že:
- Nepoškodí balíčky.
- Vše doručí tak, jak slíbí.
Název jsem (očividně) zkombinoval ze dvou slov „safe“ (bezpečný) a „cart“ (vozík, kárka).
- Ve smyslu služby a primární hodnotě, na které staví, jsem vypíchl slovo safe, aby názvu více dominovalo, protože to je to zároveň primárně to, o co zákazníkům jde.
- Slovíčko „cart“ (vozík, kárka) jsem zvolil pro symboliku menšího přepravce a zároveň také jako náhradu delších názvů jako je například carrier.
Na primárních hodnotách jsem se také pokusil postavit textaci, tedy něco ve smyslu:
- Překvapte své přátele dárky, v jednom kuse – jsme spolehliví, po cestě nic nerozbije.
- V doplňujícím textu jsem vypíchnul 3 klíčová hesla, na kterých je služba postavená.
Chtěl jsem si to usnadnit
V rámci této výzvy jsem se zaměřil spíše na samotnou prezentaci než na různé kreativní koncepty. Jako hlavní principy jsem si tedy definoval jako klíčové:
- Jednoduchost.
- Vypíchnout zásadní hodnotu a proč to firma dělá, resp. proč se o to zajímat.
- Hezký a odlišující vizuální styl s využitím pár barev, resp. kontrastu.
- Snažit se odlišit od konkurence.
Zároveň jsem si rozepsal cíle stránky a možná témata, resp. produkty, pro které bych stránku navrhoval.
Snaha o jednoduché řešení
Pro kompozici stránky, tedy mřížku, jsem využil zlatý řez, stejně tak pro spacing a velikosti fontů. Chtěl jsem víceméně jednodné rozměry, aby se mi s případnou explorací možností lépe pracovalo.
Nad výběrem barev jsem trochu zapřemýšlel. Chtěl jsem, aby stránka působila trochu:
- Solidně,
- Důvěryhodně.
Proto jsem si pohrál s kombinací různých odstínů modré. Zároveň také ale můžeme najít pouze pár podobnách služeb, které využívají modrou barvu (na základě rešerše asi 20 kurýrních služeb).
Přemýšlel jsem ale také nad tím využít barvy, které se používají na přepravních kontejnerech. Nakonec jsem je nezvolil, protože:
- Dost z nich využívají další dopravci.
- Mému oku příliš nelahodily.
Ve Sketch jsem tedy s využitím stylů a symbolů vyzkoušel různé barevné kombinace, ze kterých jsem si poté vybral tu finální.
Zároveň jsem se ale nechtěl, aby stránka působila příliš „zkostnatěle“. Proto jsem:
- Použil písmo Source Sans Pro.
- Stránku doplnil o jednoduchou animaci jedoucího náklaďáku.
Animace měla symbolizovat, že balíčky jsou neustále v pohybu a nic se s nimi nestane. Přemýšlel jsem také nad tím, že by náklaďák mohl najet na kámen, vyskočit a „přistát“ aniž by se s balíčky cokoliv stalo. Ve výsledku mi to ale příšlo, že by to mohlo být příliš rozptylující a možná kontraproduktivní.
Protože šlo o návrh landing page s obsahem nad zlomem, umístil jsem pod hlavičku ještě text další sekce jako náznak, že níže najdou ještě něco dalšího.
Zároveň abych trochu narušil symetrii, hlavičku jsem od zbytku obsahu oddělit pootočeným obdelnikem, který může fungovat trochu jako vodící linka a pozornost táhnout směrem níže, tedy k dalšímu obsahu.
Bylo by co zlepšovat
Když se na návrh dívám zpětně, určitě bylo co zlepšovat. Přeci jen jsem návrhu věnoval přibližně jen 4 hodiny.
Sám jsem si všiml několik věcí. Například, že:
- Výzva k akci v podobě tlačítka se do celkové kompozice nehodí, možná kdybych zvolil jinou barvu. I jeho popisek je hůře čitelný.
- Možná bych otočil rozložení a věnoval více prostoru sdělení a méně doplňkové vizualizaci.
- Název bych musel zvolit jiný, protože služba s tímto názvem již existuje.
- Písmo mi přeci jen ke stránce příliš neladí, prozkoumal bych tedy více možností.
Zase jsem si vyzkoušel něco nového a trochu si pohrál s kompozicí, barvami a stylem. (K čemuž se v práci příliš často nedostanu.)
Poznámka: Budu moc rád, pokud mi do komentářů napíšete, co si o mém nápadu myslíte. Moc mi to pomůže v dalších výzvách. Díky moc 👍.
Ahoj, nevedel jsem, ze se venujes i UI;)
– animace je super, light…v cem jsi to delal?
– animace celou sluzbu dava do skupiny startup..jako eshopar nevim, jestli to tu za rok bude, ale taky kriteria vyberu dopravce jsou jiny
Ahoj, díky moc za komentář.
Ještě jednou díky za komentář.