Jak se dělá design, který prodává?

2FRESH
10 min readFeb 4, 2020

--

“Žijeme v době, kdy se věcí dotýkáme a mluvíme na ně. A věci se dotýkají nás.” Jarin Němeček je dvorní 2FRESH designér a součást naší UI divize. V oblasti designu a především interface designování má u nás největší zkušenosti a s výsledky jeho práce se setkáváte denně, aniž byste o tom věděli. Přečtěte si, jak se dívá na design procesy a kde vidí budoucnost designu.

To, jak se věci ovládají a jak vypadají, vytváří uživateli zážitek, který rozhoduje o tom, jestli budou lidé vaši aplikaci nejen stahovat, ale především používat. Dobrý design systém může klientům ušetřit opakované náklady do něčeho, co už funguje.

Jarine, jak dlouho se věnuješ designu a proč jsi vůbec začal?
Já jsem začal s designem spíš jako programátor. Dělal jsem design interface a dokázal jsem napsat pár řádků kódu. Ve 14 jsme dělali první počítačovou hru, která se prodávala. V té době jsem nejenom programoval, ale taky jsem ve Photoshopu dělal grafiku té hry.

Co tě na designu nejvíc baví a co tě štve?
Nejvíce mě baví, že můžu věci zhmotnit, a že můžu vytvářet produkt, udělat něco fyzického. Když něco nadesignuju, tak něco vznikne. Funkční věc, která se lidem líbí, kterou lidi mají rádi, dobře se jim používá a ideálně ji používá hodně lidí. To se mi na designu líbí.

A nejvíc mě štve, že do designu může mluvit teoreticky každý. Rozhodovat podle toho, jestli se ti to líbí nebo nelíbí, je nebezpečné a každému se líbí něco jiného. Je skvělé si poslechnout názory lidí, protože pro ně to děláš, ale když přijde nějaký macho z velké společnosti, který nemá kontext a nebyl u těch věcí od začátku, tak ti jedním máchnutím smázne spoustu práce a energie. Takže pokud do toho někdo vlítne z pozice síly, rozbije to, poruší ten základní předpoklad věcí, za kterými je logický závěr, tak je to špatně, a to mě štve.

Častokrát od tebe slýchávám pojem Design systém. Našel jsem spousty definic o tom, co to znamená. Co je Design systém podle tebe?
Pro mě je Design systém živoucí organismus, který se neustále vyvíjí. Soubor co možná nejjednodušších a dobře popsaných pravidel, jak se jednotlivé prvky tvého produktu nebo brandu chovají. Je to soubor ukázek a funkčních elementů, které můžu skládat dohromady, a na jejich základě stavět další produkty, aplikace, weby a landing page, které pořád komunikuji vůči uživateli stejně.

Design systém jasně definuje pravidla, jak má co vypadat, jak se ty věci mají chovat, jak interagovat.

Vím, že máš s Design systémem bohaté zkušenosti. Jak jej můžu využít ve své organizaci a proč bych ho měl chtít?
Dříve existoval logo manuál. Byla to ukázka jak používat a nepoužívat logo. Barvy, písmo, ukázky použití. Ale v dnešní době digitálních produktů musíš stanovit pravidla pro své digitální produkty. Dobrá ukázka je Google. Mají hromady webových aplikací, svůj vlastní operační systém, které používají telefony všech různých značek a spousty dalších produktů, které jsou postaveny na jednom designovém systému. Tento Google Material Design jasně definuje pravidla, jak má co vypadat, jak se ty věci mají chovat, jak interagovat. Díky těmto pravidlům můžeš pak stavět další aplikace a produkty, které vypadají vizuálně podobně a chovají se podobně tak, jak jsou uživatelé zvyklí. Představ si velkou firmu, která má skladový systém, systém na správu objednávek, zákazníků, webové rozhraní, mobilní aplikaci a x dalších platforem. A pokud každý z těch systémů vypadá jinak a jinak se ovládá, tak to je pro lidi strašný zmatek, protože se musí naučit hromadu principů používání, což stojí v konečném důsledku tu firmu čas a peníze.

Televizní UI, základní typografie, ikony a hlavní UI elementy

Design systém je primárně určený pro firmy, které chtějí mít sladěné všechny svoje digitální produkty.

Takže je spíše určený pro firmy, které mají hromadu webů, landing pages, aplikací… prostě spousty interaktivních věcí?
Ano, Design systém je primárně určený pro firmy, které chtějí mít sladěné všechny svoje digitální produkty. Je ale potřeba si uvědomit, že tento Design systém jsi schopen využívat ve své komunikaci na sociálních sítích, v tisku… Je to jako onlinový brandmanuál, který nepopisuje jenom to, jak firma vypadá, jak mluví, jak používá ilustrace nebo jak pracuje s fotkama, ale taky v něm najdeš, jak se designují aplikace, weby, newslettery, prostě vše, co ta firma digitálně produkuje, a zachováváš tím tak kontinuitu. V dnešní době je to mnohem komplexnější věc než nějaké PDFko. Firmy by měly usilovat o to, aby měly jedno místo, kde si designér může sáhnout a nedělat věci znovu a pořád dokola. Je potřeba využívat, co už existuje, nějak vypadá a funguje. Firma si musí udržet konzistenci své značky a svého charakteru napříč všemi platformami.

