Zpět na blog
Ostatní

Jaký je vlastně rozdíl mezi UI a UX při designu digitálních produktů?

Ľudovít Nastišin
07.07.2021
6 minut čtení
Jaký je vlastně rozdíl mezi UI a UX při designu digitálních produktů?
Pokud jde o designovou stránku digitálních produktů, často se setkáváme s výrazy „Poživatelská zkušenost (UX)“ a „Uživatelské rozhraní (UI)“. I když jsou oba pojmy dost známé, tak není výjimkou, že lidé v designu digitálních produktů (i mimo něj) používají tyto pojmy jako synonyma, případně je uvádějí nesprávně. V tomto článku se na to trošku podíváme.

UI: Jak to vypadá 

Při designování uživatelského rozhraní (User Interface) se věnujeme tomu, jak budou vypadat například jednotlivé screeny. Bavíme se zde tedy zejména o jejich grafice, o kreativu. Když si to zjednodušíme, tak UI řeší to, co vidíme našim okem. Jsou to použity obrázky, barvy, aplikované animace přechodů či efektů a takto bychom mohli pokračovat.

Dobře zpracované UI by mělo splňovat několik obecných zásad:
  • Musí to být jasné. Všechny prvky UI jsou něco jako vizuální metafory. Musí být pro ně okamžitě srozumitelné. Pokud musí uživatel uvažovat nad tím, co daný element dělá, někde je chyba.
  • Musí to být známo. UI by mělo umožnit uživatelům využít jejich dřívější zkušenosti z jiných interakcí, které s daným produktem měly a tak jim budou i ty ostatní funkce minimálně povědomé.
  • Musí to být konzistentní. Když je UI zpracováno konzistentně napříč všemi produkty či jejich stránkami, tak si uživatel začne rychle všímat vzorců používání a osvojí si je.
  • Musí to být efektivní. Dobré UI umožňuje uživatelům dosáhnout při minimálním vstupu požadovaného výstupu. Zde řadíme například i zkratky pro zkušené uživatele, díky nimž bude jejich interakce produktivnější. Jednou takovou je i Ctrl+C/V.

UI je tedy prostor, ve kterém se dějí všechny interakce mezi člověkem a strojem. Díky němu můžeš efektivně ovládat zařízení pro plnění potřebných úkolů. Vlastně i nyní při čtení tohoto článku vnímáš UI zpracování našeho webu.

UX: Jak to funguje

Když se bavíme o uživatelské zkušenosti (User Experience), tak máme na mysli celou logiku toho, jak to funguje na pozadí. Řekněme, že děláme mobilní aplikaci. UX se postará o to, aby se v ní její uživatel uměl intuitivně orientovat a práce s ní mu nezpůsobovala bolesti hlavy. Všechny kroky musí mít svou logiku. Objeví se nejprve obrazovka s registrací a teprve potom tě apka pustí dovnitř, nebo si ji můžeš hned vyzkoušet a pokyn k registraci se objeví až potom? Obě varianty poskytnou jinou uživatelskou zkušenost bez ohledu na to, jaký animační přechod (UI) se při ťukání zobrazuje nebo jakým fontem jsou prezentovány texty.

 Při práci na UX bys měl věnovat spoustu času testování použitelnosti daného řešení, nezaškodí ani uživatelský průzkum. Teprve poté má smysl začít průběžně implementovat jednotlivé aspekty UI, kterými jsou design layoutu, vizuální zpracování či branding. Obě profese řeší něco jiného, ​​ale musí fungovat v tandemu. Neexistuje žádná jasně stanovená čára, kdy končí práce na UX a jdeme řešit UI.

UX zahrnuje všechny aspekty interakce koncového uživatele se společností, jejími službami a produkty.

Už ty samotné zkratky UX a UI implikují, že jsou tyto dvě disciplíny propojeny i když je jejich podstatou něco jiného. Něco, co vypadá skvěle, ale těžko se používá, je příkladem skvělého UI a špatného UX. Na druhé straně zase něco super použitelného, ​​co vypadá hrozně, je příkladem skvělého UX a špatného UI. “

Hezky to sumarizuje tento obrázek:

Proč jsou UX a UI často nabízeny jako jedna pozice?

Už jsme si řekli, že UX a UI jsou dvě samostatné oblasti, takže by tě nyní mohlo zajímat: proč je tolik pracovních nabídek, které hledají designéry UX/UI v jednom?

