UX

Jak by mohl vypadat Týden.cz?

Publikováno UX, Webdesign

Další web, který jsem si vzal na paškál je Týden.cz.

Vyměnil jsem logo za to, které používají v tištěné verzi, pouze s „.cz“ navíc. Sjednotí to tak identitu firmy.

Poupravil jsem strukturu, aby vzniklo více místa pro samotný obsah. V návrhu je nově vidět náhled druhého článku a nadpis třetího. (Při rozlišení 1366px na 768px.) Také jsem web mírně provzdušnil, aby na sebe vše nebylo tak natlačené.

Původní verze:
tyden_puvodni

Můj návrh:
tyden_1

Číst celé

Jak by mohl vypadat Bazoš.cz?

Publikováno UX, Webdesign

Už to asi můžete brát jako regulérní úchylku… :-D Ne, vážně, na některé weby se opravdu nedá koukat. Připravil jsem drobnou ukázku toho, jak by Bazoš mohl vypadat. Konkrétně tedy jeho homepage.

V krátkosti. Kategorie jsou v původní verzi poměrně nepřehledně rozdělené, vytvořil jsem tedy výraznější oddělení jednotlivých sekcí a celkově jsem tomu dodal takový kulatější a svěžejší ráz. Sekce by mohla mít jako celek hover efekt (naznačeno na první sekci) a být celá odkazem (ne jen obrázek a názvy kategorií), zlepší to uživatelskou přívětivost.

Logo v mé verzi chybí, protože to původní je dle mého celkem dost ošklivé a nahradil jsem ho prostým textem „Bazoš.cz“. Je ale otázka, nakolik je pro Bazoš stávající logo důležité a jak moc ho mají uživatelé vpité pod kůži.

Původní oranžovou jsem trochu zjemnil a dosadil do textury.

Původní verze stránek:
bazos_pred

Můj návrh:
bazos_4
Continue reading “Jak by mohl vypadat Bazoš.cz?” »

Číst celé

Jak by podle mě měla vypadat úvodní stránka Seznamu

Publikováno UX, Webdesign

Našel jsem si trochu času a zkusil navrhnout, jak by podle mě měla vypadat úvodní stránka Seznamu. Mě osobně se totiž vůbec nelíbí. Příliš barevná a spoustou věcí chce design upoutat pozornost.

Existují lidé, kteří chtějí používat Seznam pouze k vyhledávání na internetu, ne si tam číst Novinky, a další RSS zdroje, třeba já.

Můj nápad spočívá v tom, přidat na stránku prvek, který toto vše skryje a v budoucnu to danému uživateli ukáže pouze na jeho požadavek. A i když je vše ostatní zobrazené je to upozaděné šedou barvou, aby to tolik nekřičelo.

Pro nový vzhled jsem nepoužil nic, co by Seznam již neměl, kromě fontu Open Sans, který je v mém návrhu použit. Jako textura na pozadí je využita stejná jako má Seznam již třeba v novém vzhledu jeho freemailu. Na rozdíl od něj jsem ovšem zavrhl červené odkazy a font Oxygen, i když ten také není špatný a dal by se pro návrh použít také. Jako podklad tlačítka „Vyhledávat“ a „Přihlásit“ je použita barva stejná jako mají u nového vzhledu freemailu jednotlivé e-maily jako hover efekt.

seznam

seznam_2

Číst celé

Samostatný mobilní web

Publikováno UX

Tento článek je překladem druhé části originálního článku, jehož původním autorem je Christian Holst a který vyšel na SmashingMagazine.com. Tímto děkuji magazínu, že mi překlad umožnili.

Pokud by Vás napadlo, jak přeložit některá slova lépe, napište prosím do komentářů.


Michale Meininger se ptá:

„Co si myslíte o samostatném mobilním webu pomocí „browser sniffer“ technologie?“

Obecně platí, že čím složitější webové stránky jsou, tím je pravděpodobnější, že by měl být mobilní zážitek výrazně odlišnější od desktopové verze. Větší rozdíly mezi oběma verzemi je tedy silný argument pro to, mít samostatné mobilní webové stránky. Zachování obou koexistujících verzi stejných stránek sebou samozřejmě nese mnoho problémů, zejména pokud jde o údržbu (obsahu, kódu a designu).

