Kritérium webového designu č. 40: FanExtra
Vítejte v naší 40. kritice designu! Každý týden se podíváme na nový web a analyzujeme jeho design. Poukážeme na obě oblasti, které jsou vedeny dobře, kromě těch, které by mohly použít nějakou práci. Nakonec budeme požádáni, abyste nám poskytli vlastní zpětnou vazbu.
Dnešní web je FanExtra, fantastický web pro designéry.
Prozkoumejte prvky Envato
Pokud chcete svůj web odeslat jako součást budoucí kritiky designu, trvá to jen několik minut. Za kritiku vašeho návrhu účtujeme 34 USD - podstatně méně, než kolik byste zaplatili konzultantovi, aby se podíval na vaše stránky! Více se dozvíte zde.
O společnosti FanExtra
"Všechno to začalo dlouhým letem před dvěma lety a vášní pro design." Poté, co jsem si užil některé z tutoriálů Photoshopu zveřejněných v té době, rozhodl jsem se napsat několik svých vlastních. Za tímto účelem jsem si vytvořil blog (PSDFAN.com) a začal jsem jej používat jako svůj kreativní výstup. Chtěl jsem nabídnout více pro naši rostoucí komunitu a být schopen vyvinout PSDFAN na něco většího. Nápad na FanExtra se brzy narodil! Síť FanExtra je místem, kde se mohou návrháři z celého světa setkávat a zkoumat své nápady a kreativitu. Můžete se zapojit do diskusí na našich fórech nebo opravdu dále rozvíjet své učení prostřednictvím našeho programu FanExtra. “
Zde je snímek obrazovky domovské stránky:
Počáteční dojem
FanExtra je jedním z nejzajímavějších případů Design Critique, které jsme dosud měli. Důvodem je to, že je to vlastně opravdu atraktivní stránka, ale ta, kterou bych doporučil, byla téměř úplně přepracovaná.
Každá sekce na stránce, od loga po miniatury, vypadá skvěle. Když však vezmete na stránku jako celek, kromě největšího problému, kterým je jasnost komunikace primární zprávy, se vyskytují skutečné problémy s tokem každé sekce.
Tento problém je zcela běžný a vzniká v důsledku velmi špinavého slova ve webovém designu: předpoklad. Zde je projektant pravděpodobně blízko projektu, a proto má přirozeně potíže vidět, že návštěvník nemusí rozumět tomu, co se děje. Předpokládá se, že návštěvník, který najde tuto stránku, bude vědět, co je „FanExtra“, což rozhodně není něco, co by se tu mělo předpokládat.
Sdělení
Při přistání na webové stránce instinktivně analyzujete oblast záhlaví stejným způsobem, jako byste analyzovali nabídku menu v restauraci rychlého občerstvení. Možné otázky zahrnují: Kde jsem? Co to stojí? Co mi dají za své peníze? Slouží produktům Koks nebo Pepsi? Dobře, možná tu poslední otázka neplatí.
Mám na mysli, že když se podíváte na záhlaví této stránky, adekvátně nereaguje na všechny tyto zásadní otázky:
Vidíme, jak se web nazývá (FanExtra), spolu s velkým polem pro nějaký druh registrace. Bude to znamenat, že jsem přihlášený do sítě? Takže je to bezplatná služba? Vpravo vidíme něco, co naznačuje „tutoriály“, které nás dostanou na správnou stopu, následovaná slovy jako „textury“ a „vektory“, které představují docela specifický žargon.
Pokud jsem designér, v tomto bodě jsem pravděpodobně přišel na to, co se do jisté míry děje, ale je to opravdu cíl tady? Měl by návštěvník najít vodítka a používat je k interpretaci toho, co je to stránka?
Tajemství je odhaleno
Když se dostaneme do středu webu, odhalí se záhada:
Nyní můžeme vidět, že FanExtra je „síť skvělých webů s tutoriály“ nabízejících členství za 9 $ měsíčně. Toto je nejdůležitější část komunikace na stránce, a přesto je zastrčená do poloviny stránky. To by měla být první věc, kterou uživatel uvidí.
Ve skutečnosti si myslím, že tato zpráva by mohla být ještě jasnější. Fráze „úžasné stránky s tutoriály“ je stále dost vágní, pokud o tom přemýšlíte z pohledu outsidera. Něco jako „úžasné stránky s tutoriály pro kreativní profesionály“ by toto prohlášení skutečně posunulo mnohem dále. Okamžitě jste zavěšili své cílové publikum přímo na nos, takže když najdu tuto stránku, uvidím pěkný vřelý pozdrav, který mě informuje, že tento web je speciálně pro lidi, jako jsem já.
Vizuální kontrast vs. vizuální nepořádek
Dalším problémem, který vidím u zpráv, je to, jak je strukturováno z vizuálního hlediska. Pojďme se podívat na primární komunikaci v současné podobě:
Zde vidíme hromadu tří řádků, z nichž každý používá odlišný barevný text a mírné variace stejného písma z hlediska tučnosti i velikosti. Dokážu a jsem napsal celé články o kontrastu v designu, ale k čemu se to scvrkává, je nejlépe řečeno v radě od autora návrhu Robina Williamse: „Nebuď wimp.“ Znamená to, že aby bylo možné efektivně využívat kontrast, musí prvky skutečně stát od sebe ve velkém odstupu, jinak je výsledkem jednoduše vizuální nepořádek.
Podívejte se, jak primární populární program členství v designu, Think Vitamin, strukturuje primární zprávu na jejich stránce.
Zde vidíme obrovský, masivně nadhodnocený kontrast mezi titulkem a podpoložkou. Výsledkem je krásná a jasná komunikace, která dokonale čte. Lidé, kteří procházejí stránku, si titulek přečtou téměř náhodou, a pokud se zajímají o další, mohou si čas přečíst podkapitolu.
Vlastnosti
Stránka končí masivní sadou odrážkových bodů, která běží po levé straně. To je docela nepříjemné využití prostoru a způsobuje nepříjemnou mezeru na pravé straně.
Rychlá oprava je jednoduše rozdělit odrážky do dvou samostatných hromádek:
Toto je nakonec pomoc kapela a já si myslím, že stránka by mohla skutečně použít nějakou významnou operaci. Krátce se toho budeme věnovat v následující sekci.
Moje doporučení „Big Picture“
Upřímně řečeno, nemyslím si, že neporušené nastavení dvou sloupců funguje pro tento web. Je příliš rigidní a ve skutečnosti naruší přirozený tok komunikace, než aby jej usnadnil, což je cílem strukturovaného uspořádání.
Mým doporučením je toto rozvržení úplně vyhodit. Nejprve příkop pevnou strukturu dvou sloupců. Dále přesuňte primární komunikaci do horní části stránky. Vytvořte velký „doporučený“ rámeček, který pokrývá celou šířku stránky a zvýrazňuje část obsahu, který později rozdělíte (140+ souborů, 40 vektorů atd.). Ujistěte se, že nadpis používá silný kontrast, křišťálově čisté formulace a cílení a maximálně dvě barvy, které spolu skvěle vypadají.
A konečně, poté, co jste vytvořili tuto úžasnou oblast záhlaví, která dokonale přiblíží to, co je web, pro koho je a základy toho, co obsahuje, pak se můžete zaměřit na uspořádání dalších informací pod nimi, případně ve formátu dvou nebo tří sloupců.
Tvůj tah!
Nyní, když jste si přečetli moje komentáře, zapojte se a pomozte tím, že poskytnete návrháři nějaké další rady. Dejte nám vědět, co si myslíte o designu skvěle a co si myslíte, že by mohlo být silnější. Jako vždy žádáme, abyste také respektovali návrháře webu a nabídli jasné konstruktivní rady, které zbaví jakékoli tvrdé urážky.
