UX a UI nie sú iba šifry. Odhaľte, čo všetko sa za nimi skrýva

UX a UI. Som presvedčená, že o týchto pojmoch ste už počuli, no možno neviete, čo presne znamenajú, ako fungujú a ako ich aplikovať na vašu webstránku.

Tieto dva pojmy sú často buď zamieňané, kombinované alebo spájané dohromady. Môže to byť aj preto, lebo sú v jednej, nazvime to “harmónii”. Poďme si na UX a UI posvietiť detailnejšie.

UX, teda User Experience a UI, ako User Interface, sú kľúčové elementy vo svete, v ktorom sa spája kretíva s technológiou. Inak povedané, ak sa spýtam na výrazy, ktoré sa vám spájajú s online marketingom, medzi odpoveďami by sme určite našli aj UX a UI. Medzi týmito výrazmi sú dva podstatné rozdiely. Tieto rozdiely sa prejavujú v ich rozsahu a pôsobnosti. Porozumenie UX a UI je kľúčom k vybudovaniu lepšieho produktu aj celkovej značky. No a to je to, čo by sme v tomto článku chceli odhaliť.

ketchup-ui-ux-design-example

Poďme na to pekne po poriadku.

Čo je to User Experience (UX)?

Podľa definície je UX: Budovanie spokojnosti a lojality zákazníkov prostredníctvom optimálneho rozvíjania použiteľnosti, pozitívnych emocionálnych reakcií a používateľských skúseností s vašimi webovými stránkami.

Preložené do bežnej reči, dokážu sa používatelia na vašej stránke jednoducho orientovať?  Komentujú používatelia váš obsah? Zdieľajú ho na sociálnych sieťach? To všetko sú otázky, ktoré sa UX bytostne dotýkajú.

Ak chcete vytvoriť dobrú používateľskú skúsenosť (UX), mali by ste predovšetkým:

  • Dobre poznať používateľskú základňu
  • Zladiť obchodné ciele s tým, čo chcú vaši zákazníci
  • Poznať podstatu a víziu vašej značky
  • Mať skúsenosti so správaním zákazníkov

Je dôležité uvedomiť si, že v tomto čase stačí používateľovi pár sekúnd na to, aby si uvedomil, či ostať na vašom webe naozaj stojí za to. V tomto prípade zohráva používateľ hlavnú úlohu a rozhoduje o úspechu alebo neúspechu vašej webstránky. Moja rada znie: Dajte svojej stránke “osobnosť”, s ktorou sa budú môcť používatelia stotožniť.

Pozitívna používateľská skúsenosť by mala zahrňovať:

  • Responzívny webdesign
    To by už malo byť dnes samozrejmosťou.
  • Vizualita
    Dobre si premyslite tiež rozloženie prvkov na stránke. Stránka má byť funkčná, prehľadná, ale aj dobre dizajnovo navrhnutá.
  • Relevantnosť
  • Pozitívna emocionálna odozva
  • Jednoduché pochopenie

Veľmi pekné príklady dokonalého UX a UI nájdete v článku 15 WordPress stránok, ktoré zmenili pohľad na dizajn. Inšpirujte sa.

Čo je to User Interface (UI)? 

UI alebo používateľské rozhranie predstavuje technické prvky, ktoré umožňujú používateľovi komunikovať s ovládacími prvkami, tlačidlami a ďalšími zobrazovacími prvkami. UI zahŕňa všetko od typografických prvkov, cez ikony až po rôzne iné interaktívne elementy.

Myslím, že teraz je vám už úplne jasné, prečo je UI tak dôležité a čo sa stane, ak niektoré zo spomenutých prvkov nebudú fungovať tak, ako majú. Pri UI sa zamerajte na to, aby vaša stránka bola čistá, intuitívna a efektívna.

Základné charakteristiky dobrého UI som zhrnula do pár bodov uvedených nižšie.

  • Konzistentnosť: Dizajn a správanie celej stránky by mali byť v súlade.
  • Intuitívnosť: Stránka by sa mala správať podľa očakávania používateľa a mal by ju vedieť ľahko intuitívne ovládať.
  • Citlivosť: Stránka by mala byť responzívna.
  • Čistota: Alebo elegancia a jednoduchý funkčný dizajn.
  • Efektivita: Tá je rovnako dôležitá ako dizajn. Stránka musí byť pre používateľa prehľadná a efektívna. Najmä, ak na nej mieni stráviť dlhší čas.
  • Obsah: Nezabúdajte na kvalitný a relevantný obsah.

Aké sú aktuálne trendy v UI?

Material dizajn:
Ak ste už počuli o Flat dizajne, tak material dizajn je niečo veľmi podobné. Je to druh flat dizajnu. Takýto dizajn využíva interakciu a vizuálny pohyb. Aktuálne je to najhorúcejší trend v dizajne webstránok.

freebie___branding_stationery_mockup_by_graphberry-d86yiys

Card layout:
Predstavuje jednoduchý a čistý look. Tiež veľmi obľúbený medzi dizajnérmi.

Micro – interaction:
Sú to malé, takmer neviditeľné interakcie, ktoré sú však veľmi dôležité. Príkladom takejto micro-interakcie je napríklad stlmenie telefónu alebo nastavenie budíka. Dobrým príkladom je ešte aj  známe tlačidlo “like” na Facebooku.

Aké sú možnosti?

Inšpirujte sa napríklad témou Twenty Fifteen. Je čistá, jednoduchá, intuitívna a samozrejme responzívna.

Snímka obrazovky 2015-11-05 o 14.12.02

Aké sú možnosti?
K pozitívnej používateľskej skúsenosti vám určite pomôže výber vhodnej témy.
Konkrétne príklady WordPress tém vám ale nepoviem. Každá stránka je jedinečná a aj UX a UI sa nedá nastaviť podľa nejakých tabuliek alebo štatistík. Možno vám pomôže, ak si skúsite odpovedať na to, či podporuje téma, ktorú ste si vybrali vaše ciele, alebo či vedie používateľa k tomu, čo chcete, aby na webe urobil. Používa téma jazyk, ktorému vaši používatelia rozumejú? Tieto otázky by vás mali naviesť k téme, ktorá bude pre vašu stránku najlepšia. 

Verím, že sa vám článok páčil a že máte zas o kúsok viac jasno v rozdieloch medzi UX a UI. Je jasné, že jedno na druhé nadväzuje a najlepší účinok bude mať správne prepojenie týchto dvoch elementov. Presný a jednoznačný návod na  spomenuté správne a dokonalé prepojenie asi neexistuje. Bude potrebné testovať, testovať a testovať.

Poznáte ešte nejaké svoje overené tipy, ako vylepšiť webstránku? Budem rada, ak sa s nimi podelíte v komentároch nižšie 🙂

The following two tabs change content below.

Patrícia Somorovská

Junior marketing a blogging at Webikon
Študentka marketingovej komunikácie sa okrem marketingu a copywritingu venuje aj maľovaniu a foteniu. Viac ako kino ju bavia galérie a cestovanie.

Pridaj komentár