Pravdou je, že z širšího úhlu pohledu jsou UX a UI stále relativně novými oblastmi a jak již bylo zmíněno, mají tendenci být specifické pro technologický průmysl. Mimo svět designu a technologií jim mnozí až tak nerozumí, i když jsou pro byznys velmi důležité.

Není to však vždy jen o nepochopení lidí z jiné branže. Mnoho společností cíleně hledá všestranné designéry, kteří dokáží zastat UX i UI, nebo kteří mají kromě svých hlavních skillů alespoň dostatečnou úroveň poznání UX nebo UI principů.

Ať už tedy hledáš pozici pouze pro UI, výlučně pro UX nebo kombinaci obou, je důležité podívat se na pracovní pozici s nadhledem a věnovat zvláštní pozornost uvedeným schopnostem, úkolům a zodpovědnostem. Je třeba rychle zjistit, zda je pracovní nabídka skutečně zaměřena na jedno nebo druhé, nebo je cíleně formulována na oba. V každém případě si to ale vyžádá jiný skillset.

Stále si neumíš vybrat to správné pro sebe? Zkus to s tímto obrázkem:
Takže ještě jednou na závěr, UI – design uživatelského rozhraní není totéž jako UX – design uživatelské zkušenosti.
Ľudovít Nastišin
Som digitálny kreatívec (problem solver), ktorého špecializácia je "kreatívny kitbash". Táto profesia neexistovala, dokým som si ju nevymyslel, pretože práve to ma vystihuje najviac. Ide o schopnsoť  kombinovať digitálne skilly (3D, 2D, animácia, VFX, generative AI, ilustrácie,...) s cieľom vytvoriť čo je treba a to bez ohľadu na zadanie. 

Klienti, s ktorými som pracoval:
  • Deutsche Telekom IT Solutions Slovakia,
  • Východoslovenská distribučná, a.s.,
  • Nefkus Creative House,
  • EMEFKA & Startitup Group,
  • Promiseo,
  • Letisko Košice,
  • Boataround,
  • DMS Records 
  • ...a ďalší


Mohlo by tě zajímat

Krátký pohled na cenotvorbu pro kreativce
Ostatní
18.05.2021
Ľudovít Nastišin

Krátký pohled na cenotvorbu pro kreativce

Naceňování své práce je velmi háklivé téma? Otázky typu: Ptám si dost? Nepřestřelil jsem to? Pokud prodáváš zboží nebo nějakou jasně specifikovanou službu, většinou to až tak náročné není. Všechno prostě má svou cenovku. Kreativci však do této kategorie spadají jen málokdy. Existuje několik přístupů k tomu, pokud stanovit cenu svých kreativních služeb. A když se k této (často nepříjemné) součásti podnikání nepostavíš zodpovědně, tak tě to postupně vysaje. Nikdo ti nedá jednoduchý checklist cen, tady je třeba číst mezi řádky a do rovnice započítat i takové věci, které ty méně zkušené možná ani nenapadnou. Řekněme si tedy pár věcí, které je třeba při naceňování kreativní práce brát v úvahu.[Image] Opatrně s naceňováním podle odpracovaných hodinZačínající kreativci často neumí správně odhadnout čas, který jim daný projekt pravděpodobně zabere. Takové něco chce čas a párkrát se popálit, když klientovy řekneš 10 hodin, ale odsedíš na tom dvakrát tolik. Hodinovka má smysl tehdy, jak už ze začátku spolupráce není jasný rozsah projektu. V takovém případě víš, že dostaneš zaplaceno za to, co jsi při projektu proseděl. V ostatních případech je ale třeba počítat s nevýhodami hodinovky: • Pokud to uděláš rychleji, dostaneš zaplaceno méně. Jen se nad tím zamysli, jak je to nelogické. V podstatě jsi „trestán“ za to, že jsi efektivní. • Při hodinovce jsi placený za čas. Tvá expertiza a kreativita v podstatě jdou stranou. • Často zde může trpět kvalita práce, protože se příliš soustředíš na čas a na to, abys neprošvihl dohodnutý rozsah. • A pokud ti to zabere více hodin, jsi to právě ty kdo musí dokazovat jejich oprávněnost. Ukažme si to na příkladu designu loga. Pokud přijedeš se skvělým designem za 15 minut, tak by podle této logiky mělo stát méně? Určitě ne. A naopak, pokud na tom budeš pracovat dva týdny, mělo by stát víc? Stejně ne. Hodinovka tě tedy většinou potrestá za to, že pracuješ rychleji, a namísto odborných znalostí podporuje smýšlení klienta, že „čas jsou peníze“. Při jednom velkém projektu se světoznámého designéra log Paula Randa zeptali, kdy bude logo hotovo. Jeho odpověď byla jasná: Možná týden, možná rok. Teprve když to bude ono, tehdy je to hotovo. A to si za svoji práci účtuje i 6 nul. Stanovuje cenu podle klienta, ne podle zadáníPři hodnotě kreativní práce opravdu záleží také na velikosti klienta, pro kterého to děláš. Když si Phil Knight, zakladatel Nike, dal udělat logo, zaplatil za něj jen pár desítek dolarů. Pokud by si to samé logo dali dělat dnes, stálo by to miliony. A proč? Neboť v sázce je toho mnohem víc. Samotný proces tvorby loga by nebyl náročnější. Ale společnost Nike v začátcích a dnes nejsou stejný klient. Pokud by designér udělal chybu u začínajícího podniku, který ještě mnoho lidí nezná, tak se to jednoduše opraví a hotovo. Pokud to ale Nike vytiskne na miliony triček, bot, krabic, tak nese designér velkou zodpovědnost za to, že je práce udělána dobře. Ve výsledné ceně je tedy třeba zohlednit i to, pro koho danou kreativu děláš. Tento přístup podrobněji popisuje i designér Chris Do ve své pořednášce, kterou ti určitě doporučuji vidět.
Jmenuji se Umělá Inteligence a dokážu už toto...
Ostatní
30.04.2021
Skillmea