Ukázka design systému O2 One UI, který jsme navrhli pro největšího českého operátora

Jasný, chápu. Pro někoho, kdo má jenom web, to není. Je to tedy primárně pro velké firmy, které mají hromadu digitálních věcí.
Jojo, pokud jsi kavárna a potřebuješ jenom webík a k tomu Facebook a Instagram, tak nepotřebuješ Design systém. I když vlastně logomanuál je taky takový malý Design systém. Protože v dnešní době to není jenom o tom, jak věci vypadají, ale taky o tom, jak jsou naprogramovaný, jak se hýbají. Podívej se na takový McDonald. Mají web, mobilní aplikaci nebo taky touch screeny, přes který si objednáváš jídlo. To všechno musí ctít stejný pravidla. A já, jako designér a vývojář, bych měl mít možnost jít do jednoho místa, kde si jednotlivé komponenty vyzobu a pomocí nich poskládám nový produkt, nebo na základě komentářů zákazníků upravím rozhraní nějaké jiné aplikace. Takže nemusím neustále někoho uhánět o to, aby mi poslal ukázky a předešlé aplikace nebo zdrojové kódy.

Chápu. Přínos je tedy v úspoře peněz a času, ale taky v zachování kontinuity, ano?
Rozhodně! Žádný systém však není dokonalý a i tento má své úskalí. A to je dokumentace. Design systém je živoucí organismus, protože se neustále upravuje a doplňuje o nové věci, protože přicházejí požadavky z byznysu a nebo pak od zákazníků. No a pokud se neudržuje, tak vznikají mezery a lidi si to začnou plácat, jak chtějí, a vznikne tím chaos. Každý výstup je jiný, je to nekonzistentní, firma používá x různých stylů atp.

Co doporučuješ?
Skvěle to má zpracované Atlassian nebo Google. InVision rozjíždí nové produkty, které umožňují si vytvořit a spravovat svůj Design systém. Ale pokud nesprávně dokumentuješ, tak se ti to rozpadne jako domeček z karet.

Kdy ses ty poprvé setkal s Design systémem a kdy jsi začal vidět jeho přínos?
Bylo to v době, kdy jsem předával web vývojáři. Potřeboval jsem připravit samostatně jednotlivé prvky a komponenty, které jsem designoval. Problém celé věci je ten, a je jedno, jestli se to týká stránek, aplikace, nebo nějakého řešení, že i předávka designu musí být naplánována. Častokrát to funguje tak, že je to taková hurá akce, aby se to co nejdříve předalo do vývoje. Takže není prostor ty věci zdokumentovat a popsat, aby se zachovala kontinuita. Důsledek toho je, že vytváříš něco, co už někdo vytvořil a klient za to platí, místo aby se využilo to, do čeho už investoval.

Co ty a předávky designu developmentu? Zažil jsi, že tvůj design neodpovídal návrhům, které jsi udělal?
Jsou to dva pohledy. Jeden je pohled designéra, který to chce mít hezký a druhý je pohled vývojáře, který musí řešit spousty technologických omezení. Za sebe vím, že je potřeba, aby si designér sednul s vývojem ještě před tím, než se začne designovat, aby bylo jasný, jak bude vypadat předávka. Když se pospíchá, neudělá se příprava předávky řádně. Klienti častokrát nepřemýšlí nad tím, že díky investici do přípravy, může časem z původního designu vzniknout další web nebo aplikace, za kterou zaplatí méně, protože se věci nedělají znova.

Proč se to děje? Myslíš, že v tom klienti nevidí hodnotu?
To ne, ale spíše se nikdo nezamýšlí nad tím, že se veškeré věci dají použít znova, že se dají recyklovat. Pokud se korporátní zákazník rozhodne redesignovat aplikaci a pak z této aplikace vzniknou další aplikace, tak je logické, aby vznikl Design systém. Za takovým rozhodnutím musí být však nějaká vize, strategie toho, že investicí do první části získáme něco dalšího v budoucnu. Prostě přemýšlet komplexně nad všemi digitálními částmi, které realizují ve své organizaci.

Náhled komponent a barev pro Dark Mode z design systému Mobilní banky od KB

Správný designér musí řešit kontext, scénáře a situaci, ve které jeho design bude použitý. Jedině tak navrhne vizuálně skvělý produkt, který lidé budou chtít používat.

Co designéři a UX? Do jaké míry by měli designéři rozumět UX?
Jednotlivé prvky neznamenají nic, pokud nejsou správně použity. Já sám se cítím být UX designér. A taky si myslím, že designér v tom všem může být umělec. Správný designér musí řešit kontext, scénáře a situaci, ve které bude jeho design použitý. Jedině tak navrhne vizuálně skvělý produkt, který lidé budou chtít používat. Protože když to bude hezký, ale nebude to fungovat, tak k čemu to je?

