SEO

Rozdíl mezi UX a UI

Poslední aktualizace 01/12/2021

Sdílej...

Četba: 4 minuty

Ovál pro UX a UI
UX vs UI pro SEO web

Rozdíl mezi UX a UI | 2021

User experience design / User interface design

Rozdíl mezi UX a UI

UX a UI: Dva pojmy, které se často zaměňují. Ale ve skutečnosti se za těmito zkratkami skrývají dva naprosto odlišné pojmy. Jaký je tedy přesně rozdíl?

Domnívám se, že už někteří z vás někdy slyšeli o skvělém UX produktu, nebo špatném UI webové stránky. Měli jste pocit, že druhá strana hovoří v nějakých tajných šifrách.

Pokud se tedy chcete dozvědět, co přesně UX a UI znamenají a jak se liší, jste na správném místě a pokusím se vám problematiku popsat.

UX

UX je v první řadě způsob návrhu produktu.

  • UX je o celkovém dojmu
  • UX se vztahuje na vše, co lze zažít
  • Návrhář UX zvažuje celou cestu uživatele k vyřešení konkrétního problému
  • UX design NENÍ o vizuální stránce, ale zaměřuje se na celkový dojem ze zážitku.

UI

První přístup člověka k navrhování estetického zážitku z produktu

  • UI je o tom, jak rozhraní produktu vypadá a funguje
  • Cílem UI je vizuálně provést uživatele rozhraním produktu.
  • UI je čistě digitální a vizuální část, používá interaktivní prvky rozhraní produktu – včetně tlačítek, ikon, mezer, typografie, barevných schémat a responzivního designu.
  • UI přenáší silné stránky a vizuální aktiva značky do rozhraní produktu a zajišťuje, že je design konzistentní, koherentní a esteticky příjemný.

Ano, jsou to fráze, které vám teď nic neříkají. Pevně věřím, že až dočtete tuto stránku, budete lépe chápat tyto základní pojmy a lépe pochopíte souvislosti.

Více o user experience design

Více o user interface design

Co tedy UX a UI je?

# 1

Pěkně popořádku: Co vlastně znamená UX a UI? 

Seznamujeme se zde s obory, které navzdory tomu, že existují desítky let a teoreticky po staletí, byly definovány nyní technickým průmyslem jako UX a UI Design.

UX design odkazuje na termín „user experience design“, zatímco UI znamená „user interface design“. Pokud bychom to chtěli přeložit, tak řekněme, že UX je „uživatelské rozhraní“ a UI bychom mohli nazvat jako „uživatelský prožitek“.

Jen se ptám, proč to překládat? Budu dále používat zkratky, které jsou uvedeny v nadpisu a kdo máte potřebu o těchto oborech hovořit v přeložené, krkolomné formě, tak jak je libo.

Oba prvky jsou pro produkt zásadní a úzce spolupracují. Ale navzdory jejich vzájemnému vztahu jsou oba prvky samy o sobě zcela jiné a odkazují na velmi odlišné aspekty procesu vývoje produktu a disciplíny designu.

Než se zamyslíme nad klíčovými rozdíly mezi UX a UI, pojďme nejprve definovat, co každý termín znamená jednotlivě.

Připomenutí

UX je „User experience“, tedy “Uživatelský prožitek“.

UI je „User interface“, tedy  „Uživatelské rozhraní“.

Jaký je rozdíl mezi designem UX a UI?

# 2

Existuje analogie, kterou lze pro jednodušší popis použít k základnímu schématu všech částí (digitálního) produktu:

  • Pokud si produkt představíte jako lidské tělo, tak kosti představují kód, který mu dává základní strukturu.
  • Orgány potom představují podporu životních funkcí v podobě UX.
  • A UI rozhraní představuje kompletní lidské tělo, jeho vhled, jeho smysly a reakce.

UX a UI jsou jedny z nejvíce zmatených a zneužívaných pojmů v SEO. Každý z tohoto pojmu je určen na naprosto jinou část digitálního designu. Přitom ale jedno bez druhého se vlastně neobejde. Proto tento příměr k funkci lidského těla. Prostě je nutné pochopit, že UX a UI jdou spolu ruku v ruce, kdy není možné mít jedno bez druhého. K tomu, abyste byli návrhářem UX, však nemusíte mít dovednosti v oblasti UI a naopak. UX a UI tvoří samostatné role s oddělenými procesy a úkoly.

Můžeme to shrnou takto:

  • UX je o identifikaci a řešení uživatelských problémů; UI je o vytváření intuitivních, esteticky příjemných a interaktivních rozhraní.
  • UX je obvykle na prvním místě v procesu vývoje produktu, pak následuje UI. Návrhář UX mapuje základy uživatelské cesty; návrhář UI jej poté vyplní vizuálními a interaktivními prvky.
  • UX se může vztahovat na jakýkoli druh produktu, služby nebo zkušenosti, oproti tomu UI je specifické pro digitální produkty a zkušenosti.
Ilustrace UI a UX

Informace