Jmenuji se Umělá Inteligence a dokážu už toto...

Mám silné tušení, že málokdo z nás v posledních měsících unikl nějaké té novince ze světa umělé inteligence. Aktuální celosvětový pandemický vývoj je akcelerátorem již tak slušně rozjetého technologického pokroku. Noha na plynu, světlo světa hledí jeden nový objev za druhým. S každým dalším pokrokem směrem k super-inteligentním robotům se stávají stále palčivějšími otázky spojené s etikou, humanitou či právem. Na jedné straně nadšení z obrovského potenciálu, na straně druhé zděšení z možných dopadů na budoucnost lidstva. Vzpomínáme na scény z Terminátora či Westworldu a přemýšlíme, jak dlouho bude trvat, než se humanoidi přesunou z obrazovek do našeho skutečného světa. Asi to, chválabohu, ještě nějaký čas potrvá, takže stále máme jako lidstvo čas vymyslet, jak odvrátit Hawkingova katastrofická proroctví.[Image] Hlavní zbraní člověka v boji se strachem z nepoznaného je vzdělání. Pochopit, jak dané věci fungují, nám často skvěle pomáhá odhadnout vyplývající rizika. A protože čtete příspěvek na tomto blogu, vsadil bych se, že patříte k lidem, kteří se rádi vzdělávají. Nedávno jsme vypustili na Learn2Code kurz o deep learningu: (https://skillmea.cz/kurzy/python-deep-learning-pro-zacátečníky). Deep learning, jako specifická větev strojového učení, je spojen s umělou inteligencí. Přesněji řečeno, umělá inteligence (zkráceně AI z anglického Artificial Intelligence) obsahuje několik podoborů a jedním z nich je i deep learning. Ten právě díky svým specifikům dosahuje zajímavých úspěchů při práci s nestrukturovanými daty, jakými jsou reprezentace obrazu, textu či zvuku. Pokud tedy filozofujeme o humanoidech, kteří jsou k nerozeznání od lidí, budou si muset umět poradit právě v disciplínách, se kterými my, běžní smrtelníci, nemáme problém. Tedy s mluvením, viděním, čtením, poslechem atp. Pokud jste viděli kultovní film Blade Runner, určitě se vám vybaví Voigh-Kampffův test, pomocí kterého odlišovali lidi od replikantů. Abyste takový test vůbec mohli absolvovat, musíte být schopni komunikovat. Větev AI, která pomáhá počítačům rozumět, interpretovat a používat lidský jazyk, se označuje jako Natural Language Processing, zkráceně NLP. Posun v této oblasti je za poslední dekádu obrovský, k čemuž přispěl velkou měrou právě deep learning.[Image]Zdroj: https://monkeylearn.com/ Abychom si demonstrovali, jak daleko už věda v této oblasti je, rád bych se s vámi podělil o zajímavou novinku, která vyplula na povrch právě z těchto hlubin. Možná jste zachytili zprávu o experimentální sérii povídek, kterou napsala pro Český rozhlas umělá inteligence. Pokud ne, více se o tomto netradičním pokusu s názvem „Digitální spisovatel“ dočtete na stránkách https://www.mujrozhlas.cz/digitalni-spisovatel, kde si můžete povídky také poslechnout. Při produkci povídek byl použit prediktivní jazykový model GPT-3, tedy v pořadí již třetí generace Generative Pre-trained Transformera, který používá deep learning k tvorbě textů přibližujících se kvalitou k lidskému standardu. Tento model z dílny společnosti OpenAI způsobil před pár měsíci po otevření beta verze značný vzruch v odborných vodách. Kvalita výstupů modelu je skutečně v některých případech impozantní, a to nejen při použití v umělecké činnosti podobné výše uvedeným povídkám. Rešerše textů, chatbot, hledání faktografických odpovědí, vymýšlení nadpisů, či dokonce doplňování programátorského kódu, s tím vším si nový model velmi slušně poradí. Tak slušně, že se vám v hlavě chtě nechtě začnou vynořovat otázky z úvodu tohoto příspěvku. A napsal tyto řádky vůbec člověk? Kdo ví... Pokud vás tedy témata spojená s umělou inteligencí zajímají a chtěli byste pochopit úplné základy, na kterých deep learning principiálně funguje, mrkněte na nový kurz, ve kterém si společně na praktickém příkladu natrénujeme jednoduchý model pro konkrétní techniku ​​z NLP – analýzu sentimentu. Doufám, že váš osobní sentiment zůstal po přečtení předchozích řádků pozitivní. Buďte i nadále především zdraví a zvědaví! Autorem článku je Matej Veverka
Nejpopulárnější kurzy a články v roce 2020
Ostatní
04.01.2021
Skillmea

Nejpopulárnější kurzy a články v roce 2020

V roce 2020 jsme na našem webu zveřejnili více než 45 nových online kurzů. V tomto článku ti přinášíme přehled nejpopulárnějších a nejlépe hodnocených kurzů roku 2020 a také nejčtenější články z blogu. Pojďme na to. Nejpopulárnější kurzy roku 2020V roce 2020 byl největší zájem o online kurz tvorby webstránek Webrebel 1. V tomto kurzu se naučíš technologie HTML, CSS a JavaScript, přitom responzivní design, jak funguje server, hosting, domény a všechny důležité pojmy spojené s tvorbou webů. Kurz Webrebel 1 doporučujeme každému zájemci, který chce začít s tvorbou webstránek a programováním. 1. Webrebel 1: HTML, CSS & JavaScript 🥇 2. Java pro začátečníky 🥈 3. Základy programování a OOP 🥉 4. Webrebel 2: PHP 5. SQL databázy: MySQL a SQLite 6. Python pro začátečníky 7. JavaScript a ES6 8. Microsoft Excel 9. Visual Design Digital: Photoshop 10. Social Media Marketing Nejlépe hodnocené online kurzy roku 2020V rámci tohoto žebříčku jsme vzali v úvahu jen kurzy, které měly 10 a více hodnocení, jinak by byl žebříček mnohem delší. Online kurz Základy programování a OOP hodnotilo v roce 2020 více než 35 jeho absolventů a všichni mu udělili maximálních 5 hvězdiček. O něco méně hodnocení, ale také jen těch nejvyšších měli online kurzy React, Angular, Vue (a TypeScript) a Branding - budování úspěšné značky. 1. Základy programování a OOP 🥇 2. React Angular Vue (a TypeScript) 🥈 3. Branding - budování úspěšné značky 🥉 4. Git a GitHub základy 5. Microsoft Excel 6. SQL databázy: MySQL a SQLite 7. JavaScript a ES6 8. Úspěšný content marketing 9. Client management 10. Pokročilé SEO strategie Nejčtenější blogy v roce 2020V tomto seznamu jsou články, které vás v roce 2020 zajímaly nejvíce. 1. Vyzkoušej si Learn2Code na měsíc zdarma 🥇 2. Co je nového v Bootstrap 5 🥈 3. Známé weby, které používají WordPress 🥉 4. Success story: Michaela vyměnila administrativu za frontend 5. Eratostenovo sito

Nezmeškej info o nových kurzech a speciálních nabídkách