Proto je lepším řešení v některých případech responzivní design, ale velmi závisí na velikosti a složitosti webových stránek, stejně jako na silných a slabých stránkách vaší organizace. Je to citlivý problém se spoustou šedých zón a s dobrými argumenty jak pro, tak proti samostatným mobilním stránkám.

Pojďme se podívat na konkrétní případ. Náš uživatelský průzkum ukazuje, že u mobilních elektronických obchodů zabíjí animace (slidery apod.) celou použitelnost stránek, kvůli nedostatečným hover stavů; proto je nikdy nepoužívejte pro vlastnosti stránek, události, navigaci atd. (Použijte jej pouze pro produkty.) Nicméně na plné (desktopové) verzi stránek mohou být na domovské stránce v pořádku, jestliže budou použity správně. A existuje mnoho dalších takových mobilně-specifických pokynů pro použitelnost.

toysrus-mcommerce-usability-test

Pokud toho můžete dosáhnout návrhem technikou „mobile-first“, pak responzivní desing může být skutečně skvělý – a to nejen z hlediska údržby, ale také z UX. Ale pouze škálováním existujících stránek na různá zařízení nebudou stačit ke skvělým mobilní zážitkům. Pokud máte velice složité stránky jako třeba e-shop a pokud není možné probrat se celou strukturou a obsahem existujících stránek, tak můžete být nucení k vytvoření samostatných mobilních stránek s cílem poskytnou slušný mobilní zážitek – i když udržovat obsah na dvou různých platformách paralelně by se mohlo ukázat jako drahé a chaotické. Takže, pokud máte jednoduchý blog, portfólio nebo malé firemní stránky, pak responzivní layout může být lepším řešením.

Nakonec, co je důležité, je to, že si vyberete řešení, které vám umožní vytvořit optimální mobilní zážitky právě z vašeho souboru omezení – vašich silných a slabých stránek organizace, složitosti webu a dostupných zdrojích pro udržování obsahu, kódu a designu.

Číst celé

Umístění registračního formuláře v průběhu objednávky

Publikováno UX

Tento článek je překladem první části originálního článku, jehož původním autorem je Christian Holst a který vyšel na SmashingMagazine.com. Tímto děkuji magazínu, že mi překlad umožnili.

Pokud by Vás napadlo, jak přeložit některá slova lépe, napište prosím do komentářů.


Sheri se ptá:

Pokud (e-shop) stránky umožňují objednávku bez registrace, kde je optimální místo pro umístění registračních polí (tím myslím pole pro heslo a nápovědu hesla)? Během objednávky (ze začátku nebo ke konci), nebo na obrazovce potvrzující objednávku?

Obvykle doporučujeme to druhou možnost: udělat nepovinné pole pro heslo a umístit ho na stránku, kde se potvrzuje objednávka (někdy též označovanou jako stránka „Děkujeme“).

crate-barrel-thank-you-page

Crate & Barrel umožňuje vytvořit účet na potvrzovací stránce, odstranili tím významné tření a frustraci z objednávkového procesu. V ideálním případě lze také vyjmenovat pár výhod spojených s vytvořením účtu.

Umístění registrace na objednávku potvrzující stránku odstraní hodně tření během objednávky, protože vytvoření účtu není jen otázkou vyplněním pole pro heslo. Spíše je to začátek komplexní myšlenky a rozhodovacího procesu pro zákazníka: „Jaké heslo mám zvolit“, „Věřím těmto stránkám?“, „Jak se bude nakládat s touto informací?“, „Uloží se také moje karta?“, „Bude mi to posílat hodně novinek emailem?“, „Chci zde účet?“, „Jak často zde budu nakupovat?“.

Síla nepovinných registračních formulářů v rozdílné pozici v průběhu objednávky bude odlišná web od webu v závislosti na tom, jak přirozené je pro zákazníka vlastnit účet s konkrétním typem stránek. Pokud je vlastnění účtu velmi integrovanou částí produktu, může mít v takovém případě umístění (stále nepovinného) registračního formuláře jako oddělené části v objednávkovém procesu větší smysl. Obecně ale vyjměte vytváření účtu z objednávkového procesu a zákazníka vyzvěte až po ukončení prodeje (na stránku potvrzující objednávku).

Číst celé