Persona – Název je převzat z anglického shodného názvu Persona, někdy i Personas. Je to název osoby v marketingu, a i designu, zaměřené na uživatele, jako fiktivní postavy. Persona je vytvořená tak, aby reprezentovala typ uživatele, který může předdefinovaným způsobem používat web, aplikaci, službu, nebo produkt.

Jak UX design a UI design spolupracují

# 3

Popsali jsme si rozdíly mezi UX a UI, tak se nyní podívejme, jak spolu fungují. Možná se ptáte, jestli je jeden důležitější než druhý, ale realita je taková, že oba jsou zásadní. Jak vidíte, UX a UI jdou prostě pevně ruku v ruce a čím je jedno lepší, to druhé musí být také. UI je jako třešnička na dortu UX.

Představte si, že máte úžasný nápad na aplikaci, něco, co na trhu zjevně chybí a mohlo by skutečně změnit životy lidí k lepšímu. Najmete si designéra UX, který provede uživatelský průzkum a pomůže vám přesně zjistit, jaké funkce by vaše aplikace měla mít a jak by měla být zmapována celá cesta uživatele. Tedy aplikace nabídne něco, co vaše cílové publikum potřebuje a chce. No a když si aplikaci stáhnou, zjistí, že text na každé obrazovce je sotva čitelný (například žlutý text na bílém pozadí). Dále tlačítka jsou malá a příliš blízko u sebe. Takže stále omylem mačkáte nezvolenou funkci jiného tlačítka! Tedy to je klasický případ, kdy špatné UI ničí to, co by bylo dobré v UX.

Takže pokud jde o produktový design, UX a UI se vzájemně doplňují a na dnešním konkurenčním trhu je správná funkce a dokonalý design naprostou nutností. Ať už se rozhodnete pracovat jako návrhář UX nebo návrhář UI, je užitečné rozumět oběma částem tohoto designu.

Můžeme se setkat i s CX

CX je zákaznický prožitek z anglického Customer Experience. CX rozšiřuje vnímání UX o samotné interakce. Jsou to prožitky mimo digitální svět. Přitom se vše stále týká vztahu a poznání produktu, službě anebo Brandu. Je to například kontakt se zákaznickou podporou, rada od zástupce firmy, nebo přístup prodavače při řešení nedostatků. Je to propojení digitálního světa s tím reálným, jako že částí UX je zákaznická zkušenost.

Jak dělat UX

# 4

Nyní tedy víme, abstraktně, co role designéra UX obnáší. Jak se tato činnost promítne do každodenních úkolů? Zde je ukázkový příklad typických úkolů a povinností návrháře UX.

Strategie a obsah:

  • Analýza konkurentů
  • Zákaznická analýza a uživatelský průzkum
  • Struktura a strategie produktu
  • Vývoj obsahu

Projektování a prototypování:

  • Wireframing
  • Softwarové prototypování
  • Opakované testování
  • Plánování rozvoje

Informace

Wireframe webu se v oblasti vývoje webových prezentací či aplikací používá pro náhled nového řešení. Jde o návrh definující funkci a obsah stránek webu, pro lepší pochopení: WF = projektová dokumentace nového webu.

Příprava a analytika

  • Koordinace s návrháři UI
  • Koordinace s vývojáři
  • Sledování cílů a integrace
  • Opakovaná analýza

Tedy jste částečně obchodník, částečně designér, a částečný projektový manažer. Ano role UX je složitá, náročná a mnohostranná. Role UX designéra se ve skutečnosti velmi liší v závislosti na typu společnosti, pro kterou se aplikace, nebo web připravuje. Vidíte, že opakování spojená s analýzou nebo testováním je zmíněno dvakrát, ale ve skutečnosti byste opakované testování a analýzu nejspíše zařadili mezi každou další položkou v seznamu.

Jak dělat UI

# 5

Pokud se vám líbí myšlenka vytváření úžasných UI, a vidíte se jako osoba s tvůrčím talentem, možná vás bude více zajímat právě UI. Níže naleznete stručný přehled klíčových úkolů návrháře UI, a upřesnění toho, co návrhář uživatelského rozhraní skutečně dělá.

Vzhled a dojem z produktu:

  • Analýza zákazníků
  • Designový výzkum
  • Branding a grafický vývoj
  • Uživatelské příručky a příběhy

Responzivita a interaktivita:

  • Prototypování UI
  • Interaktivita a animace
  • Přizpůsobení všem velikostem zobrazovacích zařízení
  • Implementace s vývojářem

Jako vizuální a interaktivní designér je role UI zásadní pro jakékoli digitální rozhraní a pro zákazníky je klíčovým prvkem důvěry ke značce. Zatímco za značku samotnou nikdy není zodpovědný výhradně jen návrhář UI, jejím převodem do produktu ano.

Podívejte se na popis UX a UI v perfektním článku na webové adrese:

www.cojeuxui.cz

Podle mého je to skvelě vysvětleno.

KÓD = kostra

UX = orgány

UI = vzhled

Zde se můžete o článek podělit:

Facebook
Twitter
LinkedIn
WhatsApp
Email
Skype
Rozdíl mezi UX a UI linka na web
Bear-Hugs-webdesign