Kritérium webového designu č. 43: Břišní svaly v práci
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í kritikou je Abdominals at Work, web aplikace iPhone.
Prozkoumejte zdroje návrhu
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 aplikaci Abdominals at Work
"Pasivní metoda izometrických kontrakcí." Pokud trávíte hodně času před počítačem nebo televizí, můžete použít tuto metodu k práci břišních svalů při provádění dalších úkolů. Vyberete si čas a místo a aplikace vás naučí, jak cvičit, diskrétním způsobem označí váš rytmus a intenzitu vibracemi nebo melodií. “
Zde je snímek obrazovky domovské stránky:
První dojem
Moje počáteční myšlenky na této stránce byly celkem pozitivní. Líbí se mi celkový vzhled webu a to, jak úzce odráží vzhled aplikace. Scéna s oblačnou oblohou pro mě rozhodně nenavrhuje cvičení, ale aplikace je něco o cvičení v uvolňujícím způsobu, takže se domnívám, že jsou všechny dobře propojeny.
Barvy a grafika jsou velmi přátelské a vytvářejí příjemné prostředí. Mým oblíbeným aspektem je, jak jednoduchý byl celkový obsah: pouze iPhone s několika snímky obrazovky, krátký popis, některé způsoby sdílení a výrazný odkaz na obchod iTunes, kde se můžete dozvědět více a stáhnout aplikaci. Stačí vás jen zajímat, aniž byste vás ohromili.
Přestože se mi líbí obecný směr aplikace, jako vždy mám spoustu návrhů na zlepšení. Podívejme se na některé konkrétní oblasti, abychom viděli, jaké pozitivní změny by mohly být provedeny.
Zvuk
Každý, kdo nám kdy podal žádost o kritiku designu pro web obsahující zvuk, dostane stejnou radu. Vždy dávám přednost tomu, aby vývojáři webů dávali návštěvníkům možnost přidat zvuk zpočátku, než aby je odebrali. Procházení webu je obvykle tichý zážitek a náhle hlasité zvuky nezpůsobí návštěvníkům nic jiného než rozzlobení.
Tento web nepochybně v této oblasti dělá mnohem lépe než většina ostatních. Ačkoli zvuk začíná automaticky, je to přinejmenším docela klidné a relaxační oceánské téma s ptáky a vlnami. Zvuk můžete také vypnout kliknutím na obrázek cvrlikání ptáka v dolní části stránky.
Mám o tom několik myšlenek. Nejprve jsem musel rolovat, abych to našel (i když jsem sice na malé obrazovce MacBook). Pokud někdo navštíví váš web v práci, v knihovně nebo na jiném veřejném místě, nechcete, aby se museli tahat, protože se trapně snaží najít způsob, jak jej vypnout. Myslíte si, že by uživatel stiskl tlačítko pro ztlumení zvuku, ale častěji jen pravděpodobně zavře okno co nejrychleji.
Dále mohu určitě vidět, jak pták s notami, které z toho vycházejí, navrhuje ovládání zvuku, ale nese to nešťastnou podobnost s odkazem na ptáka na Twitteru, který nyní vidíme téměř na každém webu na webu. Tím není okamžitě zřejmé, že pták je ovládán zvukem, protože neexistuje žádný text, který by posílil zprávu.
Zde je jednoduchá rada, pokud se budete držet zvuku automatického přehrávání, umístěte ovládací prvek do horní části stránky a vyjasněte si, co dělá. Navrhuji grafiku racka (pták Twitteru neodpovídá tématu oceánu) a zprávu „zvuk zapnout / vypnout“ poblíž ptáka. Také zastavte animaci hudebních not, když je web ztlumen, a spusťte, když je zvuk zapnutý, spíše než jen pokračujte po celou dobu.
Animace
Kromě zvuku má stránka několik plovoucích mraků, které driftují před a za obsahem. To přidává trochu zábavy na stránku a je jistě zajímavější než statická grafika.
Mraky z velké části nebrání použitelnosti, ale občas narušují čitelnost textu. Také, jako u každé smyčky animace, mohou se dostat trochu monotónní, pokud budete trávit tolik času, jak jsem zíral na místě! Jedním solidním nápadem, který jsme viděli na našem modelu ToonyTuts Critique, byl jednoduchý kontrolní systém se dvěma ikonami pro zastavení hudby nebo animovaných mraků. Téma webu bylo velmi podobné dnešnímu webu, takže si myslím, že podobná kontrola by zde fungovala dokonale.
Zprávy a text
Myslím, že web odvádí dobrou práci, když jasně ukazuje, že diskutujeme o břišních cvičeních. Pro takovou zábavnou stránku by to však mohlo být trochu technické. Zvažte hlavní nadpis „Pasivní metoda izometrické kontrakce“. Je to hezké a vznešené, ale ve skutečnosti to nemá přátelský prsten, že?
Nemusíte tuto zprávu kopat, ale možná byste ji měli zahrnout do odstavce ve prospěch zajímavějšího nadpisu, jako je „Sestavte šest balíčků, zatímco sledujete televizi!“ To v žádném případě není nejlepším příkladem, ale dostává se do jádra mého návrhu. Titulek, jako je tento, vás vtáhne a vy se budete chtít učit více než vás vypnout, protože se cítíte hloupě a nemáte svého tezauru.
Asi největším problémem, který mám na celé stránce, je žlutý text na modrém pozadí. Tyto dvě barvy se s malým textem střetávají velmi dlouho a tyto informace jsou velmi obtížně čitelné.
Problémem je klasický konflikt vs. doplněk v teorii barev. Když dvě barvy prostě nejsou dostatečně odlišné, mají sklon ke vzájemnému konfliktu, zejména když je jedna umístěna nad druhou. Vezměme si níže uvedený příklad a o kolik lépe čitelnější je světlejší a méně nasycený žlutý text než verze, která mu předchází.
Nyní si uvědomuji, že to ve skutečnosti jsou barvy vaší aplikace, takže není logické je měnit na webu. Navrhuji proto jednoduše zrušit žlutý důraz na text a použít něco jiného, tučné písmo, podtržení atd., Které nenarušuje čitelnost.
iPhone
Grafika pro iPhone s prezentací je velmi populární pro weby aplikací pro iPhone az dobrého důvodu. Díky tomu je okamžitě jasné, o čem je celý web. Myslím si však, že by to mohlo být trochu vylepšeno.
Pro začátečníky mají malé tečky, které slouží jako navigace v prezentaci, vedle nich rotující nakládací kruh. Tato malá animace se nikdy nezastaví, tak k čemu slouží? Když to vidím, jak se točí, naznačuje to, že se stránka nedokončila načítání (bylo nás učeno, že to znamená to, co tato grafika znamená), a když se nikdy nedokončí načítání, bude to mít pocit, že je váš web rozbitý. Sečteno a podtrženo, tato grafika je rušivá, matoucí a nemá žádný praktický účel, odstraňte ji.
Také jako malá nepříjemnost si Apple Geek ve mně nemůže pomoci, ale všimne si, že obrázek iPhone je zastaralý. IPhone 5 je téměř na nás a tento web ještě nemá grafiku iPhone 4. Vím, že je směšné to držet krok, ale protože web je ve skutečnosti pro aplikaci pro iPhone, může to být důležité. Díky zastaralým snímkům se aplikace sama cítí stará a zastaralá, což mě nutí myslet dvakrát před zakoupením!
Navigace
Poslední myšlenka na tuto stránku je, že navigace se skutečně jeví jako dodatečná myšlenka. Obsahuje odkazy, které mění textový obsah na stránce s informacemi relevantními pro návštěvníky, ale z nějakého důvodu je to malé a skryté v zápatí.
Pokud by to bylo opravdu něco menšího, nevadilo by mi to, ale ve skutečnosti se zdá důležitější než návrhář, kterému to připisovalo uznání. Jednoduchým řešením je hodit jej na typické místo v samém horním rohu stránky a text trochu zvětšit.
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.