Co uživatelé při návrhu designu?
Ti jsou klíčoví. Uživatel skrze náš design přichází do kontaktu s daným produktem. Pokud to vizuálně nefunguje, třeba se mu špatně čte text, nevyzná se v té aplikaci, tak je to selhání celého designového týmu.

Do jaké míry ovlivňuje hezké UI použitelné UX?
Vizuálno jsou emoce a prožitek, který si zákazník odnáší. Zážitek je v tom, jak se mnou celý výstup komunikuje, a to je přesně práce interface týmu. Pokud je nějaká věc hnusná a nikomu se nelíbí, tak se jí budeš vyhýbat zuby nehty.

Pokud si má člověk vybrat, tak si vždy vybere věc, která se mu lépe používá a lépe vypadá. Stejný to máš u výběru telefonu, oblečení, partnera. Emoce a prožitek, prostě Function & Feeling.

Jakým způsobem ovlivňuje vizuální design byznys?
Když budeme brát čistě vizuálno, představ si dva muže nebo dvě ženy. Jedni budou mít na sobě fakt super cool funkční lyžařský prádlo. Vymakaná bunda, krásné barvy, všechno ladí. A vedle nich budou ti stejní dva se stejně funkčním prádlem, ale už to nebude sedět. Bunda divokého vzoru, kalhoty s jiným vzorem, prostě to nebude spolu ladit. Jedni jako ze žurnálu a ti druzí budou nevkusní, ale všichni mají stejně funkční prádlo. Koho si vybereš? Pokud si má člověk vybrat, tak si vždy vybere tu věc, která se mu lépe používá a lépe vypadá. Stejný to máš u výběru telefonu, oblečení, partnera. Emoce a prožitek, prostě Functions & Feelings.

Emoce a forma, skrze kterou je vnímáme, jsou důležité pro naše rozhodování

Jasný, lidi nakupují očima…
Jo, nakupuješ očima, ale taky to musí fungovat. Já třeba i když je to krásný a nefunguje to, tak to nekoupím. Ale nejlepší kombinace je, když to funguje a ještě je to krásný.

Co ty a business cíle a výsledky?
My vždy designujeme na základě požadavků. Málo se nám prodává tento produkt — vymyslete, jak jej dostat více mezi lidi, jak jej rozšířit, jak zlepšit flow atp. Designujeme jednotlivé situace, ale už za klienta nemůžeme řešit strategické věci typu, chceme více prodat, chceme danou věc uvést na trh, jak to máme udělat. Tomu se věnuje náš Komunikační tým. Pokud ale máš špatný produkt a lidi jej nechtějí používat, tak ti žádný designér nepomůže.

Jak vidíš budoucnost designérského řemesla? Máme tady nástroje jako Wix, Squarspace nebo český Solidpixels.
Všechny tyto nástroje vnímám pozitivně. Jsou projekty a lidi, kteří s něčím začínají a nemají dostatek peněz k tomu, aby si mohli najmout designérský tým. Tyto nástroje jim pomůžou rozjet aspoň úvodní fázi, aby si mohli ověřit jejich záměr. Díky nim můžou dát lidem vědět, že jsou tady s něčím novým. A i když to není perfektní, aspoň mají v ruce první funkční prototyp a můžou jít pro zpětnou vazbu.

Kam myslíš, že půjde design v budoucnu?
Zažil jsem přerod tiskového designu do interaktivních formátů. Dnes už jsou kolem nás věci, co se ovládají hlasem. Možná věci budeme ovládat myšlenkami. Design jako takový ale nikdy nezanikne. Protože design je způsob, jak se vypořádat s nějakým problémem. Teď celý svět jede v tom, že se věcí dotýkáme, mluvíme k nim… věci se dotýkají nás, čtou jak nám tepe puls, kolik máme v sobě tuku, vody a všechno to začíná mezi sebou interagovat, aniž by tyto věci potřebovaly něco od nás. Díky tomu pak budou schopny aplikace a nástroje dělat závěry samy, že jsi třeba nemocný, protože tvůj telefon to dokáže detekovat z fotky, kterou si ráno uděláš a na očích pozná, že je něco v nepořádku. Pro mě se pak ty věci musí snadno ovládat, aby je lidé chtěli používat — a tam všude bude potřeba nás designérů.

Tomáš Wojcik

Spojte se s Jarinem na jeho Linkedinu a prohlédněte si jeho práci na webu našeho UI týmu.

2FRESH od roku 2006 pomáhá organizacím navrhnout, vytvořit a doručit smysluplné řešení díky pochopení potřeb a pocitů lidí. Většina našich klientů jsou společnosti, které naslouchají svým zákazníkům, pro které chtějí navrhnout nebo postavit nový produkt a službu, kdy si na sebe bereme i odpovědnost za měřitelný výsledek.

--

--

2FRESH

Pomáháme produktovým týmům s designem. Pomáháme designerům růst a mít pestrou práci.