UX a UI nejsou jen šifry. Odhalte, co všechno se za nimi skrývá

UX a UI. Jsem přesvědčena, že o těchto pojmech jste již slyšeli, ale možná nevíte, co přesně znamenají, jak fungují a jak je aplikovat na vaši webstránku.

Tyto dva pojmy jsou často buď zaměňovány, kombinovány nebo spojovány dohromady. Může to být i proto, že jsou v jedné, nazvěme to „harmonii“. Pojďme si na UX a UI posvítit detailněji.

UX, tedy User Experience a UI, jako User Interface, jsou klíčové elementy ve světě, ve kterém se pojí kretiva s technologií. Jinak řečeno, pokud se zeptám na výrazy, které se vám pojí s online marketingem, mezi odpověďmi bychom určitě našli i UX a UI. Mezi těmito výrazy jsou dva podstatné rozdíly. Tyto rozdíly se projevují v jejich rozsahu a působnosti. Porozumění UX a UI je klíčem k vybudování lepšího produktu i celkové značky. No a to je to, co bychom v tomto článku chtěli odhalit.

ketchup-ui-ux-design-example

Pojďme na to pěkně po pořádku.

Co je User Experience (UX)?

Dle definice je UX: Budování spokojenosti a loajality zákazníků prostřednictvím optimálního rozvíjení použitelnosti, pozitivních emocionálních reakcí a uživatelských zkušeností s vašimi webovými stránkami.

Přeloženo do běžné řeči, dokáží se uživatelé na vaší stránce jednoduše orientovat? Komentují uživatelé váš obsah? Sdílejí ho na sociálních sítích? To všechno jsou otázky, které se UX bytostně dotýkají.

Chcete-li vytvořit dobrou uživatelskou zkušenost (UX), měli byste především:

  • Dobře znát uživatelskou základnu
  • Sladit obchodní cíle s tím, co chtějí vaši zákazníci
  • Znát podstatu a vizi vaší značky
  • Mít zkušenosti s chováním zákazníků

Je důležité uvědomit si, že v této době stačí uživateli pár vteřin k tomu, aby si uvědomil, zda zůstat na vašem webu opravdu stojí za to. V tomto případě hraje uživatel hlavní roli a rozhoduje o úspěchu nebo neúspěchu vaší webové stránky. Moje rada zní: Dejte své stránce „osobnost“, se kterou se budou moci uživatelé ztotožnit.

Pozitivní uživatelská zkušenost by měla zahrnovat:

  • Responzivní webdesign
    To by už mělo být dnes samozřejmostí.
  • Vizualita
    Dobře si promyslete také rozložení prvků na stránce. Stránka má být funkční, přehledná, ale také dobře designově navržená.
  • Relevance
  • Pozitivní emocionální odezva
  • Jednoduché pochopení

Velmi pěkné příklady dokonalého UX a UI naleznete v článku 15 WordPress stránek, které změnily pohled na design . Inspirujte se.

Co je User Interface (UI)?

UI nebo uživatelské rozhraní představuje technické prvky, které umožňují uživateli komunikovat s ovládacími prvky, tlačítky a dalšími zobrazovacími prvky. UI zahrnuje vše od typografických prvků, přes ikony až po různé jiné interaktivní elementy.

Myslím, že teď je vám již naprosto jasné, proč je UI tak důležité a co se stane, pokud některé ze zmíněných prvků nebudou fungovat tak, jak mají. U UI se zaměřte na to, aby vaše stránka byla čistá, intuitivní a efektivní.

Základní charakteristiky dobrého UI jsem shrnula do pár bodů uvedených níže.

  • Konzistentnost: Design a chování celé stránky by měly být v souladu.
  • Intuitivnost: Stránka by se měla chovat podle očekávání uživatele a měl by ji umět snadno intuitivně ovládat.
  • Citlivost: Stránka by měla být responzivní.
  • Čistota: Nebo elegance a jednoduchý funkční design.
  • Efektivita: Ta je stejně důležitá jako design. Stránka musí být pro uživatele přehledná a efektivní. Zejména, pokud na ní hodlá strávit delší dobu.
  • Obsah: Nezapomínejte na kvalitní a relevantní obsah.

Jaké jsou aktuální trendy v UI?

Material design:
Pokud jste již slyšeli o Flat designu, tak material design je něco velmi podobného. Je to druh flat designu. Takový design využívá interakci a vizuální pohyb. Aktuálně je to nejžhavější trend v designu webstránek.

freebie___branding_stationery_mockup_by_graphberry-d86yiys

Card layout:
Představuje snadný a čistý look. Také velmi oblíbený mezi designéry.

Micro – interaction:
Jsou to malé, téměř neviditelné interakce, které jsou ovšem velmi důležité. Příkladem takové micro-interakce je například ztlumení telefonu nebo nastavení budíku. Dobrým příkladem je ještě známé tlačítko „like“ na Facebooku.

Jaké jsou možnosti?

Inspirujte se například tématem Twenty Fifteen . Je čistá, jednoduchá, intuitivní a samozřejmě responzivní.

Snímka obrazovky 2015-11-05 o 14.12.02

Jaké jsou možnosti?
K pozitivní uživatelské zkušenosti vám jistě pomůže výběr vhodného tématu.
Konkrétní příklady WordPress témat vám ale neřeknu. Každá stránka je jedinečná a také UX a UI nelze nastavit podle nějakých tabulek nebo statistik. Možná vám pomůže, pokud si zkusíte odpovědět na to, zda podporuje téma, které jste si vybrali vaše cíle, nebo zda vede uživatele k tomu, co chcete, aby na webu udělal. Používá téma jazyk, kterému vaši uživatelé rozumějí? Tyto otázky by vás měly navést k tématu, které bude pro vaši stránku nejlepší.

Věřím, že se vám článek líbil a že máte zase o kousek více jasno v rozdílech mezi UX a UI. Je jasné, že jedno na druhé navazuje a nejlepší účinek bude mít správné propojení těchto dvou elementů. Přesný a jednoznačný návod na zmíněné správné a dokonalé propojení asi neexistuje. Bude třeba testovat, testovat a testovat.

Znáte ještě nějaké své ověřené tipy, jak vylepšit webovou stránku? Budu ráda, pokud se s nimi podělíte v komentářích níže 🙂

WordPress Návod v PDF

LEAVE A REPLY

Please enter your comment!
Please enter your name here