Masarykova univerzita
Filozofická fakulta
Diplomová práce
2 0 1 8 Bc. Ondřej Honel
Kabinet informačních studií a
knihovnictví
Informační studia a knihovnictví
Bc. Ondřej Honel
Návrh oborových microsites pro Ústřední
knihovnu Filozofické fakulty Masarykovy
univerzity
D i p l o m o v á p r á c e
Vedoucí práce: PhDr. Markéta Bočková
2 0 1 8
Prohlašuji, že jsem diplomovou práci vypracoval
samostatně s využitím uvedených pramenů a
literatury. Svým podpisem dávám spolení k tomu, aby
elektronická verze této práce byla zpřístupněna přes
informační systém Masarykovy univerzity.
V Brně dne 27.4. 2018
Tímto děkuji PhDr. Markétě Bočkové, že se ujala vedení mé diplomové práce, zajejí čas a
rady, které mi během psaní práce poskytla. Také děkuji všem, kteří mě podporovali v
dokončení mých studií a nenechali mě to vzdát. Vážím si vaší trpělivosti a pevných nervů,
které jste se mnou měli. Děkuju vám!
Bibliografický záznam
H O N E L , Ondřej. Návrh podoby oborové microsite pro Ústřední knihovnu Filozofické fakulty
Masarykovy univerzity. Brno, 2018. Diplomová práce. Masarykova univerzita, Filozofická
fakulta, Kabinet informačních studií a knihovnictví. Vedoucí práce PhDr. Markéta Bočková.
6
Anotace
Diplomová práce se věnuje praktickému návrhu podoby oborové microsite pro Ústřední
knihovnu Filozofické fakulty z pohledu interakčního a user experience designu. V rámci
teoretické části se věnuje základům oborům user experience designu a interakčního designu,
používaných metod a terminiologii. V praktické části je realizován návrh oborové microsite od
prvotních skic do fáze prototypu, který slouží jako základ uživatelského testování.
Klíčová slova
U X design, HCI, interakční design, web, user experience, wireframe, prototyp, uživatelské
testování
Annotation
This diploma thesis deals with the practical design of the field microsite for the Central Library
of the Faculty of Arts from the perspective of user interaction design and user experience
design. Theoretical part describes the theory of user experience design and interaction design,
methodologies and terminology specific for this subjects. Practical part is of the thesis is
focused on practical application of design methods and process. Result is prototype of
microsite.
Keywords
U X design, HCI, interaction design, web, user experience, wireframe, prototype, user testing,
7
Obsah
1. Úvod 10
1.1. Cíl diplomové práce 11
1.2. Metodika H
2. Vymezení oblastí a pojmů 12
2.1.User Experience (UX Design) 13
2.2. Human-Centered Design vs. User-centered Design 13
2.3. Interakční design 15
2.4. Design služeb (Service Design) 15
2.5. Informační architektura (IA) 16
2.6. Human-computer Interaction (HCI) 16
2.7. Použitelnost, užitečnost, nalezitelnost 17
2.8. Designové myslení 18
3. Designové myslení pro knihovny a Ústřední knihovna Filozofické fakulty Masarykovy univerzity ...20
3.1. Designové myšlení a zavádění inovací v prostředí knihoven 20
3.2. Digitální informační kurátorství a doménová analýza v knihovnách 22
3.3. Elektronické informační zdroje 27
3.3.1. Volně dostupné zdroje a Open Access 28
4. User Experience Design (UX Design) 29
4.1. Interakční design 31
4.1.1. User-centered design 35
4.1.2. Activity-centered design 36
4.1.3. System design 37
4.1.4. Genius design 38
4.1.5 Goal-directed design 38
5. Designový proces 39
5.1. Designerský tým 42
5.1.1. UX Designer 42
5.1.2. Interakční designer 43
5.1.3. Webový grafik/grafický designér 43
5.1.4. Informační architekt 44
5.1.5. Webdesigner 44
5.2. Designov}' výzkum 45
5.2.1. Komponenty designového výzkumu 46
5.2.2. Metody uživatelského výzkumu 47
5.3. Modelování uživatelů 50
5.3.1 Persony 50
5.3.2. Proto-persony 52
5.3.3. Uživatelské role 54
5.3.4. Uživatelské profily 54
5.3.5. Tržní segmenty 55
6.4.6. Mentální modely a standardy 56
6.4.7. Afinitní diagramy 57
5.4. Navrhování - od skici po prototyp 58
8
5.4.1. Skicování 5 8
5.4.3. Prototyp 6 0
5.4.4. Návrhové vzory 62
5.5 Uživatelské testování návrhu 63
5.5.1. Testování použitelnosti 66
5.5.2. Testování užitečnosti 66
5.5.3. Testování grafického designu 66
6. Praktická část 68
6.1. Specifikace a cíle projektu 68
6.1.1. Cíl projektu 68
6.2. Metodologie 69
6.2.1. Desk research (výzkum od stolu) 70
6.2.2. Analýza existujících řešení 7 0
6.3. Uživatelský výzkum a modelování uživatelů 71
6.3.1. Proto-persony 72
6.4. Návrh - skicování, wireframe a prototyp 73
6.4.1. Skicování 73
6.4.2. Drátěné modely (wireframy) 74
6.4.3. Grafický návrh (vizuální styl) 76
6.4.4. Prototyp 78
6.5. Evaluace a testováni 79
6.5.1. Koncept uživatelského testování 79
6.6. Shrnutí 8 2
7. Závěr 84
8. Bibliografie 8 6
9. Seznam tabulek 90
10. Seznam obrázků 91
11. Seznam příloh 93
9
1. Úvod
Michal Černý v úvodu své knihy Digitální informační kurátorství v pedagogickém kontextu1
mluví o jevu, který označuje za informační revoluci a který přichází s rozmachem nejen
technologického pokroku, ale především s tím, jak se mění naše způsoby chování, komunikace,
ale také sociální vazby a kultura obecně. Zároveň díky obrovskému nárůstu a dostupnosti
informací na internetu a to i v rámci oborových agregátorů informačních zdrojů vyvstává
potřeba nejen tyto informace smysluplně třídit, validovat jejich relevanci a aktuálnost, ale
především je co nejefektivněji distribuovat jejich uživatelům. Černý se proto pokouší definovat
nový způsob přemýšlení a vnímání pedagogů (a také knihovníků) a posouvat je spíše do role
kurátorů digitálního obsahu. Znamená to tedy, že už nejsou jen těmi, co učí, ale měli by přebírat
roli tlumočníka mezi tímto obsahem a divákem - bez ohledu na to zda je to student nebo
náhodný uživatel, který má o daný problém zájem.
Tématem této diplomové práce je návrh oborové microsite pro Ústřední knihovnu Filozofické
fakulty Masarykovy univerzity, která si právě tyto změny, které popisuje Černý, uvědomuje a
prostřednictvím této práce se stává do určité míry iniciátorem změny v rámci práce s
elektronickými informačními zdroji v rámci Filozofické fakulty. Zároveň se díky této snaze
dotýká i mnoha oblastí designu a to nejen designu služeb, ale také designu webových stránek a
obecně lze říct oblasti user experience, kdy cílem knihovny je pozitivně naplnit cíle a potřeby
jejich uživatelů.
Proto se v teoretické části diplomové práce zaměřuji jednak na seznámení s tím, co je to
designové myšlení a jaké metody a procesy se objevují a používají při zavádění inovací. Věnuji
se také oblasti user experience designu (designu uživatelské zkušenosti/zážitku), která se mnoha
ohledech stává zastřešujícím pojmem napříč celým designovým procesem, ale také dalších
oborů, které se s user experience ve své činnosti překrývají nebo z ní určitým způsobem
vycházejí. Tím je například oblast interakčního designu, který přímo souvisí s návrhy webových
stránek a aplikací.
1
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivých nástrojům. Brno: Flow, 2015. ISBN 978-80-88123-03-3.
10
Značná část teoretického úvodu této práce se věnuje právě popisům těchto oblastí a především
pak metod, postupů a znalostí, které tyto disciplíny využívají - což je kromě technických
znalostí především snaha o co nej detailnější poznání uživatelů (zákazníků) a jejich chování a
potřeb. K tomu účelu slouží nej různější výzkumy a také interpretace a zpracování dat, které
výzkumy přinášejí.
V praktické části jsou tyto teoretické základy aplikované v rámci návrhu interaktivního
prototypu oborové microsite, kde si projdeme celým designovým procesem od úvodních
výzkumů přes návrhy wireframů až po realizaci samotného prototypu.
Již v úvodu je však nutné říct, že návrh který je v diplomové práci realizován není finálním a
knihovna jej bude následně sama testovat s uživateli a zástupci (garanty) oborů Filozofické
fakulty. Tento prototyp je zároveň jen malou částí všech změn, které v nejen v knihovně, ale i na
Filozické fakultě probíhají (nebo budou probíhat) a které vychází z dokumentu strategického
rozvoje Filozofické fakulty pro období 2016-2020.2
1.1. Cíl diplomové práce
Cílem této diplomové práce je navrhnout interaktivní prototyp oborové microsite pro Ústřední
knihovnu Filozofické fakulty Masarykovy univerzity a zároveň představit obory User
experience a interakčního designu, včetně používaných technik, metodologií a samozřejmě také
terminologii, která je s těmito obory spojená.
1.2. Metodika
Teoretická část práce je zpracovaná formou komparace a syntézy stávajících poznatků a zdrojů z
oblasti návrhu nejen webových stránek a aplikací, ale obecně z oblasti user experience designu a
souvisejících oborů. V navazující praktické části diplomové práce, která se věnuje návrhu
konkrétního řešení, dochází k praktické aplikaci těchto teoretických základů a je založena na
komplexním designovém procesu za využití nástrojů a metod participativního výzkumu,
modelování uživatelů a samotném vizuálním návrhu - prototypu.
2
Dlouhodobý záměr Filozofické fakulty Masarykovy univerzity na léta 2016-2020. Brno: Masarykova univerzita,
2016. ISBN 978-80-210-8301-1.
11
2. Vymezení oblastí a pojmů
V rámci této kapitoly jsou představeny základní oblasti (a pojmy) se kterými se lze v rámci
oboru User Experience resp. interakčního designu setkat a které se objevují i v následujících
kapitolách této práce. Problém oborů kolem user experience (i jeho samotného) je to, že zde
panuje značná neshoda v definicích jednotlivých oborů, tedy v tom, čím se konkrétně zabývají a
jaké mají výstupy a jak se prolínají (kde končí jeden a začíná druhý). Tento problém se
nevyskytuje jen v rámci praxe, ale také napříč literaturou. Stejně problematické je i datování
vzniku těchto oborů, kde se opět informace z různých zdrojů více nebo méně liší. I když tedy
víme, že samotné pojmy jako user experience nebo interakční design jsou primárně datované do
80. a 90. let 20. století, jejich samotnou podstatu nebo příbuzné obory lze sledovat výrazně
dále.3
Pojmy, se kterými pracuji v této kapitole, vyházejí z obrázku 1 převzatý od Dana Saffera4
, který
popisuje vztah jednotlivých oborů. Pojmy, se kterými pracuji jsou vyznačeny v obrázku tučně.
Obrázek 1: Zobrazení vztahů a oblastí v rámci User Experience designu resp. interakčního designu
3
viz například SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed.
Berkeley, CA: New Riders, 2010, s. 8-18. Voices that matter. ISBN 978-0-321-64339-1.
4
Ibid, s 21
12
Definice konkrétních pozic (specializací) v rámci těchto oblastí jsou popsány v kapitole ,
která se zabývá designovým procesem a složením designového týmu. Oborům User Experience
a Interakčnímu designuje v této práci věnována samostatná kapitola (kapitola ), které se jimi
zabývá více do hloubky.
2.1.User Experience (UX Design)
Zkušenost uživatele (user experience) zahrnuje všechny aspekty interakce koncového uživatele s
firmou, jejími službami a produkty."5
Důležitým předpokladem pro to, aby zkušenost uživatele
byla pozitivní, je poznání a naplnění jeho cílů a potřeb. Podle Normana s Nielsena by však
produkt nebo služba měly tyto cíle a potřeby přesáhnout - poskytnout uživateli radost z
používání. 6
Norman s Nielsenem také upozorňují, že uživatelskou zkušenost nelze zaměňovat za
použitelnost. Zatímco user experience je široký koncept zahrnující nejen samotný produkt, ale
také jeho vizuální styl, marketing a služby dané firmy se kterými zákazník nebo uživatel
přichází do kontaktu. Použitelnost je atributem uživatelského rozhraní, který ukazuje např. zda
je systém pro uživatele efektivní při používání, pochopitelný a snadno naučitelný.7
2.2. Human-Centered Design vs. User-centered Design
User-centered design (viz kapitola 4.1.1. User- centered design) je designový přístup, který je
zaměřený na uživatele a soustředí na naplnění jeho cílů a potřeb. Uživatel je zde ústředním
bodem při přemýšlení nad výslednou podobou služby nebo produktu.
5
Vlastní překlad autora práce. Původní znění: "User experience" encompasses all aspects of the end-user's
interaction with the company, its services, and its products." NORMAN, Don a Jakob NIELSEN. The Definition of
User Experience (UX). Nielsen Norman Group [online], [cit. 2018-03-03]. Dostupné z: https://www.nngroup.com/
articles/definition-user-experience/
6
Ibid.
7
NORMAN, Don a Jakob NIELSEN. The Definition of User Experience (UX). Nielsen Norman Group [online],
[cit. 2018-03-03]. Dostupné z: https://www.nngroup.com/articles/definition-user-experience/
13
Při aplikaci metod designového procesu dochází k hlubokému poznání stávajících nebo
potenciálních uživatelů, kteří jsou v rámci výzkumů a testování aktivní součástí projektu.8
Uživatel je v tomto případě pro potřeby designového procesu reprezentován tzv. personami (viz
kapitola ). V rámci odborné literatury se můžeme setkat také s pojmem Human-centered
design. N a stránkách asociace W 3 C lze najít definici obou pojmů:9
„Human-centered design proces je definován dle ISO 13407 (1999) takto: Humancentered
design je interaktivní systém budování systémů, který se soustředí specificky na
vytváření použitelných systémů. Je to multioborová aktivita. " 10
,,User-centered design (UCD)" je proces, který se zaměřuje na použitelnost
uživatelského rozhraní, charakteristiky uživatele, prostředí, úkolů a workflow při návrhu
těchto uživatelských rozhraní. UCD následuje sérii předdefinovaných metod a technik
pro analýzu, design a evaluaci hardwaru, softwaru a webových rozhraní. (...) " 11
W3C zmiňuje také definici User-centered designu podle Rubbina „vývoj probíhající s
uživatelem ve středu pozornosti"12
. Po analýze výše zmíněných definic obou pojmů lze říct, že
se jedná jen o rozdílnost v názvosloví, které zřejmě vychází z kontextu prostředí ve kterém jsou
používány. Tuto myšlenku potvrzuje také to, že W 3 C na stránce uvádí toto: User-centered
design proces (UCD) je také nazýván jako human-centered design proces. " 13
8
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010. Voices that matter. ISBN 978-0-321-64339-1.
9
Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné z: https://
www.w3 .org/WAI/redesign/ucd
1 0
Vlastní překlad autora práce. Původní znění: Human centred design processesfor interactive systems, ISO 13407
(1999), states: "Human-centred design is an approach to interactive system development that focuses specifically on
making systems usable. It is a multi-disciplinary activity."
viz Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné z: https://
www.w3.org/WAI/redesign/ucd
1 1
Vlastní překlad autora práce. Původní znění: ,, User-Centered Design (UCD " is a user interface design process
thatfocuses on usability goals, user characteristics, environment, tasks, and workflow in the design ofan interface.
UCDfollows a series ofwell-defined methods and techniquesfor analysis, design, and evaluation ofmainstream
hardware, software, and web interfaces. (...)"
viz. Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné z: https://
www.w3 .org/WAI/redesign/ucd
1 2
Vlastní překlad autora práce. Původní znění: „developmentproceeds with the user as the center offocus. "
viz Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné z: https://
www.w3.org/WAI/redesign/ucd
1 3
Vlastní překlad autora práce. Původní znění:,, User-centered design process (UCD) is also called human-centred
design process." viz Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné
z: https://www.w3.org/WAI/redesign/ucd
14
2.3. Interakční design
Hlavní myšlenkou interakčního designu je vytvářet interaktivní produkty, které jsou použitelné,
což znamená především to, že jsou pro uživatele jednoduché a efektivní v tom, jak je používat a
také nám poskytují pozitivní a příjemnou uživatelskou zkušenost.1 4
Oblast interakčního designu
má mnoho společných vlastností, které sdílí s user experience designem a zároveň rozšiřuje
tematický rámec, který pokrývá více technicky založený obor Human-Computer Interaction jež
se zaměřuje převážně na způsoby vytváření a implementace interaktivních počítačových
systémů a jejich vztah a komunikaci s uživateli, právě o pohledy a praxi, která vychází z user
experience designu, který se zaměřují primárně na to, aby došlo k uspokojení potřeb uživatele.1 5
2.4. Design služeb (Service Design)
"Design služby je činnost plánování a organizace podnikových zdrojů (zaměstnanců,
procesů, atd.) s cílem (1) přímo zlepšit podmínky a zkušenosti svých zaměstnanců a
(2) nepřímo tím zlepšit zkušenosti zákazníka s danou společností nebo i službou. " 16
Sarah Gibbons v článku zveřejněném na webové stránce společnosti Nielsen Norman Group o
designu služeb říká, že ,,De sign služeb zlepšuje zkušenost uživatelů i zaměstnanců tím, že
navrhuje, ladí a optimalizuje jednotlivé kroky tak, aby lépe podporovali cestu uživatele touto
službou. " 1 7
Upozorňuje také na fakt, že většina organizací a firem se zaměřuje primárně na dvě
oblasti v rámci podnikání - vlastní produkt a distribuční kanály ke svým zákazníkům, do
kterých také investují nejvíce zdrojů (čas, peníze, atd.), ale například již příliš neřeší své interní
procesy a zkušenosti svých zaměstnanců. Design služeb se podle sdefinice zaměřuje právě na
tyto přehlížené aspekty.
1 4
SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction design: beyond human-computer interaction.
2nd ed. Hoboken, NJ: Wiley, c2007, s. 2. ISBN 978-0-470-01866-8.
1 5
Ibid, s.10
1 6
Vlastní překlad autora práce. Původní znění:,,Service design is the activity ofplanning and organizing a
business s resources (people, props, andprocesses) in order to (1) directly improve the employee s experience, and
(2) indirectly, the customer's experience. "
GIBBONS, Sarah. Service Design 101. Nielsen Norman Group [online]. 2017 [cit. 2018-03-10]. Dostupné z:
https://www.nngroup.com/articles/service-design-101/
1 7
Vlastní překlad autora. Původní znění: „Service design improves the experiences of both the user and employee
by designing, aligning, and optimizing an organization's operations to better support customerjourneys. "
GIBBONS, Sarah. Service Design 101. Nielsen Norman Group [online]. 2017 [cit. 2018-03-10]. Dostupné z:
https://www.nngroup.com/articles/service-design-101/
15
Zároveň se Sarah Gibbons odkazuje na oblast user experience a v podstatě tak lze říct, že
základní myšlenka designu služeb je shodná s tou, kterou následuje oblast user experience tedy
správná integrace všech částí systému nebo služby do funkčního celku, který následně
ovlivňuje nebo vytváří pozitivní uživatelskou zkušenost.1 8
2.5. Informační architektura (IA)
Informační architektura podle Donny Spencer není pouze o třídění a vytváření různých skupin
obsahu například webových stránek a obecně kdekoliv, kde potřebujeme organizovat obsah nebo
objekty. Spencer říká, že jde především o to, aby tyto vytvořené skupiny dávaly smysl lidem,
kteří je budou používat. 1 9
Význam oboru informační architektury roste zároveň s tím, jak roste
objem dat, které se vytvářejí. Dobře navržená informační architektura dokáže uživatelům
pomoci snáze dosáhnout požadovaných informací, a zároveň ignorovat ty, které nejsou
relevantní.
Donna Spencer vytyčila tři hlavní cíle, které informační architektura má:2 0
• organizování obsahu a objektů
• jejich srozumitelný popis
• zajišťování cest, jak se lidé k tomuto obsahu dostanou
2.6. Human-computer Interaction (HCI)
Human-computer interaction je multidisciplinární oblast, která se věnuje primárně zkoumání a
návrhům způsobů komunikace mezi člověkem a počítačem.2 1
Vychází především z poznatků a
vývoje v oborech jako je počítačová, inženýrství a ergonomie nebo kognitivní věda.
is GIBBONS, Sarah. Service Design 101. Nielsen Norman Group [online]. 2017 [cit. 2018-03-10]. Dostupne z:
https://www.nngroup.com/articles/service-design-101/
1 9
SPENCER, Donna. A practical guide to information architecture. Penarth: Five Simple Steps, 2010, s. 3. ISBN
9780956174048.
2 0
SPENCER, Donna. A practical guide to information architecture. Penarth: Five Simple Steps, 2010, s. 3. ISBN
9780956174048.
2 1
Human-Computer Interaction (HCI). Interaction Design Foundation [online], [cit. 2018-03-01]. Dostupne z:
https://www.interaction-design.org/literatore/topics/human-computer-interaction
16
Obrázek 2: Znázornění multidisciplinarity oboru Human-computer interaction 2 2
Od 80. let minulého století, kdy se tento pojem poprvé objevil, se stal obor Human-computer
interaction klíčovým nástrojem k popularizaci myšlenky toho, že interakce mezi člověkem
(uživatelem) a počítačem může připomínat otevřenou formu dialogu tak jako je tomu v případě
interakce mezi dvěma lidmi. Samotný obor však od svého vzniku prošel značným vývojem a
kromě zkoumání nových technologií přejímá také mnoho vlivů z oblasti interakčního designu a
user experience designu.2 3
2.7. Použitelnost, užitečnost, nalezitelnost
O použitelnosti a užitečnosti (webů) mluví například Steve K r u g 2 4
nebo Jan Řezáč2 5
, který
definuje použitelnost webu jako vlastnost, která nám říká, zda uživatel danému webu rozumí,
dokáže se v něm zorientovat (je pro něj intuitivní) a například v co nej kratším čase úspěšně
vyřešit svůj problém nebo potřebu se kterou na tento web přišel (např. nakoupit). Užitečnost
webu pak podle Řezáče spočívá v tom, jak uživatel tento web vnímá v kontextu své práce nebo
cílů a zda pak tento web tyto cíle a potřeby uživatele uspokojuje. Použitelný web však
automaticky neznamená to, že je i užitečný.
2 2
Převzato a přeloženo autorem práce. Ibid.
2 3
Human-Computer Interaction (HCI). Interaction Design Foundation [online], [cit. 2018-03-01]. Dostupné z:
https://www.interaction-design.org/literatiire/topics/human-computer-interaction
2 4
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006. ISBN 0-321-34475-8.
2 5
REZAČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 168. ISBN 978-80-270-0644-1.
17
Nalezitelnost webové stránky pak zajišťují především marketingové aktivity a propagace daného
webu a v podstatě to neznamená to, že uživatelé na základě marketingu, doporučení nebo
nalezení přes vyhledávač přijdou na tento web. Řezáč však ve vztahu k nalezitelnosti webu
uvádí také to, že záleží na tom, jak důležitý je web z pohledu klienta a jeho podnikání a dle toho
se také odvíjí s jakou prioritou k tématu nalezitelnosti přistupovat.2 6
Zmiňuje například to, že
úplně jiný význam má nalezitelnost webu, přes který primárně klient prodává ve srovnání s
webem, který slouží jen jako doplněk nebo určitá forma virtuální vizitky.
2.8. Designové myšlení
„Design je kreativní disciplína, která může generovat mnoho řešení konkrétního problému nebo
zadání. Designové myšlení se však nezastaví ve chvíli, kdy je vytvořena funkční myšlenka.
Nápad nebo koncept je potřeba zpracovat tak, aby bylo možné jej dále rozvíjet a postupovat
směrem ke konečnému výsledku. "27
Společnost IDEO v knize Designové myšlení pro knihovny, která je určena jako příručka pro
knihovníky při zavádění inovací v oblasti designu služeb popisuje takto:
„Designové myšlení je kreativní přístup nebo řada kroků, které vám pomohou nacházet
smysluplná řešení problémů ve vaší knihovně. Uvažujete-li o něm jako o Vennovu
diagramu, řešení designového myšlení se nacházejí v průsečíku tří faktorů: potřebnosti,
proveditelnosti a životaschopnosti. Jinými slovy, pokud je řešení žádoucí, technicky
proveditelné a finančně udržitelné, inovace nastane, když se tyto tři faktory
překrývají. "28
2 6
ŘEZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. "Vydání
druhé. Brno: House of Řezáč, 2016, s. 160. ISBN 978-80-270-0644-1.
2 7
Vlastní překlad autora. Původní znění:,,Design is a creative discipline that can generate many solutions to a
particularproblem or brief. But design thinking does not stop once a workable idea has been generated. An idea or
concept needs to be worked up or rendered, so that it can be developed and advanced towards afinalresult. "
AMBROSE, Gavin a Paul HARRIS. Design thinkingfor visual communication. Second edition. New York:
Fairchild Books, an imprint of Bloomsbury Publishihng Pic, 2015. ISBN 978-2-940411-17-7.
2 8
Designové myšlení pro knihovny: příručka pro knihovny zaměřené na uživatele. Brno: IDEO, 2016, s. 10. ISBN
978-80-88123-11-8.
18
I N O V A C E
Obrázek 3: Diagram znázorňující faktory ovlivňující vznik inovací29
(převzato z Designové myšlení pro
knihovny, 2016)
Podle IDEO je designové myšlení empatický a intuitivní přístup, který je nutné chápat jako
systém, který je složený ze specifických kroků - jednotlivých fází procesu. Těmi fázemi jsou
inspirace, ideace a iterace. Tyto fáze nemusejí mít nutně pevnou posloupnost a vzájemně se
překrývají. Zároveň dodávají, že se jedná o nelineární proces, kde můžeme mezi jednotlivými
fázemi volně přecházet.3 0
PROCES DESIGNOVÉHO MYŠLENÍ
Obrázek 4: Proces designováno myšlení a jeho fáze31
Proces designového myšlení jako koncept není nijak novým přístupem. Tento proces poprvé
popsal Herbert Simon v roce 1969 v knize The Sciences of the Artificial.
2 9
Designové myšlení pro knihovny: příručka pro knihovny zaměřené na uživatele. Brno: IDEO, 2016. ISBN
978-80-88123-11-8.
3 0
Ibid. s. 12
3 1
Ibid.
19
Definoval v rámci procesu designového myslení následuj ich sedm kroků, které mají pomoci
týmům v širším přemýšlení nad daným problémem a v kreativním přístupu hledání cest k
dosažení cíle.3 2
Tyto kroky j s o u : 3 3
1. Definice problému - 2. Výzkum - 3. Ideace - 4. Prototypovom - 5. Implementace - 6. Učení
3. Designové myšlení pro knihovny a Ústřední knihovna Filozofické
fakulty Masarykovy univerzity
Cílem této kapitoly je seznámit čtenáře s tématem designového myšlení pro knihovny a obecně s
tím, jak vznikají a jsou zaváděny inovace v prostředí knihoven, a to nejen těch akademických,
ale knihoven obecně. Odkud do českého prostředí pronikají trendy v této oblasti a jaké aktivity a
kroky jsou nebo byly realizovány. Dalším tématem, kterému se kapitola věnuje se seznámení
čtenáře s tím, co jsou to elektronické informační zdroje a jaký význam má kurátorství
digitálního obsahu a s tím spojená také tvorba oborových bran.
3.1. Designové myšlení a zavádění inovací v prostředí knihoven
Přesto, že pojem nebo lépe řečeno koncept designové myšlení není žádnou novinkou, jeho
praktická aplikace v rámci služeb a specificky pak v prostředí knihoven je stále poměrně mladou
disciplínou, které si stále ještě hledá nejen své místo ale především své praktikanty.3 4
Potvrzením této teze, především pak pro české prostředí, budiž úvod k článku Romana
Novotného s názvem Designové myšlení do českých knihoven.
3 2
CHASE, Stephanie. Design inking in Action: Changing the Public Service Model. OLA Quarterly [online]. 2016,
s. 15. 22(3), 15-19 [cit. 2018-03-20]. Dostupne z: https://commons.pacificu.edu/cgi/viewcontent.cgi?referer=https://
www.google.cz/&httpsredir= l&article= 1865&context=olaq
3 3
Vlastni pfeklad autora prace. Puvodni zneni: „1. Define 2.Research 3. Ideate 4. Prototype 5. Choose 6. Implement
7. Learn "viz CHASE, Stephanie. Design inking in Action: Changing the Public Service Model. OLA Quarterly
[online]. 2017, 2-22-2017, 22(3), 15-19 [cit. 2018-03-20]. Dostupne z: https://commons.pacificu.edu/cgi/
viewcontent.cgi?referer=https://www.google.cz/&httpsredir=1&article=1865&context=olaq
3 4
CHASE, Stephanie. Design inking in Action: Changing the Public Service Model. OLA Quarterly [online]. 2017,
2-22-2017, 22(3), 15-19 [cit. 2018-03-20]. Dostupne z: https://commons.pacificu.edu/cgi/viewcontent.cgi?
refereFhttps://www.google.cz/&httpsredir=l&article=1865&context=olaq
20
Novotný článek uvádí následující větou: „České knihovny, sociální inovace, designové myšlení.
Trojice sousloví, které by možná ještě nedávno zněly jak knihovníkům, tak veřejnosti jako
spojení z jiného světa. (...) "35
Jako největší propagátory a inovátory designového myšlení v prostředí knihoven pak lze
jednoznačně označit veřejnou knihovnu D o k k l v dánském Aarhusu, která ve spolupráci s
Chicago Public Library a s designersko-konzultační společností IDEO vytvořili příručku
Designové myšlení pro knihovny 3 6
, které je široce využívána a překládána po celém světě.3 7
Tato publikace vychází z metod popsaných v knize HCD Design zaměřený na člověka: soubor
nástrojů^, kterou společnost IDEO publikovala v roce 2013 a která se stala takřka základní
publikací při přemýšlení nad sociálními inovacemi (a službami) a jejich následnému zavádění,
kdy v centru designového procesu stojí člověk - uživatel. Jejich postupy a následné případové
studie ovlivňují oblast designové myšlení pro knihovny nejen u nás v České republice, ale i v
zahraničí.
Českou verzi překladu knihy připravilo pracoviště Kabinetu informačních studií a knihovnictví
na Filozofické fakultě Masarykovy univerzity. Kabinet informačních studií a knihovnictví
(KISK) zároveň patří mezi přední propagátory a praktikanty v oblasti designového myšlení pro
knihovny a také designu služeb se zaměřením na jejich uživatele.
Kromě vzdělávání studentů pro oblast designu služeb na K I S K u vznikly nebo byly přeloženy
tématické publikace3 9
, které se designu služeb a knihovnám věnují a na jejichž základech
probíhá zavádění metod designové myšlení do praxe v prostředí knihoven.
3 5
NOVOTNÝ, Roman. Designové myšlení do českých knihoven. Inflow [online]. 2018 [cit. 2018-03-18],
Dostupné z: http://www.inflow.cz/designove-mysleni-do-ceskych-knihoven
3 6
Designové myšlení pro knihovny: příručka pro knihovny zaměřené na uživatele. Brno: IDEO, 2016. ISBN
978-80-88123-11-8.
3 7
CHASE, Stephanie. Design inking in Action: Changing the Public Service Model. OLA Quarterly [online]. 2017,
2-22-2017, 22(3), 15-19 [cit. 2018-03-20]. Dostupné z: https://commons.pacificu.edu/cgi/viewcontent.cgi?
referer=https://www.google.cz/&httpsredii=l&article=1865&context=olaq
38
HCD Design zaměřený na člověka: soubor nástrojů [online]. Brno: Kabinet informačních studií a knihovnictví
MU Brno, 2013. ISBN 978-80-905480-1-5.
3 9
Přehled publikací, které vznikly nebo byly přeloženy studenty nebo zaměstnanci Kabinetu informačních studií a
knihovnictví na Filozofické Fakultě Masasrykovy univerzity Eknihy.knihovna.cz [online], [cit. 2018-03-01],
Dostupné z: http://eknihy.knihovna.cz
21
A to nejen v rámci Ústřední knihovny Filozofické Fakulty, ale v rámci knihoven napříč Českou
republikou.4 0
Zkušenosti pracoviště Kabinetu informačních studií jsou dále předávány nejen v
rámci nejrůznějších překladů knih, ale především v rámci projektů jako je Libdesign,^ nebo
metodické příručky pro zavádění inovací v knihovnách s názvem 100 metody2
Metody popsané v projektu Libdesign v současnosti Ústřední knihovna Filozofické fakulty
využívá v rámci zavádění inovací. Proto se budu v rámci praktické části diplomové práce na
vybrané metody odkazovat neboje přímo využívat.
3.2. Digitální informační kurátorství a doménová analýza v knihovnách
Digitální informační kurátorství je pojem, který velice úzce souvisí nejen s elektronickými
informačními zdroji a tvorbou oborových bran, ale jak uvádí Michal Černý ve své publikaci
především s jevem, který lze označit jako informační revoluci.^ Černý říká, že tento jev lze
sledovat již od 60. let a není jen otázkou technologického pokroku, ale především pak celkové
změny lidského chování, komunikace, ekonomie, sociálních vazeb a kultur. 4 4
Jestliže pomineme dopady tohoto jevu na práci pedagoga a změny v přístupu k učení, je dalším
důležitým faktorem, proč se věnovat kurátorství digitálního obsahu především v tom, že jsme
svědky obrovského nárůstu dat a informací v online prostředí a oborových agregátech, dle
Černého, nevyjímaje. Kromě zvýšení dostupnosti zajímavých a kvalitních dat, což rozhodně
může být ku prospěchu, však Černý říká, že tento jev zároveň zvyšuje nároky na posuzování
relevance dat, jejich filtrování a zpřístupňování.45
4 0
viz například sbírka případových studií z oblasti zavádění inovací a designového myšlení do knihoven
CULEN, Alma Leora, Jan DELONG, Andrea Alessandro GASPARINI, Roman NOVOTNÝ, Pavla MINAŘÍKOVÁ
a Ladislava ZBIEJCZUK SUCHÁ. Knihovnícijako designéři: případové studie o zlepšování služeb v knihovnách.
Brno: Masarykova univerzita, 2016. ISBN 978-80-210-8358-5.
4 1
viz webové stránky projektu http://libdesign.kisk.cz nebo diplomová práce Pavly Minaříkové
viz MESAŘIKOVA, Pavla. Designové myšlení pro knihovny: projekt Libdesign. Brno, 2016. Magisterská
diplomová práce. Masarykova univerzita, Filozofická fakulta, Ústav české literatury a knihovnictví. Vedoucí práce
Ladislava Zbiejczuk Suchá.
4 2
viz webové stránky projektu http://100metod.cz
4 3
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivých nástrojům. Brno: Flow, 2015, s. 8. ISBN 978-80-88123-03-3.
4 4
Ibid.
4 5
Ibid. s. 10
22
Černý v tomto kontextu redefinuje roli pedagoga, který se ze současného modelu - „pedagog ví
a učí ty, co neví" - se přesouvá spíše do pozice moderátora, průvodce a facilitátora - člověka,
který studenty dokáže získat a nadchnout.
Černý v textu rozdělkuje kurátorství do dvou oblastí - informační kurátorství a digitální
kurátorství.*6
S tím, že informační kurátorství je dle něj pojem velmi obsáhlý a zahrnuje v
podstatě libovolnou činnost spojenou s informačními artefakty.
V rámci informačního kurátorství působí samotný kurátor jako „síto pro pro výběr objektů a
struktur, které si uživatel bude moci prohlédnout a které nikoliv. " 4 7
Dále hodnotí zdroje a
provádí jejich rešerše. Výsledkem jeho práce je to, aby se do výsledného produktu nedostaly
informace, které jsou nekvalitní a nerelevantní. Právě tyto činnosti jsou dle Černého napojeny na
pozice knihovníků, autorů oborových bran či databází. Proti tomu stojí pozice digitálního
kurátora, jehož činnosti vedou k uchovávání digitálních materiálů a zdrojů a také k jejich
zpřístupnění. Digitální kurátor pracuje pouze s digitálními objekty4 8
na rozdíl od informačního
kurátora, v jehož případě mohou být informačními artefakty jak čistě hmotného charakteru listiny,
exponáty, experimenty, atd., tak také digitálního - videa, texty, audio, obrázky v
elektronické podobě, atd.
Černý si pro svůj text, jak sám říká, vypůjčuje pojem od Bořivoje Brdičky - online kurátor.
Online kurátor se primárně snaží vytvářet informačně zajímavé kolekce, které slouží především
pro vzdělávání. 4 9
Pokud se zaměříme na to, jaké předpoklady nebo znalosti by měl kurátor mít,
bude to kromě znalosti dané domény především znalost informačního chování koncových
uživatelů, pro které je kurátorská činnost vykonávána. Tedy znalost toho jak uživatelé danou
informaci vyhledávají, a jakým způsobem s ní následně pracují.
4 6
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivým nástrojům. Brno: Flow, 2015, s. 12. ISBN 978-80-88123-03-3.
4 7
Ibid.
4 8
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivým nástrojům. Brno: Flow, 2015, s. 12. ISBN 978-80-88123-03-3.
4 9
Ibid.
23
Byť se Michal Černý ve svých textech věnuje kurátorství digitálního obsahu především v
kontextu pedagogickém, tzn., že tento přístup by měl být stěžejní především pro samotné
pedagogy, domnívám se, že knihovna má v tomto procesu své nezastupitelné místo a měla by to
být právě ona, která bude pedagogům pomáhat při vytváření cest, jak atraktivně vytvářet a
především předávat informační zdroje studentům. Nebojím se říct, že s ohledem na to, že právě
knihovny, které zodpovídají za utváření těchto kolekcí informačních zdrojů, by měly být
iniciátorem těchto aktivit, jak studentům sjednotit a předat zdroje, které jsou pro jejich studium
relevantní. Zde se opět můžeme odkázat na Michala Černého, který říká:
„Kurátorství, jako jedna z cest k modernímu učení, vyžaduje mnohem více než jen
aktivní činnost pedagoga nebo technické zázemí a prostředky. Vyžaduje především
změnu myšlení, chuť vyjít z naučených rámců a experimentovat. "50
Pokud se budeme snažit obecně definovat roli kurátora a jeho význam v kontextu ať už
pedagogickém nebo obecně ve vztahu třídění a distribuce informací, a bez ohledu na to zda se
jedná o informační, digitální nebo online kurátorství, jistě nám velice dobře poslouží definice, se
kterou přichází Černý a který kurátora a jeho činnost popisuje takto:
„Kurátor obecně by měl hrát roli určitého tlumočníka mezi složitým a často ne snadno
pochopitelým obsahem a divákem, studentem nebo jen nahodilým uživatelem, který má o
daný problém zájem. (...) dané informace nejen kvalitně zpracuje, ale také uspořádá a
popíše tak, že budou pochopitelné pro jehojazyk a styl myšlení. "51
Dalším pojmem, který souvisí s tvorbou oborových bran nebo oborových microsites, jako jsou
ty, kterým se věnujeme v této diplomové práci, a který můžeme propojit (nebo jím rozšířit)
předchozí téma digitálního informačního kurátorství je pojem doménová analýza. Výchozím
textem pro zpracování tohoto tématu je pro nás text Birgera Hjorlanda s názvem „Doménová
analýza v informační vědě: Jedenáct přístupů - tradiční, stejně jako inovativní".52
5 0
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivým nástrojům. Brno: Flow, 2015, s. 9. ISBN 978-80-88123-03-3.
5 1
Ibid. s. 14
5 2
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, pp.422-462, https://doi.org/
10.1108/00220410210431136
24
Hjorland se v tomto textu věnuje tomu, jaký druh znalostí potřebují mít informační specialisté,
kteří se se své práci věnuji specifickým oblastem jako je například medicína nebo hudba a
představuje v něm jedenáct přístupů k doménové analýze, které podle Hjorlanda vytváří unikátní
kompetence právě pro tyto informační specialisty.
V kontextu této diplomové práce je pro nás v Hjorlandově textu stěžejní předevší to, jaká je role
doménových studií v rámci informační vědy a pak také jeden z jím popsaných přístupů k
doménové analýze a tím je tvorba literárních průvodců nebo oborových bran.53
Hjorland považuje za základní myšlenu v rámci specializovaných knihoven to, že informační
zdroje by měly být identifikované, popsané, organizované a sdělované tak, aby mohly sloužit ke
konkrétním účelům.5 4
Tuto myšlenku pak ilustruje na příkladu specializované medicínské
knihovny, kde říká, že její obsah má sloužit lidem, kteří se zabývají zdravotními problémy a že
kritérium úspěchu lékařů je léčení pacientů. Kritérium úspěchu informačních systému je pak
podle Hjorlanda to, že identifikují a sdělují informace a znalosti, které lékař pro léčbu pacientů
potřebuje. Tento přístup specializovaných knihoven se pak Hjorland znaží přenášet i na obecné
knihovny, kde říká, že tyto knihovny nemohou zacházet se všemi doménami jako by byly
všechny stejné, ale že by měly zohledňovat specifické potřeby jednotlivých komunit nebo
oblastí.5 5
Literární průvodce nebo také jinak nazývané například jako „průvodce informačními
zdroji", „průvodce referenčními materiály", „oborové brány"5 6
, atd. jsou podle Hjorlanda
publikace nebo seznamy, které uvádějí a popopisují systém informačních zdrojů v jedné nebo
více oblastech (oborech).
5 3
Vlastní překlad autora práce. V původním znění Hjorlandova textuje tento přístup nazýván „Producing literature
guides or subject gateways "
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, p. 423, https://doi.org/10.1108/00220410210431136
5 4
Ibid.
5 5
Ibid.
5 6
Ibid. Vlatní překlad autora práce. Původní znění,,guides to information sources", guides to reference materials",
,,subject gateways "
25
Hjorland popisuje tyto průvodce jako určitý druh bibliografického dokumentu v určité doméně
zároveň u těchto průvodců (oborových bran) popsal dvě základní vlastnosti, které mají:
1. průvodci se koncentrují na referenční literaturu, jako jsou bibliografie, slovníky, encyklopedie
a další na úkor primární literatury
2. průvodci jsou typicky selektivní
V ideálním případě by podle něj tyto průvodce měly provádět uživatele literaturou v dané oblasti
a informovat jej o jejich přednostech a slabinách.
Tyto průvodce by podle Hjorlanda měly sloužit jako rozhraní mezi uživatelem a literaturou. 5 7
Hjorland také popisuje metody, které jsou spojené s tímto typem doménové analýzi;58
• posouzení oborové literatury
• klasifikace literatury podle její specifické role, funkce v hledání informací, typologie druhu
dokument nebo rozvíjení taxonomie
• popsání charakteristik jednotlivých referenčních prací
• výběr nejdůležitějších zdrojů
• poskytování pokynů, jak tyto informační zdroje používat
Hjorland zároveň popsal některé nevýhody tohoto přístupu k doménové analýze, jako je
například značná časová náročnost při tvorbě a také to, že pro tento typ práce není stanovený
nijak systematizovaný postup - ve smyslu toho, že není definována žádna konkrétní metodika,
jak provádět výzkumnou činnost při tvorbě těchto průvodců nebo oborových bran, což Hjorland
považuje za podstatný nedostatek, který by se měl změnit.5 9
5 7
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, p. 424, https://doi.org/10.1108/00220410210431136
5 8
Vlastní překlad autora práce. Původní znění:
- surveying the literature in a domain;
- classifying it according to its specific roles orfunctions in information seeking, developing a taxonomy or
typology ofkinds ofdocuments;
- describing the characteristics ofindividual reference works (idiographical approach);
- selecting the most important sources; and
- providing guidelines about how to use the information sources.
Ibid. s. 424
5 9
Ibid. s. 424-425
26
Popsaný přístup k doménové analýze má však podle Hjorlanda také silné stránky mezi které
patří například znalost klíčových informačních zdrojů v dané doméně (nebo více doménách) na
podrobné úrovni a také, strukturovanost výsledných informací. Zároveň tato metoda může
sloužit jako výchozí bod pro další druhy doménové analýzi. 6 0
3.3. Elektronické informační zdroje
Elektronické informační zdroje jsou informační zdroje, které jsou uchované v digitální
elektronické podobě a jejich distribuce probíhá online nebo v rámci uzavřených počítačových
sítí.6 1
Základním prvkem elektronických informačních zdrojů jsou digitální dokumenty.6 2
Jana Strenková ve své diplomové práci, v které se věnuje Elektronickým informačním zdrojům
na Masarykové univerzitě píše k úvodní definici elektronických informačních zdrojů toto:
„Pojem elektronické informační zdroje není v současné době přesně definován, ale v
praxi se tento termín používá k označení odborných licencovaných elektronických
databází od různých producentů a s různým obsahovým zaměřením. " 6 3
Elektronické informační zdroje Ústřední knihovny Filozofické fakulty Masarykovy univerzity
rozděluje do několika kategorií.64
Dle typů:
• elektronické katalogy knihoven
• profesionální informační databáze
• oborové portály
• digitální knihovny
• další informační zdroje na internetu
6 0
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, p. 424, https://doi.org/10.1108/00220410210431136
61
Elektronické informační zdroje: cesta ke kvalitním informacím. Ústřední knihovna FF MU, 2014. Dostupné také
z: https://www.slideshare.neťrs_knihovnaffmu/pruvodce-eiz-jaro2014
6 2
STRENKOVÁ, Jana. Elektronické informační zdroje na MU [online]. Brno, 2006 [cit. 2018-04-16]. Dostupné z:
. Diplomová práce. Masarykova univerzita, Filozofickáfakulta. Vedoucípráce RNDr
Miroslav Bartošek, CSc..
6 3
Ibid.
64
Elektronické informační zdroje: cesta ke kvalitním informacím. Ústřední knihovna FF MU, 2014. Dostupné také
z: https://www.slideshare.neťrs_knihovnaffmu/pruvodce-eiz-jaro2014
27
Původnost dokumentů:
• primární (plnotextové - časopisy, knihy, atd.)
• sekundární (např. bibliografické nebo citační databáze)
• terciální (např. databáze databází)
Z pohledu tématického a oborového:
• multioborové
• specializované - oborově zaměřené zdroje
Dle dostupnosti:
• volně dostupné (veřejně přístupné)
• licencované (profesionální infromační databáze, přístupné na základě licencí)
Podle přístupu:
• online
• offline
Většina databází pak kromě vyhledávání na úrovni klíčových slov, názvů, jmen nebo frází,
nabízí také pokročilé možnosti hledání za použití logických nebo proximitních operátorů. 6 5
3.3.1. Volně dostupné zdroje a Open Access
Volně dostupné informační zdroje jsou protipólem k tradičním licencovaným zdrojům, které
jsou přístupné na základě licencí, které zpravidla zajišťují v rámci univerzitního prostředí
knihovny a do kterých je přístup omezený na základě zakoupené licence (nebo jednorázovou
platbou za přístup/stažení článku).6 6
Volně dostupné informační zdroje a iniciativa Open Access
jsou postaveny na principu volného přístupu k informacím a jejich šíření bez autorského
povolení. Při jejich použité (šíření) je pouze nutné uvést autora.6 7
Zdroje publikované podle Open Access rozdělujeme do dvou kategorii - archivy a časopisy.
Články v Open Access časopisech jsou před publikováním recenzovány a teprve poté
zpřístupněny. Open Access archivy články nerecenzují a slouží k distribuci různých materiálů
jako například disertační práce, výukové materiály, audio, video atd.6 8
65
Elektronické informační zdroje: cesta ke kvalitním informacím. Ústřední knihovna FF MU, 2014. Dostupné také
z: https://www.slideshare.neťrs_knihovnaffmu/pruvodce-eiz-jaro2014
6 6
Ibid.
6 7
STŘENKOVA, Jana. Elektronické informační zdroje na MU [online]. Brno, 2006 [cit. 2018-04-16]. Dostupné z:
. Diplomová práce. Masarykova univerzita, Filozofickáfakulta. Vedoucípráce RNDr.
Miroslav Bartošek, CSc..
6 8
Ibid. s.22
28
4. User Experience Design (UX Design)
„UX design neřeší weby. Může webyjako prostředek k řešení problémů klienta využívat
(a často to dnes samozřejmě dělá), ale primárně nemá s tvorbou webů příliš společného.
Web je pro UX design pouze nástrojem. Za 10 let může UX design stejně dobře využívat
létající ledničky k podobnému účelu jako dnes weby. "69
Úvodní citace ilustruje v jakém kontextu a významu je pojem user experience design často
používán - tedy, že user experience je doménou především v oblasti návrhu webových stránek a
aplikací. To, že je obor user experience designu mylně spojovaná primárně (a pouze) s
webovým prostředím potvrzuje i Don Norman, který říká:
,, V dnešní době je tento termín hrozně zneužívaný. Je používán lidmi, kteří říkají „Jsem
user experience designer, navrhuji webové stránky a aplikace. " a ti nemají žádné tušení,
co vlastně dělají. Myslí si, že [uživatelská zkušenost] je právě toto jednoduché zařízení,
tato webová, stránka, aplikace nebo kdoví co. Ne, je to všechno - způsob jakým prožíváte
svět, svůj život. Způsob jakým používáte nějakou službu a ano, také určitou aplikaci nebo
počítačový systém. Celé to [user experience]je prostě systém. " 70
User experience design jako samostatný obor, je stále poměrně mladým pojmem, který v rámci
odborných specializací hledá své pevné místo a významní Termín user experience poprvé použil
teprve v roce 1993 psycholog a designer Don Norman. V rámci tohoto termínu tak popsal široké
spektrum aktivit a činností, které vykonával jeho tehdejší tým v Apple Computers.7 2
6 9
VÁLKA, Ondřej. Co je UX design. In: Ondřej Válka: an information interaction designer [online]. 2011 [cit.
2012-05-17]. Dostupné z: http://valka.info/notes/2011/04/co-je-ux- design/.
7 0
Vlastní překlad autora. Originální znění:,, Today that term has been horribly misused. It is used bypeople to say
"I am a user experience designer, I design websites, so I design apps " and they have no clues to what they are
doing d they think the experience that simple device the website or the app or who knows what. No, it s everything:
it's the wayyou experience the world, it's the wayyou your life, that's the wayyou experience he service, or-yeah,
and app or computer system. But it's is a system that's everything. "
NNGROUP . Don Norman: The term "UX". In: Youtube [online]. 2016 [cit. 2018-03-05]. Dostupné z: https://
www.youtube.com/watch?v=9BdtGjorN4E
7 1
pro ukázku například články
KOSNAR, Petr. Jak designem vyvolat emoce: Role UX. In: Czechdesign [online]. 10.10.2016 [cit. 2018-03-10],
Dostupné z: http://www.czechdesign.cz/temata-a-rubrikv/iak-designem-vyvolat-emoce-role-ux
HOLZMAN, Ondřej. Platbou to nekončí. Chceme zajistit maximální pohodlí i při doručení, říká šéf UX v Mall.cz
Honza Nováček. In: Tyinternety.cz [online]. 21.3.2018 [cit. 2018-03-30]. Dostupné z: https://tyinternety.cz/e-
commerce/chceme-zajistit-maximalni-pohodli-i-pri-doruceni-rika-sef-ux-v-mall-cz/
7 2
NIELSEN, Jakob. A 100-Year View of User Experience. Nielsen Norman Group [online]. 2017 [cit. 2018-03-01],
Dostupné z: https://www.nngroup.com/articles/100-years-ux/
29
Význam oboru user experience a zároveň vysvětlení toho, proč je tento termín dnes tolik
populární lze najít například u Jesse James Garreta, zakladatele konzultační společnosti v oblasti
human-centered designu Adaptive Path. Garret v knize The Elemments of User Experience:
User-CentteredDesign for the Web andBeyond (2011) zmiňuje to, že každý produkt, který jako
uživatelé používáme, nám v tu danou chvíli zprostředkovává nějaký zážitek nebo zkušenost. A
je tedy důležité, aby tato zkušenost byla pozitivní. Z pohledu Garreta dobré user experience
znamená dobré a úspěšná podnikání a také návratnost investovaných zdrojů.7 3
Garret dále říká,
že user experience design se často musí vyrovnávat s otázkou kontextu a dodává příklad.
„Estetický design zajišťuje to, že tlačítko na kávovaru má přitažlivý tvar a texturu.
Funkční design zajišťuje to, že ono tlačítko spouští odpovádající akci. Úkolem user
experience designu je potom to, aby estetické a funční aspekty tlačítka fungovaly v
kontextu ostatních produktů a pokládá si otázky například, zda dané tlačítko není s
ohledem na význam jehofunkce příliš malé. "74
Zhodnotíme-li nejen výše zmíněné přístupy, je patrné, že user experience design má značný
význam a roli v rámci designu produktů (ať už těch fyzických nebo virtuálních) a služeb.
To potvrzuje i Garret, když říká, že ,,User epxerience je zásadní pro všechny druhy produktů a
služeb. "75
Tato kapitola si neklade za cíl přinést novou nebo jednotnou definici oboru user experience
designu, ale má poukázat na jeho členitost a nejednotnost definic tohoto oboru, jak s ním
pracovat nebo jej chápat. Detailní rozbor myšlenek nebo pojetí user experience designu
(případně snaha o jednotnou definici oboru) jednotlivými autorů a zdroji by sám vydal na téma
diplomové práce, proto jsou zde vybrány jen příklad těch nejznámějších odborníků, které by z
našeho pohledu měly postačovat pro základní vhled do tématu.
7 3
GARRETT, Jesse James. The elements ofuser experience: user-centered designfor the Web and beyond. 2nd ed.
Berkeley, CA: New Riders, c2011. s. 8. Voices that matter. ISBN 03-216-8368-4.
7 4
Vlastní překlad autora práce. Původní znění: ,,Aesthetic design makes sure the button on the coffeemaker is an
appealing shape and texture. Functional design makes sure it trig- gers the appropriate action on the device. User
experience design makes sure the aesthetic andfunctional aspects ofthe button work in the context ofthe rest ofthe
product, asking questions like, "Is the button too smallfor such an importantfunction? "
Ibid.
7 5
Vlastní překlad autora práce. Původní znění:,, User experience is vital to all kinds ofproducts and services.
Ibid.
30
Je také nutné brát v potaz, že jednotlivé definice jsou často vázané i na kontext ve kterém daný
autor s tématem pracuje - viz například Don Norman 7 6
, který se tématu user experience designu
věnuje v širokém kontextu interakce člověka s předměty denní potřeby nebo službami. Naproti
tomu například Jasse james Garret se ve své knize The Elements of User Experience 7 7
věnuje
user experience designu především v kontextu webových rozhraní a aplikací.
4.1. Interakční design
Interakční design je značně multidisciplinární oblastí a spolu s user experience designem má
mnoho společných průniků. Podobně jako user experience design je interakční design oborem se
značnými přesahy a překryvy do jiných oborů. Těžiště interakčního designu však leží především
v komplexním návrhu vzhledu a fungování uživatelských rozhraní a to především u digitálních
produktů, kde dochází ke komunikaci mezi člověkem a strojem (počítačem).
Obrázek 5: Disciplíny obklopující interakční design
76 NORMAN, Donald A. The design of everyday things. New York: Doubleday, 1988. ISBN 0-385-26774-6.
7 7
GARRETT, Jesse James. The elements of user experience: user-centered designfor the Web and beyond. 2nd ed
Berkeley, CA: New Riders, c2011. Voices that matter. ISBN 03-216-8368-4.
7 8
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 21. Voices that matter. ISBN 978-0-321-64339-1
31
Bili Moggridge, který patří mezi zakladatele interakčního designu, při svých vzpomínkách na
historii oboru (pojem interakční design poprvé prezentoval v roce 1984) říká, že v době počátků
interkačního designu existovaly poměrně velké komunity human-computer interface designérů,
kteří pracovali na návrzích softwaru pro mainframe počítače, minicomputery a nastupující vlnu
osobních počítačů. Dále zde byli lidé přicházející se znalostmi počítačové vědy, kteří se
věnovali technickému vývoji a implementaci. Spolu s nimi zde existovaly také tými lidí, kteří
měli značné znalosti především z oblasti psychologie a zkušenosti, jak testovat a evaluovat
doposud navržené prototypy. Podle Moggridge tento stav generoval sice určité zlepšení v dané
oblasti, ale nevedl k radikálním inovacím. 7 9
Reakcí na tento způsob vývoje je dle Moggridge
právě interakční design. Moggridge nově vznikající obor popsal takto:
„Cítil jsem, že je zde prostor vytvořit novou designovou disciplínu zaměřenou na
vytváření nápaditých a atraktivních řešení ve virtuálním světě, kde by bylo možné
navrhovat chování, animace, zvuky a tvary. Byl by to ekvivalent průmyslového designu,
ale v rámci softwaru než v trojrozměrných objektech. Stejně jako průmyslový design by se
tato disciplína zabývala subjektivními a kvalitativními hodnotami, bude vycházet z potřeb
a přání lidí, kteří používají výrobek nebo službu, a usilovat o vytvoření návrhů, které by
poskytly estetické potěšení, stejně jako trvalé uspokojení a potěšení. "80
Úkolem interakčního designu resp. interakčního designera je definování a popsání různých
variant chování uživatelů, informací, produktů a především jejich vzájemná komunikace. Jak se
v určitých situacích budeme při interakci s produktem nebo zařízením chovat, jak budeme
reagovat nebo jak nás bude jako uživatele ovlivňovat a jak naopak budeme ovlivňovat produkt
nebo zařízení my.8 1
7 9
MOGGRIDGE, Bill. Designing interactions. Cambridge, Mass.: MIT Press, c2007, s. 14. ISBN 0262134748.
8 0
Vlastní překlad autora práce. Původní znění: „/felt that there was an opportunity to create a new design
discipline, dedicated to creating imaginative and attractive solutions in a virtual world, where one could design
behaviors, animations, and sounds as well as shapes. This would be the equivalent ofindustrial design but in
software rather than three- dimensional objects. Like industrial design, the discipline would be concerned with
subjective and qualitative values, would startfrom the needs and desires ofthe people who use a product or service,
and strive to create designs that wouldgive aesthetic pleasure as well as lasting satisfaction and enjoyment. "
MOGGRIDGE, Bill. Designing interactions. Cambridge, Mass.: MIT Press, c2007, s.14. ISBN 0262134748.
8 1
GARRETT, Jesse James, a Richard CADDICK. The elements ofuser experience: user-centered designfor the
Web and beyond. 2nd ed. Berkeley, CA: New Riders, c2011, s. 81. Voices that matter. ISBN 03-216-8368-4.
32
Proces interakčního designu zahrnuje podle Sharp8 2
tři základní akvitity. Jsou jimi poznávání ideace
(návrh) - evaluace. Popis těchto základních aktivit potom najdeme v knize Helen Sharp
Interaction design: beyond human-computer interaction^. Sharpová tyto definované aktivity
popisuje takto:8 4
• identifikování potřeb a požadavků, které je potřeba naplnit v rámci user experience
• vytvoření alternativního návrhu, který tyto požadavky plní
• vytvoření interaktivní verze návrhu, který lze komunikovat a validovat
'vyhodnocování toho, co bylo v celém procesu vybudováno v návaznosti na user
experience
Kromě výše zmíněných aktivit v rámci interakčního designu rozeznáváme podle Saffera čtyři
hlavní přístupy k řešení projektů interakčního designu: 8 5
• design zaměřený na uživatele (User-centered design - U C D )
• design zaměřený na aktivity (Activity-centered design - A C D )
• design systémů (Systems design)
• genius design (Genius design)
Detailní popis jednotlivých přístupů k interakčnímu designu dle Saffera najdeme v následujících
kapitolách 4.1.1. - 4.1.4. Tyto Safferem popsané přístupy je však nutné doplnit komentářem, že
se u různých autorů mohou tyto přístupy k interakčnímu designu lišit v nejen v terminologii, ale
také jejich pojetím a koncepcí.
8 2
SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction design: beyond human-computer interaction.
2nd ed. Hoboken, NJ: Wiley, c2007. ISBN 978-0-470-01866-8.
8 3
Ibid.
8 4
Vlastní překlad autora práce. Originální znění:
,, 1. Identifying needs and establishing requirementsfor the user experience.
2. Developing alternative designs that meet those requirements.
3. Building interactive versions ofthe designs so that the can be communicated and assessed.
4. Evaluating what is being built throughout the process and the user experience it offers. "
Ibid, s 17
8 5
SAFTER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 32. Voices that matter. ISBN 978-0-321-64339-1.
Tyto popsané přístupy se vzájemně nevylučují, respektive je na designerovi, aby zvolil ten, který
je v dané situaci nejvhodnější a případně mezi jednotlivými přístupy dokázal v čase přecházet a
využívat jejich vlastností.8 6
Následující tabulka Safferova tabulka {tabulka 1) zobrazuje
jednotlivé přístupy, jejich zaměření a popisuje pro každý z nich jakou roli má uživatel a
designér.
Přístup Z a m ř e n í Uživatel Designer
Design zaměřený na
uživatele
soustředí se na
uživatele, jeho potřeby
a cíle
řídící prvek návrhu
interpretuje potřeby a
cíle uživatelů
Design zaměřený na
aktivity
soustředí se na úkoly a
aktivity, které musí být
splněny
vykonavatel aktivit
vytváří nástroje pro
plnění aktivit
Design systémů
jednotlivé komponenty
systému
nastavuje cíle systému
zajišťuje, že všechny
části systému jsou na
svém místě
Genius design
dovednosti a
vědomosti designéra
jsou použité k vytvoření
produktu
zdroj validace zdroj inspirace
Tabulka 1: Přehled čtyř přístupů interakčního designu ajejich vlastností
Pokud se zaměříme na vztah mezi obory user experience design a interakčním designem,
dojdeme dle Helen Sharp k tomu, že zde existuje mnoho společných cílů resp vlastností
výsledných produktů, které tyto obory sdílejí. A to jak těch pozitivních, tak negativních. Podle
Sharp se jedná většinou o subjektivní kvality a definují především to, jaké pocity z používání
uživatel má. Jedná se o vlastnosti, jako jsou například uspokojení, užitečnost, kognitivní
stimulace, příjemná estetika, ale také frustrace nebo nudnost. 8 8
8 6
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. _ . Voices that matter. ISBN 978-0-321-64339-1.
87 Ibid. s. 33
8 8
Vlastní překlad autora práce. Původní znění:,,satisfying, helpful, cognitively stimulating, aestheticallypleasing,
boring, frustrating "
SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction design: beyond human-computer interaction. 2nd
ed. Hoboken, NJ: Wiley, c2007, s. 26-27. ISBN 978-0-470-01866-8.
34
Procesy interakčního designu jsou v současnosti značně ovlivněné především poznatky oblastí
user experience designu a to především v kontextu použitelnosti výsledných produktů. Dle
Sharp se to týká především toho, že až donedávna dominovaly v této oblasti především faktory
jako je efektivnost nebo užitečnost. Ty byly zároveň doménou především pro obor humancomputer
interaction.
Teprve v posledních letech se dostávají do popředí a nabírají na důležitosti také dříve přehlížené
aspekty, které souvisí právě s uživatelskou zkušeností jako je například estetika.8 9
Helen Sharp
tvrdí, že tato změna vnímání souvislotí mezi těmito dvěma obory vedla i Dona Normana k
přehodnocení původních postojů k interakčnímu designu. Zjistilo se, že existuje pozitivní
korelace mezi použitelností a estetikou.9 0
Sama Helen Sharp říká, že„ koncept, který se stal
hlavním pro interakční design je uživatelská zkušenost (user experience). " 9 1
Zároveň však
dodává, že je nutné si uvědomit, že nelze uživatelskou zkušenost nadesignovat ve smyslu
smyslového vnímání, ale pouze vytvořit design, který jej má evokovat.9 2
A právě některé z výše
zmíněných vlastností mají podíl na tom, zda uživatelská zkušenost bude pozitivní nebo
negativní.
4.1.1. User-centered design
Design zaměřený na uživatele, tak jak jej popisuje například Saffer,9 3
se soustředí na splnění cílů
a potřeb uživatele, který je v designovém procesu (a nejen tom interakčním) v centru celého
návrhu a je reprezentován personami. Dochází k hlubokému poznání stávajících nebo
potenciálních uživatelů, kteří jsou v rámci výzkumů a testování aktivní součástí projektu.
Zároveň umožňuje celému týmu soustředit se na konkrétní potřeby uživatelů a nepromítají tak
do návrhu své vlastní doměnky. Přesto nemusí být dle Saffera tento přístup vždy nejvhodnější.
8 9
SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction design: beyond human-computer interaction.
2nd ed. Hoboken, NJ: Wiley, c2007, s. 27. ISBN 978-0-470-01866-8.
so Ibid. s. 27
9 1
Vlastní překlad autora práce. Původní znění:,, A concept that has become cental to interaction design is the user
experience."
Ibid, s.15
9 2
Ibid.
9 3
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010. Voices that matter. ISBN 978-0-321-64339-1.
35
Saffer uvádí několik příkladů. Jedním z nich je například změna uživatelských cílů a potřeb v
dlouhodobém horizontu. Výsledný návrh tak nemusí být v danou chvíli již funkční.9 4
Omezením pro volbu přístupu zaměřeného na uživatele může být i to, že např. aplikace je
součástí většího systému, který má globálně definovanou funkčnost a výstupy neboje navržený
tak, že jej bude používat velké množství různých uživatelů. V tu chvíli může být, podle Saffera,
designový přístup se zaměřením na uživatele opět nevhodný, protože uživatelská základna je
příliš segmentovaná a není proto možné se zaměřit na konkrétní potřeby jednotlivých
uživatelů.9 5
4.1.2. Activity-centered design
Activity-centered design je, jak popisuje Saffer9 6
, stále jedna z nej používanějších metod návrhů
interakčního designu a týká se v podstatě všech spotřebičů a přístrojů, které běžně používáme.
Hlavním cílem tohoto přístupu není uspokojení cílů a potřeb uživatele, ale jeho chování při
vykonávání konkrétních aktivit, které definuje výsledný produkt tak, aby co nejvíce podpořil
jejich dokončení. Každá aktivita je pak definována jako sled jednotlivých akcí (úkolu) a
rozhodovacích procesů, které musí být vykonány a vedou k tomu, aby byla dokončena.
Aktivity mohou být na jedné straně jednoduché a na čas nenáročné (jako je třeba příprava
sandwiche) až po ty, které jsou časově velmi náročné a komplexní (např. naučit se cizí
jazyk).Saffer definici aktivit doplňuje poznámkou, že aktivita a cíl není vždy totéž, byť se v
některých případech mohou překrývat a také dodává, že z pohledu designéra je toto rozlišování
spíše předmětem akademických debat. Activity-centered design přístup je protikladem ke goalcentered
designu, který se soustředí primárně na to, aby naplnil konkrétní cíle uživatele bez
ohledu na to, jaké jsou s ním spojené aktivity.9 7
9 4
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 35. Voices that matter. ISBN 978-0-321-64339-1.
9 5
Ibid.
9 6
Ibid.
9 7
Ibid. s. 36-37.
36
4.1.3. System design
Velkou výhodou tohoto přístupu je podle Saffera jeho užitečnost vidět tzv. bigpicture protože
žádný projekt neexistuje ve vakuu. Designer se je tak nucen soustředit se na celý kontext a
prostředí, ve kterém bude produkt nebo služba využívána a které jej obklopují.9 8
V rámci designových systémů jsou předem definované veškeré komponenty, ať už jsou to
chybové hlášky, tlačítka, barvy a rozměry jednotlivých elementů. Jedná se o velmi komplexní
podobu designu, který má přesně určené hranice ve kterých se designer pohybuje a „skládá"
předem definované prvky systému do podoby funkčních celků, podle kontextu použití. Saffer k
tomuto designovému přístupu také říká, že díky němu je designér schopný předcházet
nejasnostem a chybám a dostává tak do rukou jasnou plán, kterého se má držet."
©
Recents Favorites Nearby
< O •
Do.
The bottom navigation bar exposes the three to five top-level
destinations of an app.
•0
Recents Favorites
0 o •
Don't.
If there are fewer than three destinations, consider using tabs
instead.
Obrázek 6: Ukázka designového systému společnosti Google s názvem Materiál Design (převzato ze
stránek společnosti Google) 1 0 0
9 8
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 41. Voices that matter. ISBN 978-0-321-64339-1.
»Ibid. s. 38
ioo Převzato z Material Design [online]. Google [cit. 2018-03-20]. Dostupné z: https://material.io/guidelines/
components/bottom-navigation.html#
Na této stránce najdeme kompletní přehled všech elementů, které společnost Google používá ve svých aplikacích.
Stránka obsahuje nejen vysvětiení toho, jak tento designový systém vznikl a z čeho vychází, ale také jak jednotiivé
prvky a v jakých situacích používat a naopak, jaké použití jsou zakázané nebo nevhodné.
37
4.1.4. Genius design
Tento designový přístup je dle Saffera1 0 1
založený téměř pouze na znalostech a zkušenostech
designera a na jeho vlastním úsudku, jak by měl výsledný produkt vypadat a být používán.
Uživatelé mnohdy nemusí být vůbec součástí projektu a to ani ve fázi testování - a pokud jsou
tak pouze pro potvrzení designerových hypotéz a předpokladů. Neznamená to však, že by
designéři nezohledňovali potřeby uživatelů. Tento přístup bývá aplikován především seniorními
designéry, kteří mají dostatek zkušeností napříč nej různějšími návrhy nebo ve chvíli, kdy z
důvodu nedostatku zdrojů nebo jiných omezení (třeba proto, že designer nechce) nejsou
uživatelé do procesu zapojení.
I když se může zdát, že tento přístup je určitým způsobem v rozporu s předchozími metodami,
kdy je uživatel v centru celého návrhu a je aktivním participantem v designovém procesu, Saffer
upozorňuje, že tento přístup k interakčnímu designu může být zdrojem skvělých produktů, jako
je třeba Apple iPod nebo také velkých omylů, jako bylo první přenosné zařízení od společnosti
Apple - Newton.1 0 2
4.1.5 Goal-directed design
Goal-directed design je tak, jak o něm mluví Cooperio^ opakem k Activity-centered designu,
který popisuje například Saffer. 1 0 4
Cooper o cílech říká, že nejsou to samé jako aktivity a cíl
označuje jako očekávaný konečný stav, zatímco aktivity a úkoly jsou prostředkem nebo
nezbytnými kroky k dosažení cílů. Cooper se při popisu tohoto rozdílu odkazuje na práci Dona
Normana1 0 5
, který popsal hierarchii, ve které jsou aktivity složeny z úkolů, tyto úkoly se skládají
z jednotlivých akcí. Akce samotné jsou pak jednotkou, která vniká skladbou operací. Cooper
také souhlasí s Normanem v tom, že tradiční designerské zaměření na úkoly neposkytuje
adekvátní výsledky.
1 0 1
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 43. Voices that matter. ISBN 978-0-321-64339-1.
102 Ibid.
1 0 3
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 15. ISBN 978-0-470-08411-3.
i°4
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 36-37. Voices that matter. ISBN 978-0-321-64339-1.
i°5
NORMAN, Donald A. The design of everyday things. New York: Doubleday, 1988. ISBN 0-385-26774-6.
38
Tento způsob navrhování produktů resp. omezení se na přemýšlení nad konceptem produktu
pouze na úrovni toho, jaké plní nebo obsahuje úkoly, Cooper označuje za špatný.
Jeho výsledkem jsou produkty, které uživatele pouze iritují a nejsou schopné naplnit očekávání
uživatelů. 1 0 6
„Pokud navrhujeme a konstruujeme produkty způsobem, že lidé je používají k
dosažení svých cílů, tak tito lidé budou spokojení, efektivní a štastní; rádi pak za tento
produkt zaplatí nebojej doporučí ostatním . "10?
Cooper o cílech uživatelů říká, že jsou často jiné, než jak designéři předpokládají, přesto však
uživatelé sdílí mnoho společných osobních cílů. Zároveň popisuje, jaký vliv má na produkt (a
uživatele) to, když začneme navrhovat produkty s ohledem na to, aby pomáhaly uživatelům
dosahovat jejich cílů.
5. Designový proces
Designový proces je komplexním souborem postupů, technik a nástrojů, které vedou k vyřešení
daného problému. N a začátku většinou stojí poznávání a popis problému a končí uživatelským
testováním resp. výsledným produktem nebo službou. Samotný designový proces ale není nijak
oficiálně ukotven ve smyslu toho, kdy jakou metodu použít nebo jak na sebe jednotlivé kroky
navazují. Lze říct, že designový proces je do určité míry individuální a zvyklostní - zaleží na
daném projektu, ale také týmu (designérech, agentuře, společnosti) jaké metody využívá. Přesto
se můžeme setkat určitými modely designových procesů, které lze označit za "standardizované"
- co se týká postupů nebo kontextů použití. I přesto, že se jednotlivé modely na první pohled liší
nejen početem fází procesu a jejich názvy, lze u nich pozorovat společné průniky.
Jednotlivé fáze designového procesu zároveň pomáhají k určení toho, co a kdy se má udělat a
také v tom, že se v těchto fázích poměrně jednoduše orientuje i méně zkušený člen týmu nebo
zapojení stakeholdeři.
1 0 6
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s.5. ISBN 978-0-470-08411-3.
1 0 7
Vlastní překlad autora práce. Původní znění: ,,Ifwe design and constructproducts in such a way that the people
who use them achieve theri goals, these people will be satisfied, effective, and happy and will gladlypayfor the
products and recommend that others do the same "
Ibid, s 1.
39
Velice dobře zpracovaný přehled několika vybraných modelů designového procesu můžeme
najít v diplomové práci Pavly Minaříkové 1 0 8
. Dovolím si tedy její přehledovou tabulku modelů
použít pro názornost a úplnost popisovaného tématu designového procesu i zde.
Označení modelu
- zdroj
Označení fází Popis zdroje a využití modelu
HCD
IDEO, 2013
Naslouchejte
Tvořte
Realizujte
Příručka o designovém myšlení
určená organizacím pracujícím
v rozvojových zemích; slouží
jako fáze procesu s
charakteristickými činnostmi
a metodami.
31
IDEO, 2016c
Inspirace (Inspiration)
Ideace (Ideation)
Implementace (Implementation)
Webové stránky společnosti
IDEO; slouží ke třídění metod
a souvisejících doporučení.
31+
IDEO, 2014
Začínáme (Getting started)
Inspirace (Inspiration)
Ideace (Ideation)
Iterace (Iteration)
Rozšiřujeme dopad (Getting
to scale)
Příručka o designovém myšlení
určená knihovnám; slouží jako fáze
procesu s charakteristickými
činnostmi a metodami.
HCD II
IDEO, 2016b
Objevujte (Discover)
Ideujte (Ideate)
Prototypujte (Prototype)
Materiál v online kurzu určeném
týmům, které se chtějí naučit
základy designového
myšlení; slouží jako fáze procesu
s charakteristickými činnostmi
a metodami.
d.school
d.school, 2013
Vciťte se (Empathize)
Vymezte (Define)
Ideujte (Ideate)
Prototypujte (Prototype)
Testujte (Test)
Příručka pro podporu designového
myšlení; slouží jako fáze
procesu s charakteristickými
činnostmi a metodami.
Double Diamond
Design Council, 2007
Objevujte (Discover)
Vymezte (Define)
Vyvíjejte (Develop)
Předejte (Deliver)
Model vyvinutý (2005)
a používaný British Design Council;
slouží pro rozdělení fází
designového procesu s důrazem
na rozdíly ve způsobu myšlení
a používaných metodách.
1 0 8
MINAŘÍKOVÁ, Pavla. Designové myšlení pro knihovny: projekt Líbdesign. Brno, 2016. Magisterská
diplomová práce. Masarykova univerzita, Filozofická fakulta, Ústav české literatury a knihovnictví. Vedoucí práce
Ladislava Zbiejczuk Suchá.
40
Označení modelu
- zdroj
STD
Stickdorn a
Schneider, 2011
Universal Methods
of Design
Martin a Hannington,
2011
IDEO Method Cards
IDEO, 2003
Skvělé služby
Hazdra, 2013
7 fází designu
Ambrose a Harris,
2011
Označení fází
Objevujte (Explore)
Tvořte (Create)
Reflektujte (Reflect)
Uskutečněte (Implement)
Plánování, rámování a definování
(Planning, Scoping, and Definition)
Objevování, syntéza a dopady
na design (Exploration, Synthesis,
and Design Implications)
Navrhování konceptu a iterativní
prototypování (Concept Generation
and Early Prototype Iteration)
Vyhodnocení, vylepšení a tvorba
(Evaluation, Refinement, and
Production)
Spuštění a kontrola (Launch and
Monitor)
Učte se (Learn)
Sledujte (Look)
Ptejte se (Ask)
Vyzkoušejte (Try)
Výzkumné
Analytické
Designové
Specifikace
Rešerše
Vymýšlení nápadů
Tvorba prototypů
Výběr řešení
Implementace
Poučení
Popis zdroje a využití modelu
Publikace o designovém myšlení
a designu služeb; slouží jako
označení fází designového procesu
a zároveň dělení nástrojů.
Model vyvinutý (2005) a používaný
British Design Council;
slouží pro rozdělení fází
designového procesu s důrazem
na rozdíly ve způsobu myšlení
a používaných metodách.
Sada 51 metodických karet;
slouží pro rozdělení metod
do kategorií, které zároveň
naznačují doporučený postup.
Český úvod do designu služeb;
slouží jako dělení představených
metod.
Publikace o designovém myšlení
pro designéry; slouží jako fáze
procesu s charakteristickými
činnostmi a metodami.
Tabulka 2: Přehled vybraných modelů designového procesu se stručným popisem jejich zaměření a
zdrojem, ve kterém jsou uvedeny 1 0 9
1 0 9
Převzato z MINAŔÍKOVÁ, Pavla. Designové myšlení pro knihovny: projekt Libdesign. Brno, 2016. Magisterská
diplomová práce. Masarykova univerzita, Filozofická fakulta, Ústav české literatury a knihovnictví. Vedoucí práce
Ladislava Zbiejczuk Suchá.
41
5.1. Designerský tým
Cílem této kapitoly je popsat možné složení designerského týmu při návrhu produktu nebo
služby. Složení týmů se však může lišit s ohledem na typ projektu, zdroje nebo znalosti členů
týmu. Může tak docházet například k tomu, že některý z členů zastává více než jednu z
uvedených rolí.1 1 0
Popisem jednotlivých rolí v designérském týmu se zabývá například i Jan
Řezáč. Ten zde definuje nejen typické úkony pro každou z těchto pozic, ale především pak jejich
výstupy. V rámci tohoto popisu také definuje určitou hierarchii mezi jednotlivými pozicemi. 1 1 1
5.1.1. UX Designer
Podle Řezáče je hlavním úkolem U X designera transformace myšlenek klienta a pochopení jeho
zákazníků tak, aby na jejich základě mohl navrhnout fungující web (ve smyslu naplnění
parametrů jako je použitelnost, přístupnost, atd.).1 1 2
Platnost této definice je však nutné chápat s
ohledem na kontext, ve kterém o ní Řezáč mluví - tedy primárně v rámci tvorby webových
stránek a aplikací.
Vezmeme-li v úvahu některé z definic popsaných v kapitole 4. User experience design, vyplývá
z nich, že webové stránky jsou zpravidla jen součástí širšího systému, se kterým U X designer
pracuje. Kromě webových stránek to mohou být například kamenné prodejny, výdejny,
kontaktní centra, atd. U X designera lze v širším kontextu jeho působení definovat jako člověka,
který transformuje myšlenky klienta a snaží se pochopit co nejlépe jeho zákazníky, má vizi
konečného výsledku a zároveň se stará o to, aby byla tato vize pochopena a realizována celým
týmem.1 1 3
Tuto definici potvrzují také Don Norman a Jakob Nielsen, když říkají že „Uživatelská
zkušenost (user experience) zahrnuje všechny aspekty interakce koncového uživatele s firmou,
jejími službami a produkty. "114
1 1 0
viz například MAČEK, Pavel. Návrh uživatelského rozhraní aplikace pro správu úkolů [online]. Brno, 2011, s.
6. [cit. 2018-03-15]. Dostupné z: . Diplomová práce. Masarykova univerzita, Fakulta
informatiky. Vedoucí práce doc. Ing. Jiří Sochor, CSc.
1 1 1
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, ISBN 978-80-270-0644-1.
1 1 2
Ibid. s. 201
i " Ibid.
1 1 4
Vlastní překlad autora práce. Původní znění: „ "User experience" encompasses all aspects of the end-user's
interaction with the company, its services, and its products. "
NORMAN, Don a Jakob NIELSEN. The Definition of User Experience (UX). Nielsen Norman Group [online], [cit.
2018-03-03]. Dostupné z: https://www.nngroup.com/articles/definition-user-experience/
42
5.1.2. Interakční designer
Pokud vyjdeme z popisu oborou interakčního designu, tak jak o něm píše například Bill
Moggridge1 1 5
, můžeme interakčního designera definovat v podstatě jako průmyslového
designera, který však nepracuje s trojrozměrnými objekty, ale za pomoci obrazu, zvuků, animací
a objektů vytváří virtuální interaktivní prostředí pro komunikaci mezi uživatelem a počítačem.
A stejně jako v případě průmyslového designera je cílem interakčního designera vytvářet takové
produkty, které vycházejí z potřeb uživatelů a kterými tyto potřeby bude uspokojovat. A to jak z
estetického pohledu tak toho funkčního.1 1 6
Interakční designer je, podobně jako U X designer, značně multidisciplinární pozicí, která čerpá
ze znalostí oborů human-computer interaction, ux designu, psychologie a také počítačové vědy.
Jeho výstupem bývají zpravidla návrhy drátěných modelů, které zobrazují a popisují rozvržení a
funkcionality produktu.1 1 7
Ty jsou následně zpracovány webovým/grafickým designérem do
finální vizuální podoby a programátoři na jejich základě vyvíjejí produkt (jeho technickou část).
5.1.3. Webový grafik/grafický designér
Pokud omezíme práci grafického designera pouze na oblast webu a digitálního prostoru, tak dle
Řezáče je hlavním úkolem webového grafika co nejlépe interpretovat drátěné modely tak, aby
byl jednak smysluplný pro koncového uživatele a zároveň odpovídal používanému vizuálnímu
stylu klienta.1 1 8
Řezáč v rámci popisu webového grafika zmiňuje několik typických pracovních
úkolů, j ako j sou například:
• vytváření moodboardů webových stránek
• zasazení webu do grafického stylu klienta
• koordinuje volbu grafických podkladů - video, fotografie, ilustrace, atd.
• navrhuje typografii
• graficky interpretuje drátěné modely
1 1 5
viz kapitola 4.1 Interakční design nebo MOGGRIDGE, Bill. Designing interactions. Cambridge, Mass.: MIT
Press, c2007, s. 14. ISBN 0262134748.
1 1 6
MOGGRIDGE, Bill. Designing interactions. Cambridge, Mass.: MIT Press, c2007, s. 14. ISBN 0262134748.
1 1 7
viz kapitola 5.4.2. Drátěné modely (Wireframe)
1 1 8
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. "Vydání
druhé. Brno: House of Řezáč, 2016, s. 202. ISBN 978-80-270-0644-1.
43
I přes široký rozsah práce zde však Řezáč striktně odděluje to, že webový grafik není
webdesignerem a je tedy vždy závislý na výstupech od U X designera.1 1 9
5.1.4. Informační architekt
Role informačního architekta je důležitá především v rámci návrhu webových stránek a aplikací,
protože ty jsou primárně založeny na obsahu. Jeho úkolem je strukturování a kategorizace
tohoto obsahu a tím pádem i lepší přístupnost a dohledatelnost informací pro uživatele
webových stránek. 1 2 0
V případě malých designerských týmů roli informačního architekta může
přebírat některá z jiných specializací - typicky to bývá U X designér. 121
5.1.5. Webdesigner
,,(...) není ve většině případů jeden člověk, ale celý tým lidí. (...) Webdesigner je desetibojař nic
nedělá do hloubky, ale je všestranný, aby se mohl rychle přizpůsobovat vývoji našeho
oboru." 1 2 2
Řezáč webdesignera v knize Web ostrý jako břitva jako člověka, který se pak
typicky věnuje jedné nebo více oblastem. Může to být například samotný návrh webu, tedy
dokumentace k webu a konkrétní pozice takového člověka je pak dle Řezáče U X designer,
interakční designer, atd. Další oblastí webdesignera pak může být webový grafik, webový kodér
nebo front-end developer. 1 2 3
1 1 9
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 202. ISBN 978-80-270-0644-1.
120 DVOŘÁKOVÁ, Lucie. Informační architektura. Inflow [online]. 2010 [cit. 2018-03-10]. Dostupné z: http://
www.inflow.cz/informacni-architekmra
1 2 1
MAČEK, Pavel. Návrh uživatelského rozhraní aplikace pro správu úkolů [online]. Brno, 2011, s. 6. [cit.
2018-03-15]. Dostupné z: . Diplomová práce. Masarykova univerzita, Fakulta
informatiky. Vedoucí práce doc. Ing. Jiří Sochor, CSc.
Pavel Maček se ve své diplomové práci věnuje návrhu aplikace pro správu úkolů v malém týmu resp. v jednom
člověku, kde také popisuje právě to, že typicky pak samotný designer zastává všechny role, které obvykle zajišťuje
několik odborníků pro danou oblast.
1 2 2
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 200. ISBN 978-80-270-0644-1.
1 2 3
Ibid.
44
5.2. Designový výzkum
,,K vyřešení problému jej musíte nejprve pochopit. "124
Dle Goodwinové j sou všechny designové procesy, bez ohledu na technickou náročnost daného
problému, závislé na lidském chování. Goodwinová popisuje výzkum jako systematickou studii
k prokázání určité skutečnosti. V rámci designového procesu slouží výzkumy především k
pochopení chování uživatelů, jejich potřeb a cílů. Goodwinová říká, že kvalitní službu nebo
produkt, lze navrhnout i bez provedeného výzkum. Přesto však provedení designového výzkumu
doporučuje a argumentuje několika pozitivními aspekty: 125
- urychlení rozhodovacích procesů na základě získaných dat
eliminace názorových neshod napříč týmem
slouží jako přesvědčovací nástroj a podpora při argumentaci
Goodwinová dále upozorňuje na fakt, že je značný rozdíl mezi výzkumem trhu a designovým
výzkumem. Cílem výzkumu trhuje zjištění, jak nabízenou službu nebo produkt prodat a jaká je
demografie daného trhu. Designový výzkum se zaměřuje primárně na kontext, ve kterém
uživatelé produkt používají a jaké je jich chování. Rozdíly mezi výzkumem trhu a designovým
výzkumem Goodwinová popsala v následující tabulce:1 2 6
Výzkum trhu Designový výzkum
Soustředí se na velikost trhu, počáteční prodej
spokojenost v průběhu času,
počáteční prodej
Zapojení lidé zákazníci zákazníci a koncoví uživatelé
Použité metody
kvantitativní (obvykle dotazník) nebo
kvalitativní (obvykle focus group)
primárně kvalitativní (rozhovory
nebo pozorování)
Vhodné pro poznání
• velikost trh a demografie
• co lidé kupují
• jaká komunikace je přitažlivá
• co vyrobit a jak by se měl
produkt chovat
• co lidé kupují
• co dělá z lidí loajální zákazníky
• jaká komunikace a styl jsou
přitažlivé
Tabulka 3: Rozdíly mezi výzkumem trhu a designovým výzkumem
1 2 4
Vlastní překlad autora práce. Původní znění: „To solve a problem, you mustfirstunderstand it." GOODWIN,
Kim. Designingfor the digital age: how to create human-centeredproducts and services. Indianapolis, IN: Wiley
Pub., C2009, s. 51. ISBN 978-0-470-22910-1.
1 2 5
Ibid, s 52
1 2 6
Ibid. s. 53. Vlastní překlad autora práce.
45
V literatuře se setkáváme také s pojmem participativní design, o kterém mluví například Saffer.
Tento termín odkazuje na aktivní zapojení uživatele do designového procesu pro účely
výzkumu. Uživatel se aktivně podílí na generování nápadů, diskuzi nad koncepty a samozřejmě
testování návrhů a prototypů. 1 2 7
5.2.1. Komponenty designového výzkumu
V rámci designového výzkumu Goodwinová pracuje s několika dílčími fázemi designového
procesu, které slouží k poznání organizace (firmy), tak samotného produktu, jeho uživatelů a
tržního prostředí. N a obrázku 7 j sou tyto kroky a jejich návaznost graficky znázorněny.
sestavení týmu
úvodní setkání
rozhovory s e stakeholdery
zhodnocení
konkurence
a literatury
Rozhovory s uživateli a
pozorovování
1
T
Audit produktu,
kvantitativní studie
nebo jiné formy
výzkumu
1
Obrázek 7: Přehled dílčích kroků výzkumného procesu
1 2 7
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 75 Voices that matter. ISBN 978-0-321-64339-1.
1 2 8
Vlastní překlad autora práce. Převzato z GOODWIN, Kim. Designingfor the digital age: how to create humancenteredproducts
and services. Indianapolis, IN: Wiley Pub., c2009, s. 51. ISBN 978-0-470-22910-1.
46
5.2.2. Metody uživatelského výzkumu
Stěžejními metodami pro uživatelský výzkum v rámci designovém procesu jsou metody
kvalitativního výzkumu.1 2 9
Cooper tento fakt vysvětluje tím, že komplexnost a proměnnost
lidského chování nelze reprezentovat ve formě absolutního čísla. Tedy ve formě, kterou typicky
přináší kvantitativní výzkumné metody.1 3 0
Mezi nástroje kvalitativního výzkumu podle Coopera
patří například:1 3 1
• rozhovory se stakeholdery
• rozhovory s experty v dané oblasti (tématu)
• rozhovory se zákazníky a uživately
•pozorování a etnografické terénní studie
• využití a vyhodnocení dostupné literatury
• auditproduktu, prototypu a konkurence
Metody designového výzkumu vycházejí z technik převzatých z oblastí jako např. antropologie
a společenské vědy. Cooper však dodává, že designéři sami přicházejí s novými výzkumnými
metodami k ponávání chování uživatelů. V porovnání s výše uvedenými oblastmi (sociální vědy,
antropologie, atd.) mají tyto metody značně pragmatický cíl - pomocí nich poznat uživatele a
vytvářet produkty, které lépe vyhovují jejich potřebám. 1 3 2
Podobnou názorovú shodu najdeme i u K i m Goodwin, která říká, že je značný rozdíl mezi
výstupy kvalitativního a kvantitativního výzkumu. Obě výzkumné metody však mají své
uplatnění:
• kvantitativní metody odpovídají na otázku kolik, jak moc
• kvalitativní metody slouží k např. poznávání chování uživatelů, jak přemýšlejí, jaké mají cíle1 3 3
1 2 9
viz COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design.
[3rd ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 50. ISBN 978-0-470-08411-3. nebo
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA: New
Riders, 2010, s. 75 Voices that matter. ISBN 978-0-321-64339-1.
1 3 0
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 50. ISBN 978-0-470-08411-3.
1 3 1
Ibid. s. 52. Vlastní překlad autora práce. Původní znění:
• Stakeholder interviews
• Subject matter expert (SME) interviews
' User and customer interviews
• User observation/ethnographicfieldstudies
• Literature review
• Product/prototype and competitive audits
1 3 2
Ibid. s. 50
13 3
Ibid.
47
Následující tabulka od K i m Goodwin zobrazuje výběr konkrétních nástrojů kvalitativního a
kvantitativního výzkumu a jejich vhodné použití.
Vhodné pro Nevhodné pro
kvantitativní měření
konkrétních úkolů
odvození detailních
návrhových zásad. Například
o jak velká dotyková plocha
by měla být za určitých
okolností
pochopení co navrhnout (jaký
produkt) nebo jak by se měl
chovat
průzkumy poznání demografie trhu
pochopení co navrhnout (jaký
produkt) nebo jak by se měl
chovat
focus groups
- rychlá zpětná vazba k
životaschopnosti produktu
- estetika produktu
poznání chování uživatelů
a rozdílu mezi uživateli
uživatelské testování
prokázání existence
problému
pochopení co navrhnout (jaký
produkt) nebo jak by se měl
chovat
individuální rozhovory
pochopení jak uživatelé
přemýšlí
získání podrobností o chování
uživatelů a omezení tzv. selfreporting
error
pozorování
poznání, jak se lidé chovají v
kontextu používání produktu
interpretace chování a
pochopení jak lidé přemýšlejí
rozhovor + pozorování
poznání, jak se lidé chovají v
kontextu používání produktu
a proč
poznání demografie trhu
Tabulka 4: Srovnání nástrojů kvalitativního a kvantitativního výzkumu134
V tabulce ¥ se v případě individuálních rozohovorů vyskytuje pojem self-reporting error. K i m
Goodwin tímto termínem popisuje stav, kdy lidé nepodávají pravdivé informace. Nejedná se
však o vědomou lež, ale zkreslení informací na základě vlastního úsudku o svém chování a
návycích. Tento stav je ovlivněn také tím, co (a jak) si pamatujeme.1 3 5
1 3 4
Vlastní překlad autora práce. Převzato z GOODWIN, Kim. Designingfor the digital age: how to create humancenteredproducts
and services. Indianapolis, IN: Wiley Pub., c2009, s. 57. ISBN 978-0-470-22910-1.
135 Ibid. s. 55
48
Pro srovnání s tabulkou nástrojů od K i m Goodwin uvádím také přehled nástrojů kvalitativního a
kvantitativního výzkumu, které jsou ve fázi poznávání používány v designovém procesu
projektu Libdesign. i^e Tento designový proces a jeho metody využívá i Ústřední knihovna
Filozofické fakulty Masarykovy univerzity. V rámci této diplomové práce jsou vybrané metody
a nástroje použité v praktické části.
Nástroj Vhodné pro
výzkum od stolu rychlé získání informací
dotazníky získání velkého počtu názorů v krátkém čase
anketa rychlá zpětná vazba
pozorování zjištění toho, co uživatelé neříkají
stínování vcítění se do uživatele
mystery shopping získání nezaujatého pohledu
deníky poznání světa uživatelů
hloubkový rozhovor získání detailního pohledu
kontextový rozhovor zjištění aktuálních pocitů uživatele
focus group získání hlubších názorů od více lidí zároveň
world café zapojení uživatele do inovací
graffiti walls kreativní sběr zpětné vazby
chci, aby tady... poznání co si uživatelé přejí
brainstorming získání velkého množství nápadů
Tabulka 5: Nástroje používané ve fázi poznávání v rámci designového procesu Libdesign
Z výše uvedených příkladů je zřejmé, že použití nástrojů a metod kvalitativního a
kvantitativního výzkumu v rámci designového porcesu není nijak pevně stanoveno. Odvíjí se
především od typu projektu, produktu, zvyků a znalostí designera. Výběr výzkumné metody
ovlivňuje také to, jaká data o uživatelích potřebujeme získat.
1 3 6
V případě Libdesignuje designový proces rozdělen do čtyř fází: 1. Poznávání - 2. Analýza - 3. Tvorba - 4.
Testování viz Libdesign: Odkisku pro knihovníky [online]. 2016 [cit. 2018-03-20]. Dostupné z: http://
libdesign.kisk.cz
1 3 7
Ibid.
49
5.3. Modelování uživatelů
Uživatelské modely jsou široce používaným způsobem, jak zpracovávat a následně prezentovat
data získána v rámci uživatelského výzkumu. Vizualizují a zjednodušují komplexní struktury
odhalené při výzkumu, vztahy mezi zkoumanými subjekty, jejich potřeby, chování a cíle. Těm je
na základě vytvořených modelů snazší porozumět a pracovat s nimi.i38 Jejich značným přínosem
je také usnadnění synchronizace a zapojení členů napříč celým týmem. Díky výsledné vizuální
reprezentaci a atraktivnímu (až kreativnímu) pojetí modelů lze předcházet případným sporům a
nedorozumněním při realizaci projektu.
V následujících podkapitolách se věnuji popisu rozdílných způsobů, jak přistupovat k
modelování uživatelů na základě získaných dat a významu těchto modelů pro pochopení
uživatelů, jejich návyků, cílů a také jejich významu a uplatnění v rámci designového procesu.
5.3.1 Persony
Persony jsou populárním nástrojem pro modelování uživatelů, ať už navrhujeme webové
stránky, aplikace nebo služby. Persona je modelovou reprezentací uživatelů - archetyp toho,1 3 9
kdo bude výsledný produkt nebo službu používat (nebo naopak nebude 1 4 0
). Tvorba person je
založena na datech získaných z předchozího uživatelského výzkumu. Persona představuje
soubor chování, tužeb, obav, cílů a příběhů uživatelů. Tyto informace jsou syntetizovány a
ilustrovány v podobě konkrétní osoby.
Forma a podoba tohoto modelu dovoluje designérovi, a také celému týmu, soustředit se na jejich
naplnění, protože tato persona má v tu chvíli konkrétní vlastnosti a je možné se s ní identifikovat
a sžít. Díky tomu přestáváme pracovat jen s těžko uchopitelným anonymním segmentem trhu s
definovaným vlastnostmi a chováním.
1 3 8
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 76. ISBN 978-0-470-08411-3.
139 Ibid.
1 4 0
Tzy. negativní personu zmiňuje například Jan Řezáč ve své knize Web ostrý jako Břitva na straně 95.
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 95. ISBN 978-80-270-0644-1.
50
Proto je důležité, aby každá persona obsahovala také fotografii. Ať už uživatele, který byl
součástí výzkumu nebo takovou, která jej nejlépe reprezentuje.1 4 1
Pro ilustraci se podívejme na obrázek 8, kde jsou vybrány ukázky dvou různých přístupů k
tomu, jak může ve finále persona vypadat. Nutno říct, že formálně jsou obě persony správně.
Díky detailnímu popisu a především realistické fotografii si zřejmě vytvoříme větší pouto k
personě od K i m Goodwin. Proto také Goodwin doporučuje využívat u person co nej věrnější
fotografie namísto třeba ilustrací. 1 4 2
P E R S O N A 4 — V Ě D E C ( D I G I T Á L N Í )
Adam, 32 let
Doktorand na Univerzitě Tomáše Bati ve Zliné
Knihovnu používá primárné k vědeckým účelům
— je registrován v univerzitní knihovne
a v Národní knihovně. Tráví téměř cely den
„Nechci tahat knížky, chci mít všechno v počítači."
Dostat se k nejnovéjšim odborným článkům
a dalším zdrojům z CR. alf hlavne z;
zahraničí
Mít možnost v odborných materiálech
vyhledávat a jednoduše kopírovat
Mit potvrzené, že kniha nebo článek má
dostatečnou odbornou úroveň (odborne,
ale i Bene recenze)
Získat citace podle různých norem přímo
do schránky bez nutnosti vybírat text
Najit stejný zdroj i vjiné formě (ke knize
e-hnihu apod.)
Mit seznam předvybranych položek na
jednom místě
Pracovat s elektronickými dokumenty
Sehnat recenze k vybraným knihám (Google
Books apod.)
Hledat v jiných knihovnách (Souborný
katalog) a to i v zahraničí
Používat specializované databáze
Stahuje si do adresářů materiály podle
témat (hlavné ve formátu PDF)
Používa rozšířené vyhledávaní (většinou
autor, rok vydaní, někdy nakladatel)
Relevantní výsledky vyhledáváni otevírá d
nových záložek
Hlavné zahraniční zdroje vyhledává prostřednictvím
ověřených nakladatelů
• Udržet si při rešerši v tématu přehled,
v jakých zdrojích co hledal
• Najit potřebné podklady co nejrychleji
• Rychle získat položku bez registrováni.
Uvítal by jednorazovou platbu (napr. prostřednictvím
SMS)
• Jednoduše procházet a objevovat zajimav
podtémata v jeho oboru
Obrázek 8: Příklady různých podob výsledné persony uživatele vlevo
ukázka persony použité v rámci případové studie potálu Knihovny, cz143
vpravo pak ukázka velice detailní persony od Kim Goodwin 1 4 4
1 4 1
Mohlo by se zdát, že vybrat fotografii dané persony je jednoduchý úkol, který obnáší získat fotku některého z
respondentů nebo ji stáhnout z internetu. Pokud chcete do problematiky tvorby person proniknout opravdu detailně,
doporučuji knihu od GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and
services. Indianapolis, IN: Wiley Pub., c2009. ISBN 978-0-470-22910-1. Ta se na téměř 70 stranách věnuje tvorbě
a významu peson, včetně toho, jak by měla vypadat ideální reprezentativní fotografie.
1 4 2
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009. s. 281. ISBN 978-0-470-22910-1
1 4 3
převzato z CULEN, Alma Leora, Jan DELONG, Andrea Alessandro GASPARINI, Roman NOVOTNÝ, Pavla
MINARIKOVA a Ladislava ZBIEJCZUK SUCHÁ. Knihovníci jako designéři: případové studie o zlepšování
služeb v knihovnách. Brno: Masarykova univerzita, 2016, s. 46. ISBN 978-80-210-8358-5.
1 4 4
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009. s. 230-231. ISBN 978-0-470-22910-1
51
V rámci jednoho projektuje zpravidla použito několik person, ale v těchto případech je nutné si
prioritizovat jejich význam pro samotný návrh. Je tedy důležité stanovení primární persony,
tedy té, pro kterou navrhujeme primárně a sekundární persony, která bude produkt nebo službu
také využívat, ale může vykazovat mírně rozdílné požadavky (například může jít o zkušenějšího
uživatele, který může požadovat například vyšší míru přizpůsobivosti produktu/služby podle
svých potřeb).1 4 5
K i m Goodwin popsala rozhodovací proces pro určení primární a sekundární persony takto:1 4 6
„Pokud navrhujete nejdříve pro personu A, persona B bude víceméně spokojená, ale
persona C bude nespokojená. Pokud však nejdříve navrhujete místo toho pro personu B,
persony A a C budou taktéž spokojené. Vtom případě je persona B lepší kandidát. " 147
Rozhodování však může být vždy ovlivněno i dalšími faktory a vždy tedy bude záležet na
konkrétním produktu a kontextu používání. Goodwinová však dodává, že rozpočet a čas, by
neměl být, až na opravdové výjimky, rozhodujícím fakorem. 1 4 8
5.3.2. Proto-persony
Pokud chceme v rámci projektu pracovat s personami, je potřeba mít dostatečný čas a rozpočet
na provedení uživatelského výzkumu.1 4 9
Pokud některá se dvou zmíněných položek chybí, tedy
projekt je realizován v krátkém časovém úseku, s nízkým rozpočtem nebo se nedokážeme dostat
k relevantním uživatelům, lze využít tzv. proto-persony.
1 4 5
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009. s. 276. ISBN 978-0-470-22910-1
i« Ibid. s. 277
1 4 7
Vlastní překlad autora. Původní znění: „For example, ifyou designfirstfor personaA, persona B will be mostly
happy, butpersona C will be unhappy. Ifyou designfirstfor persona B instead, personasA and C will mostly be
happy, so persona B is better candidate. "
1 4 8
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009. s. 277. ISBN 978-0-470-22910-1
1 4 9
Ibid. s. 277
52
K i m Goodwin namísto termínu proto-persony1 5 0
používá termín „dočasné persony"151
a ty jsou
založené na tom, že získáte dostatečné informace a hypotézy od stakeholderů projektu a expertů
na danou oblast, které v týmu nebo projektu máte. Výsledkem tohoto procesuje to, že existuje
alespoň určitá představa o uživateli a zároveň tím dochází ke sjednocení charakteristik a cílů,
které budou ovlivňovat samotný návrh.1 5 2
Z definice tak vyplývá, že se jedná o modelování
uživatelů na základě dat a zkušeností, které již máme k dispozici s tím, že výsledná protopersona
neobsahuje natolik detailní charakteristiky a to včetně fotografie.
Katie
• amatérská fotografka s
poloprofesionálním fotoaparátem, který
J k ale plně neovládá (především expozici)
J 1 • 100-300 makro fotografií a krajin za jednu
1 1 vycházku
f Cíle
• být schopná vyfotit to co „vidí"
• užít si krajinu
1 • cítit se jako opravdová fotografka
Obrázek 9: Přiklad proto-persony 153
Pro srovnání přístupu k proto-personám se podívejme na jejich definici a co o nich říká Jan
Řezáč ve své knize Web ostrý jako břitva:
,,(...) jsou založeny na vaší fantazii v kombinaci s libovlnými daty, která máte o
uživatelích. Proto-persony jsou lepší než nic - klient a tým přestane částečně uvažovat
nad tím, jak to má on, ale empaticky se pokusí vcítit do budoucích návštěvníků webu. " 154
1 5 0
S termínem proto-persona se setkáme například v Řezáčově knize Web ostrýjako břitva. ŘEZÁČ, Jan. Web
ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání druhé. Brno: House of
Řezáč, 2016, s. 95. ISBN 978-80-270-0644-1.
1 5 1
Vlastní překlad autora. Původní znění „Provisional Personas" GOODWIN, Kim. Designingfor the digital age:
how to create human-centeredproducts and services. Indianapolis, IN: Wiley Pub., c2009, s. 294. ISBN
978-0-470-22910-1.
1 5 2
Ibid.
1 5 3
Ibid. Vlastní překlad a úprava autora práce.
1 5 4
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 95. ISBN 978-80-270-0644-1.
53
Při vytváření proto-person a především pak při jejich použávání v rámci designového procesuje
nutné pamatovat na jejich limity a ilustrativní charakter, založený na hypotézách a předchozích
zkušenostech designérů. Snahou by mělo být, pokud to projekt umožní, v dalších fázích použité
proto-persony měnit na základě dílčích poznatků nebo úplně nahradit personami založenými na
uživatelském výzkumu, jak se shodují například K i m Goodwin1 5 5
a Jan Řezáč.1 5 6
5.3.3. Uživatelské role
Uživatelské role nebo model rolí je definován vztahem mezi určitou skupinou uživatelů a jejich
problémy, potřebami, zájmy a vzorci chování. Uživatelské role v sobě, narozdíl od person,
nemají definované lidské motivace nebo kontexty ve kterých se pohybují a nepředstavují
konkrétní osoby.1 5 7
K i m Goodwin uživatelské role popisuje jako ,,(•••) konstrukt ze světa
podnikového softwaru, ve kterém se systémová oprávnění liší podle popisu práce a úrovní
autority, "iss Pro ještě lepší pochopení toho, co vlastně uživatelská role představuje, poslouží
příklad tento příklad od Coopera:
Pokud navrhujete webové stránky pro automobilovou společnost, tak role „kupující
automobilu" je, jako designový nástroj, bezvýznamná, protože různí lidé se v této situaci
chovají velmi odlišně. "159
5.3.4. Uživatelské profily
Uživatelské profily bývají dle Coopera založeny jen na bázi stereotypů dané demografické
skupiny. Nejsou proto vhodné jako hlavní nástroj pro modelování konkrétních uživatelů.1 6 0
1 5 5
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009. ISBN 978-0-470-22910-1.
1 5 6
ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, ISBN 978-80-270-0644-1.
1 5 7
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials ofinteraction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007. s. 84. ISBN 978-0-470-08411-3.
1 5 8
Vlastní překlad autora práce. Původní znění:,,(...) constructs in the world ofenterprise software, where system
permissions differ based onjob descriptions and levels ofauthority. " GOODWIN, Kim. Designingfor the digital
age: how to create human-centeredproducts and services. Indianapolis, IN: Wiley Pub., c2009, s. 237. ISBN
978-0-470-22910-1.
1 5 9
Vlastní překlad autora práce. Původní znění: „Ifyou 're designing a Web sitefor a car company, "car buyer" is
meaningless as a design tool — differentpeople approach the task in very different manners. "
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials ofinteraction design. [3rd ed.].
Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007. s. 85. ISBN 978-0-470-08411-3.
1 6 0
Ibid. s. 85.
54
Zároveň Cooper uporňuje na fakt, že uživatelský profil a persona mohou být v některých
případech užívány jako synonyma. Coopera říká, že v momentě kdy, tento profil naplňuje
parametry persony, je tato záměna akceptovatelná.1 6 1
5.3.5. Tržní segmenty162
Tržní segmenty nebo také cílové skupiny (marketingové persony) jsou pojmem známým
především v marketingu. Jsou definovány typicky na základě demografických údajů a případně
svým nákupním chováním. Zatímco persona je reprezentována konkrétním člověkem, tržní
segmentem je reprezentován pouze informací typu muži ve věku 30 let, se zájmy o internet. Na
základě těchto statistik a dat tak dokážeme určit velikost těchto segmentů a jakými kanály se k
nim dostat, ale nelze vůbec říct, jaké potřeby, motivace a očekávání jsou v tomto segmentu
zastoupena a zdaje případný návrh řeší/naplňuje.1 6 3
mohou mít vždy mají mohou mít
Velikost
a hodnota
segmentu
Dovednosti,
postoje
a chování
Mentální modely
a cíle
mohou mít vždy mají vždy mají
Obrázek 10: Ukázka překrytí některých atributů a vlastnosti mezi personami a
trřními segmenty 164
1 6 1
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007. s. 85. ISBN 978-0-470-08411-3.
1 6 2
Pokud se rozhodnete sáhnout po knize Web ostrýjako břitva (Řezáč, 2016, s. 95), autor zde používá
termín „segmenty" a popisuje je jako ,,(...) skupiny uživatelů vašeho webu, kteří majípodobné charakteristiky."
1 6 3
COOPER Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 86. ISBN 978-0-470-08411-3.
164 Vlatní překlad autora práce. Převzato z GOODWIN, Kim. Designingfor the digital age: how to create humancenteredproducts
and services. Indianapolis, IN: Wiley Pub., c2009, s. 237. ISBN 978-0-470-22910-1.
55
6.4.6. Mentální modely a standardy
Mentální modely jsou, tak jak je popisuje Indi Young v knize Mentální Modely165
, hybridní
metodou modelování, která využívá kvalitativní přitup k reprezentaci dat, ale kromě tohoto
vědeckého přístupu pracují navíc s intuicí designéra a týmu. Uplatnění nachází především v
prostředí, kde je potřeba podpořit intuitivní rozhodnutí daty. Young doslova říká, že mentální
modely „(...) jsou enormně užitečné v prostředí, kde týmy dokáží definovat a komunikovat
design produktu nebo informace více intuitivními technikami jako jsou storyboardy, komiks nebo
video. "166
Pojem a využití mentálních modelů uživatele vychází z poznatků kognitivní psychologie.
Mentální model většinou nepopisuje skutečný stav věcí, ale je založen na tom, jak uživatel
vnímá daný systém, co o něm ví nebo si myslí, že v í . 1 6 7
Tento mentální model se u každého liší,
protože je ovlivněn individuální zkušeností a chováním. Úkolem designera je v tomto případě na
základě získaných dat pochopit, jaké mentální modely uživatelé používají, jak dané věci
popisují a hledat v nich opakující se vzorce.1 6 8
Podle Saffera je dobrý mentální model navržený
tak, že dovoluje hluboké pochopení dané věci bez nutnosti znát komplexnost prostředí (nebo
vlivů), které jsou pro fungování potřebné. 1 6 9
Saffer říká, že vnitřní pochopení toho jak systém funguje je ovlivněno návrhem designera ve
formě návodnosti, zpětné vazby nebo očekáváteInosti dalších kroků.110
Zároveň dodává, že
specifickým použitím těchto prvků, může designer výrazně manipulovat a ovlivňovat podobu
mentálních modelů uživatele.
165 YOUNG, Indi. Mental models: aligning design strategy with human behavior. Brooklyn, N.Y: Rosenfeld
Media, c2008, s.ll. ISBN 1-933820-06-3.
166 Vlastní překlad autora. Původní znění: „// is enormously useful in environments where teams can define and
communicate product/information design with more intuitive techniques such as storyboards, comics, or videos. "
Ibid. s. 11
1 6 7
Nielsen ve svém článku doslova říká, že mentální modely jsou založeny na víře, ne faktech, viz NIELSEN,
Jakob. Mental Models. Nielsen Norman Group [online]. 2010 [cit. 2018-03-01]. Dostupné z: https://
www.nngroup.com/articles/mental-models/
1 6 8
NIELSEN, Jakob. Mental Models. Nielsen Norman Group [online]. 2010 [cit. 2018-03-01]. Dostupné z: https://
www.nngroup.com/articles/mental-models/
1 6 9
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 133. Voices that matter. ISBN 978-0-321-64339-1.
1 7 0
Vlastní překlad autora. Původní znění: affordances, feedback andfeedforward op. cit s. 133
56
Safferův příklad jak pochopit fungování mentálního modelu:
„Například nápis na volantu vozu s nápisem „Použijte klakson před nastartováním
vozu " může výrazně ovlivnit to, jak přemýšlíme nad fungováním vozu a speciálně pak
významu klaksonu. "171
K tématu mentálních modelů lze navázat problematiku standardů a návrhových vzorů (viz
kapitola 5.4.4. Návrhové vzory). Z a standard považujeme to, co je obecně uznávaným názorem
nebo normou v dané oblasti. Saffer upozorňuje, a odkazuje se také na Alana Coopera1 7 2
, že
snaha porušovat standardy neboje měnit musí být vždy prováděny s velkou opatrností, protože
uživatel má již nějaká očekávání a ty jsou narušena. Výsledkem může být frustrace uživatele
nebo znepříjemnění používání produktu. 1 7 3
O standardech resp. konvencích mluví i Steve Krug, který v případě webů říká, že tyto konvence
usnadňují a urychlují orientaci na dané stránce. Typicky mezi tyto konvence patří například to,
že nadpis je obvykle reprezentován výraznějším a větším písmem a shrnuje v rámci krátké věty
obsah nebo téma článku.1 7 4
6.4.7. Afinitní diagramy
Afinitní diagramy jsou způbob, jak vizualizovat informace. Při použití afinitních diagramů jsou
informace kategorizované do souvisejících příbuzných celků. V některých případech bývá
afinitní diagram vlastím mentáním modelem uživatelů. 1 7 5
1 7 1
Vlastní překlad autora. Původní znění: „For example, a label on a car's steering wheel that reads, "Blow horn
before starting car" would certainly change how you think about thefunctionality of the car, and especially the
horn. " op. cit. s 133
172 COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007. ISBN 978-0-470-08411-3.
1 7 3
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 134. Voices that matter. ISBN 978-0-321-64339-1.
1 7 4
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s. 34. ISBN 0-321-34475-8.
1 7 5
YOUNG, Indi. Mental models: aligning design strategy with human behavior. Brooklyn, N.Y.: Rosenfeld
Media, c2008, s.3. ISBN 1-933820-06-3.
57
večere
omáčka
suché plody
ořechy brusinky
zelenina
fazole brambory
salát brokolice
paprika
chlazené výrobky
jogurt vejce
Obrázek 11: Ukázka afmitiního diagramu na příkladu nákupního seznamu 17
6
5.4. Navrhování - od skici po prototyp
Tato část kapitoly se věnuje procesu navrhování od úvodních ručně kreslených skic, které slouží
k vyjádření prvnotních ideí, přes drátěné modely k následnému prototypu.
5.4.1. Skicování
Skicování je, jak říká K i m Goodwin, základním nástrojem designera pro vizuální vyjádření
myšlenek a nápadů. A to především při spolupráci v týmu. 1 7 7
A to především z toho důvodu, že
je to pro člověka poměrně přirozený a intuitivní způsob vyjadřování, narozdíl o využití
programů. Je také velice rychlý a to i v rámci iterací nápadů, protože neklade žádné nároky na
preciznost ztvárnění.
K i m Goodwin také zmiňuje další benefit skicování a to ten, že díky své formě se u ručního
skicování lze vyhnout přílišnému soustředění na detaily, které v danou chvíli nemusí být vůbec
podstatné a mohou tak designera nebo tým rozptylovat.
176 YOUNG, Indi. Mental models: aligning design strategy with human behavior. Brooklyn, N.Y.: Rosenfeld
Media, c2008, s.3. ISBN 1-933820-06-3.
1 7 7
GOODWIN, Kim. Designingfor the digital age: how to create human-centeredproducts and services.
Indianapolis, IN: Wiley Pub., c2009, s.380. ISBN 978-0-470-22910-1.
58
Obrázek 12: Ukázka úvodní skicy rozložení webové stránky. Autor: Ondřej Honel
5.4.2. Drátěné modely (Wireframe)
Wireframe a jeho význam si lze nejsnadněji představit jako technický výkres (dokumentaci),
kterou známe z oblastí jako strojírenství nebo stavitelství a jsou typickou součástí při navrhování
webových stránek nebo aplikací.1 7 8
Ukazuje a popisuje funkcionalitu, informační strukturu a
hierarchii jednotlivých objektů (jako jsou tlačítka, fotky, video) a textového obsahu, který má
být na stránce zobrazený. Zpravidla neobsahují žádné vizuální grafické prvky a veškeré objekty
jsou reprezentovány jako základní tvary v odstínech šedi. Je to především proto, aby bylo možné
se soustředit na funkčnost návrhu bez rušivých elementů, kterými v této fázi jakákoliv grafická
úprava (tzn. použití barev, fotografií, atd.) může být. Použité texty často nebývají reálné nebo se
používají různé formy výplňových textů jako je lorem ipsum. Zde však například Řezáč
doporučuje používat co nejvěrnější texty, ideálně takový, který bude sloužit jako základ pro
copywritera při vytváření finálních textů. V některých případech dopručuje jako možnou
variantu i texty konkurence.1 7 9
1 7 8
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 151. Voices that matter. ISBN 978-0-321-64339-1.
1 7 9
REZÁC, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 118. ISBN 978-80-270-0644-1.
59
Úkolem designéra je v této fázi interpretace drátěného modelu celému týmu. Samotný
wireframe může být jak ve formě papírové tak interaktivní, kde je možné se
wireframem „proklikat" a vyzkoušet tak i návaznost jednotlivých kroků/stránek a jejich
interakcí s uživatelem. N a základě wireframu následně vývojáři staví celou funkcionalitu
systému a grafický designer navrhuje vizuální podobu. Po této fázi zpravidla následuje výroba
prototypu a jejcih testování.
Traveling is Easier
than You think.
Obrázek 13: Ukázka možné podoby drátěného modelu (převzato od InvisionApp)180
5.4.3. Prototyp
Dan Saffer o prototypu mluví jako o fázi, kdy se veškeré části designu spojí do jedné fungující
jednotky a dodává, že také mnoho lidí má problém s tím, představit si nebo pochopit finální
design dříve, než jej uvidí ve formě prototypu. 1 8 1
Stejně jako jiné formy modelů nebo diagramy
je dle Saffera prototyp pouze dalším nástrojem, který slouží pro komunikování designové
myšlenky. Saffer říká, že prototyp předává zprávu - „ Takto by to mohlo být. " 1 8 2
180 y tomto blogovém příspěvku lze najít ukázky několika různých typů drátěných modelů
HILLERY. 12 Wireframes examples from some of our favorite ux designers. Invisionapp.com [online]. 2017 [cit.
2018-03-26]. Dostupné z: httpsV/www.invisionapp.coni'blog/wireframe-examples/
1 8 1
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 174. Voices that matter. ISBN 978-0-321-64339-1.
1 8 2
Vlastní překlad autora. Původní znění: „ Prototype communicate the message "This is what it could be like"."
Forma prototypu je vždy závislá na zdrojích, které má designer k dispozici a také na tom, o jaký
produkt nebo službu se jedná. Prototyp tedy dle situace může být ve formě papíru, kartiček nebo
digitální s velice omezenou funkcionalitou - jedná se o tzv low-fidelity prototype, - čili
prototypy s nízkou věrností. Opakem je tzv. high fidelity prototype, tedy prototyp s vysokou
věrností, které v podstatě velice věrně simulují vlastnosti finálního produktu. Saffer k tomuto
rozdělení říká například to, že prototypy s nízkou věrností slouží pro představení obecného
konceptu, formy nebo některých úkonů, tak v případě prototypu s vysokou věrností je již nutná
značná časová investice a jeho forma by měla obsahovat co možná nejvíce detailů - chování,
vizuální design, interakce. 1 8 3
Obrázek 14: Ukázka prototypu s nízkou věrností a vysokovou věrností (převzato z Adobe Blog) 184
Saffer také dodává, že čím věrněji prototyp znázorňuje finální podobu produtku, tím lepší je
zpětná vazba v rámci testování od uživatelů.1 8 5
Zároveň upozorňuje na riziko toho, že může
docházet ke zmatení na straně uživatele nebo klienta v tom, že mohou nabít dojmu, že se jedná o
finální produkt.1 8 6
1 8 3
SAFFER, Dan. Designingfor interaction: creating innovative applications and devices. 2nd ed. Berkeley, CA:
New Riders, 2010, s. 174-180. Voices that matter. ISBN 978-0-321-64339-1.
184 Prototyping 101: The Difference between Low-Fidelity and High-Fidelity Prototypes and When to Use Each.
Adobe Blog [online], [cit. 2018-03-10]. Dostupné z: https://theblog.adobe.com/prototyping-difference-low-fidelity-
high-fidelity-prototypes-use/
1 8 5
Například tento článek se věnuje vlivu zvolené formy prototypu na výsledky uživatelských testů
SAURO, Jeff. DOES THE FIDELITY OF A PROTOTYPE AFFECT RESULTS?. MeasuringU [online]. 2017 [cit.
2018-03-20]. Dostupné z: https://measuringu.com/prototype-fidelity/
1 8 6
op.cit. 180
61
Výhody a nevýhody obou typů prototypů shrnuje Helen Sharp v tabulce 6.
Typ prototypu Výhody Nevýhody
• nižší náklady na výrobu • omezená kontrola chyb
• evaluace více designových • málo detailní specifikace pro
konceptů vývojáře
• odhalení probémů s • nutné řízení testování
low-fidelity rozložením např. obrazovky facilitátorem
(layoutu) • omezení v rámci testu
• užitečný komunikační nástroj použitelnosti
• identifikace požadavků trhu • omezená navigace a
• ověření konceptu uživatelské flow
high-fidelity
• pokročilá nebo plná
funkcionalita
• plně interaktivní
• uživatelsky řízený (user-driven)
• jasně definuje navigační
scéma
• vzhled a pocit finálního
produktu
• slouží jako živá specifikace
• marketingový a prodejní
nástroj
• nákladnější a časově
náročnější výroba
• evaluace více designových
konceptů
• neefektivní pro ověření
konceptu designu
• neefektivní pro sběr
požadavků na produkt
Tabulka 6: Přehled typů prototypu, jejich výhod a použití
5.4.4. Návrhové vzory
Designer nemusí vždy nutně hledat nová řešení konkrétních problémů, pokud to není nezbytné.
Pro tyto případy existují tzv. návrhové vzory. Jedná se v podstatě o knihovny existujících
interakčních prvků, které jsou jednoduše replikovatelné. Vychází z toho, že množství interakcí
již uživatel ze svého prostředí a jiných systémů zná a proto jejich použitím minimalizujeme
nejen to, že bude uživatel zmatený, ale především to, že by se musel v novém prostředí učit
orientovat a používat jej. Typickým příkladem j sou nej různější dialogová okna, ikony jako třeba
koš, atd. Ne vždy však řešení, které je považováno za běžné, musí dávat smysl (je správně) a
mělo by být podrobeno kritice v kontextu použití nebo času. Cooperiss tuto situaci ilustruje na
příkladu dialogového okna při ukládání změn provedených v určitém dokumentů viz Obrázek
15.
1 8 7
Vlastní překlad autora práce. Převzato z SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction
design: beyond human-computer interaction. 2nd ed. Hoboken, NJ: Wiley, c2007, s. 536. ISBN
978-0-470-01866-8.
1 8 8
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 210. ISBN 978-0-470-08411-3.
62
O tomto dialogovém okně mluví doslova jako o ,,(...) nejzbytečnějším dialogovém okně ve světě
grafického uživatelského rozhraní. Toto dialogové okno by se nemělo vůbec používat. " 1 8 9
Protože dle něj víc než o čemkoliv jiném informuje, resp. nutí uživatele, aby chápal, že tento
úkon má vliv na paměť a úložný prostor (pevný disk) počítače.1 9 0
Obrázek 15: Dialogové okno pro potvrzení uložení změn v dokumentu191
Samotný koncept návrhových vzorů (designových patternů) má svůj původ v architektuře a
poprvé je popsal Christopher Alexander. Návrhové vzory mají v tomto případě za cíl definovat
nejčastější problémy a jejich řešení, se kterými se architekti potýkali. Jedná se o tzv. „best
practices", které je možné v daných situacích bez obtíží aplikovat.1 9 2
Využívání návrhovách
vzorů tak usnadňuje práci a šetří čas nejen designérům, ale také vývojářům, kteří výsledné
návrhy implementují.
5.5 Uživatelské testování návrhu
Uživatelské testování je důležtou součástí designového procesu a mělo by v ideálním případě
probíhat ve všech jeho fázích - tzn. již od fáze ideace a návrhů až po fázi testování prototypu.
Na základě uživatelského testování se designer ujišťuje, že jeho hypotézy a očekávání jsou
správná a zda se pomocí testovaného návrhu daří naplnit předem stanovené cíle uživatelů.
1 8 9
Vlastní překlad autora. Původní znění včetně vysvětlení Cooperova argumentu: „This is easily the most
unnecessary dialog box in the world of GUI. Of course, we want to save our work! It is the normal course ofevents.
Not saving it would be something out of the ordinary that should be handled by some dusty dialog box. This single
dialog box does more toforce users into knowing and understanding the useless and confusingfacts about RAM
and disk storage than anything else in their entire interaction with their computer. This dialog box should never be
used. " (Cooper, 2007, s. 210)
1 9 0
COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction design. [3rd
ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007, s. 210. ISBN 978-0-470-08411-3.
i'i Ibid.
1 9 2
FOLMER, Eelke. 41. Interaction Design Patterns. Interaction DesignFoundation [online], [cit. 2018-03-10],
Dostupné z: https://www.interaction-design.org/literato
interaction-design-patterns
63
Kromě testování použitelnosti samotných stránek nebo produktu můžeme testovat také
například jejich užitečnost, vizuální styl nebo přístupnost.1 9 3
Pro uživatelské testování lze využít takřka všechny dostupné výzkumné metody, se kterými
pracujeme i v rámci uživatelského výzkumu. Jednou výjimku v rámci použitých metod pro
uživatelské testování je využití tzv focus group o kterých Steve Krug, autor knihy Nenuťte
uživatele přemýšlet™ a zakladatel metodiky uživatelského testování, říká, že je v tomto případě
nevhodná. Krug toto tvrzení odůvodňuje tím, že díky tomu, že se jedná o interakci mezi
skupinou osob a dochází ke zkreslení dat v tom smyslu, že respondenti reagují jeden na druhého
a vzájemně se v názorech ovlivňují.1 9 5
Tudíž získáváme vícemnéně jen kolektivní hodnocení a
názory, což jak říká je užitečné v rámci úvodního uživatelskéh výzkumu, pokud chceme rychle
získat nějaké obecné stanovisko od naší cílové skupiny.
Velice dobře tuto potřebu individuálního uživatelského testování ilustruje obrázek, kde se Krug
věnuje ideálnímu počtu uživatelů v rámci jednotlivých kol testování. Vidíme v něm závislost
počtu testovaných uživatelů na počtu zjištěných problémů a vyřešenených problémů, které
produkt nebo stránka mají (viz obrázek 16).
1 9 3
Testování nebo lépe řečeno zjištění, zdaje produkt užitečný, by mělo probíhat již v prvních fázích projektu
(zmapování trhu a konkurence, definice cílové skupiny a rozhovory s ní), kdy je výrazně jednodušší a levnější
nápady a návrhy iterovat, případně projekt zastavit/zamyslet se nadjeho směřováním a výstupy. Zjistit, že produkt
je neužitečný znamená bufo vrátit se o několik kroků v procesu zpět nebo rovnou najeho začátek, což především v
prostředí businessu není rozhodně žádoucím stavem.
Přehled toho co vše lze na webu testovat ajak nalezneme například v knize Jana Řezáče Web ostrý jako břitva
ŘEZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání druhé.
Brno: House of Řezáč, 2016. ISBN 978-80-270-0644-1.
1 9 4
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006. ISBN 0-321-34475-8.
1 9 5
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s. 133. ISBN 0-321-34475-8.
64
Jeden test s osmi
uživateli
8 uživatelů
Osm uživatelů může v
jednom testování najít
značné množství chyb.
Tyto první odhalené a
většinou největší
problémy však
uživatelům nedovolí
najít další, které mohou
být více skryté.
Celkem odhalených
problémů: 5
První test:
3 uživatelé Tři uživatelé
nemusí najít
v jednom testu
odhalit tolik
problémů jako
v případě
testování s
osmi uživateli.
Druhý test:
3 uživatelé
Ale v druhém
testování, kde
jsou již nalezené
problémy
opravené,
mohou uživatelé
přijít na
problémy, které v
prvním testu
neviděli.
Celkem
odhalených
Droblémů: 9
Obrázek 16: Znázornění závislosti počtu odhalených chyb na počtu testovaných uživatelů a počtu
testovacích kol1 9 6
Stejně jako v případě uživatelského výzkumu je potřeba si pro uživatelské testování stanovit cíle
- j a k á data chceme získat. Tomu přizpůsobujeme formu testování a testovací scénáře.
Kromě uživatelských testů lze, v případě webových stránek a aplikací, provádět také
automatizované (online) testy přístuposti, které hodnotí, zda jsou stránky optimalizované z
pohledu toho, zda jsou s ohledem na zvolené barvy čitelné, dostatečně kontrastní, zdaje na ně
možný přístup i uživatelům se zrakovou vadou (nebo kompletní slepotou a tedy je možné je
přeložit pro jejich potřeby). Další možností jak testovat webové stránky a aplikace je využívání
nástrojů jako jsou Google Analytics, nejrůznější heatmapy, clickmapy a služby umožňující
nahrávání obrazovky, apod.Ty poskytují nejen kvantitativní, ale také kvalitativní pohled na data,
výkon a chování uživatelů.
1 9 6
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s. 139. ISBN 0-321-34475-8.
65
Na jejich základě dokážeme zjistit (odhadnout), jak se uživatelé na stránkách nebo v aplikaci
chovají - na co klikají, kam se vrací, jaká je jejich cesta napříč webem a samozřejmě také v
které části nejčastěji odcházejí.
5.5.1. Testování použitelnosti
V rámci testování použitelnosti například u webových stránek typicky zajímá to, zda uživatel na
webu nalezne, co hledá nebo vyřeší svůj aktuání problém kvůli kterému na daný web přišel a že
obsah webu je srozumitelný a intuitivní. Použitelnost můžeme například měřit s ohledem na čas,
za který je uživatel splnit na webu zadaný úkol a množství chyb, které při jeho plnění udělá.1 9 7
Testování použitelnosti resp. metodika jak testovat nejčastěji vychází z knihy Steva Kruga Don 't
make me think,198
na kterou se odkazuje množství autorů včetně již zmíněného Řezáče.
5.5.2. Testování užitečnosti
V rámci uživatelského testování se typicky nejvíce zaměřujeme na testování použitelnosti
například tak, jak jej popisuje Steve K r u g . 1 9 9
To, že je však stránka nebo produkt použitelná,
ještě nemusí nutně znamenat, že je pro uživatele také užitečná.
Pokud se tedy chceme na tento fakt zaměřit, doporučuje Řezáč v rámci uživatelského testování
použitelnosti zařadit také hloubkový rozhovor, kterým zjistíme, jak uživatel dané rozhraní
vnímá v kontextu jeho práce nebo cílů. 2 0 0
5.5.3. Testování grafického designu
Řezáč o testování grafického designu říká, že jeho cílem je zjistit, jak navržený vizuální styl
působí na cílovou skupinu a že tato forma testování má uplatnění především ve chvíli, kdy se
potřebujeme rozhodnout (nebo přesvědčit klienta), že je zvolený vizuální styl správný nebo se
rozhodujeme mezi více grafickými verzemi.
1 9 7
ŘEZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 168. ISBN 978-80-270-0644-1.
1 9 8
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006. ISBN 0-321-34475-8.
1 9 9
Ibid.
2 0 0
REZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, s. 136. ISBN 978-80-270-0644-1.
66
Samotné testování má potom dle Řezáče formu podobnou card sortingu, kdy účastníci testování
přiřazují návrhu kartičky s pojmy podle toho, jak na ně grafický design působí. Alternativně k
této metodě použít i systém škály hodnot od-do.™
Podle Kate Meyer jsou uživatelé více tolerantní k drobným problémům s použitelností v
případě, že je testované uživatelské rozhraní vizuálně přitažlivé. Tento jev Meyerová označuje
jako efekt estetické použitelnosti.101
Vzniká z toho důvodu, že lidé mají tendenci esteticky
přitažlivým produktům automaticky přiřazovat lepší vlastnosti. Jedná se však o zkreslení. Může
tak docházet k tomu, že nejsou některé problémy odhaleny. Meyer doporučuje při testování
uživateli pozorně naslouchat a sledovat. Důraz klade také na správnou interpretaci výsledků
testování.
2 0 1
ŘEZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. "Vydání
druhé. Brno: House of Řezáč, 2016, s. 52. ISBN 978-80-270-0644-1.
2 0 2
Vlastní překlad autora. Původní znění: „ aesthetic-usability effect"
MEYER, Kate. The Aesthetic-Usability Effect. Nielsen Norman Group [online]. 2017 [cit. 2018-01-04]. Dostupné
z: https://www.mgroup.com/articles/aesthetic-usability-effect/
67
6. Praktická část
V praktické části diplomové práce se zaměřuji na praktickou aplikaci konkrétních poznatku,
nástrojů a technik, které byly popsány v předchozí teoretické části. Výstupem této části je
interaktivní prototyp webové stránky - oborové microsite pro Ústřední knihovnu Filozofické
fakulty.
6.1. Specifikace a cíle projektu
Specifikaci projektu vytvořila Ústřední knihovna Filozofické fakulty Masarykovy univerzity na
základě jejich poznatků z praxe, rozhovorů se studenty, vyučujícími a personálem knihovny.
Návrh oborové microsite má pokrýt potřeby studentů, kteří nejsou spokojeni se stávající
podobou stránky ezdroje.muni.cz a kteří chtějí rychle a přehledně pracovat s elektronickými
informačními zdroji. Jedním z požadavků je, aby výsledný návrh reflektoval i to, že student
může absolvovat i víceoborové studium - tzn. studuje některou z předem daných kombinací
oborů, např. Teorie interaktivních médií a Genderová studia.203
Tento projekt vychází z aktivit,
které Filozofická fakulta definuje v rámci dokumentu Dlouhodobý záměr Filozofické fakulty
Masarykovy univerzity léta 2016-2020.204 Konkrétně se jedná o stratetické cíle a priority pro
oblast vzdělávání a také potřeby jednotlivých oborů.205
6.1.1. Cíl projektu
Cílem projektu je, na základě stanovených požadavků Ústřední knihovny Filozofické fakulty,
vytvořit funkční prototyp oborové microsite pro elektronické informační zdroje a to jak placené,
tak ty které jsou zdarma nebo z otevřených zdrojů. Tento prototyp má sloužit knihovně pro
následné uživatelské testování a to jak mezi studenty, tak zaměstnanci knihovny a vyučujícími.
Výsledný prototyp má zobrazovat vybrané oborové zdroje roztříděné do specifických kategorií
jako jsou databáze, ebooky, multimedia, atd. Vizuální styl stránky reflektuje současný vizuální
styl Filozofické fakulty potažmo Masarykovy univerzity.
2 0 3
Poznámka autora práce: Tato na první pohled možná banální podmínka má pro knihovnu význam především v
dlouhodobém horizontu v návaznosti na dokument o strategickém rozvoji Filozofické fakulty a akreditaci
víceoborových stodií.Knihovna chce tyto změny reflektovat už v současném návrhu a být na tyto možnosti
připravena, viz Dlouhodobý záměr Filozofickéfakulty Masarykovy univerzity na léta 2016-2020. Brno: Masarykova
univerzita, 2016. ISBN978-80-210-8301-1.
2 0 4
Dlouhodobý záměr Filozofické fakulty Masarykovy univerzity na léta 2016-2020. Brno: Masarykova univerzita,
2016. ISBN 978-80-210-8301-1.
2 0 5
Zde vycházím z informací, které poskytla přímo knihovna. V rámci diplomové práce nebyl prováděn výzkum
mezi garanty jednotlivých oborů v rámci Filozofické fakulty.
68
Stránka musí být dostatečně přehledná, aby student mohl co nejrychleji vyřešit svůj konkrétní
problém - tedy nalézt relevantní souhrn zdrojů pro své studium.
6.2. Metodologie
Metody a nástroje, které jsem v praktické části diplomové práce zvolil, vycházejí designového
procesu popsaného v rámci projektu Libdesign2 0 6
a mají sloužit k validaci výzkumné otázky a
hypotézy, které jsem si na začátku stanovil. Designový proces Libdesign se skládá ze čtyř fází:
1. Poznávání - 2. Analýza - 3. Tvorba - 4. Testování
Jednotlivé fáze procesu a využité metody jsem znázornil v tabulce 7. Fáze testování není v
tabulce zahrnuta, protože bude realizována Ústřední knihovnou a v rámci diplomové práce je
představen pouze koncept uživatelského testování. Designový proces popsaný v rámci
Libdesignu jsem zvolil z důvodu, že knihovna jej již sama využívá.
Poznávání Analýza Tvorba
výzkum od stolu Persony / proto - persony wireframe
dotazník moc kup
Tabulka 7: Využité metody a nástroje vjednotlivých fázích designového procesu podle Libdesign
Výzkumná otázka:
Jakým způsobem lze distribuovat elektronické informační zdroje na Filozofické fakultě
Masarykovy univerzity?
Hypotéza:
Pro distribuci elektronických informačních zdrojů je vhodným konceptem vytvoření oborově
brány.
Klíčová slova pro vyhledávání
• elektronické informační zdroje
• oborová brána
• subject gateway
206
Libdesign: Odkiskupro knihovníky [online]. 2016 [cit. 2018-03-20]. Dostupné z: http://libdesign.kisk.cz
^ 6 9
6.2.1. Desk research (výzkum od stolu)
Prvním krokem v designovém procesu je tzv. výzkum od stolu, kde se zaměřuji na hledání a
analýzu již existujících řešení a to jak v rámci Masarykovy univerzity tak dalších vysokých škol
v České republice a v zahraničí. Zajímá mě to, zda existují konkrétní oborové vstupní brány, ale
také jak jsou obecně elektronické informační zdroje distribuované pro potřeby studentů. Cílem
tohoto výzkumu je najít opakující se vzory, které se v případě již existujích řešení objevují. Jaká
je navigace na tomto typu webových stránek, jakou mají informační architekturu, k jakým
interakcím s uživatelem na stránkách dochází, jaký je obsah těchto stránek?
Tento výzkumu slouží pro potvrzení správnosti řešení, které jsem si na začátku vytyčil.
Výstupem má být kritické zhodnocení těchto poznatků a jejich případné zakomponování nebo
vyloučení v následném procesu návrhu wireframů resp. prototypu. Cílem je ověřit, jak vypadají
(pokud existují) oborové vstupní brány nejen na českých univerzitách a knihovnách, ale také v
zahraničí.
6.2.2. Analýza existujících řešení
Na vybraných stránkách jsem identifikoval několik společných vzorců, které potvrdil uvažování
nad vzhledem navrhovné podoby microsites. Jednalo se především o uspořádání resp.
kategorizaci obsahu. Kromě práce s kategoriemi elektronických informačních zdrojů na webu
Ústřední knihovny Fakulty sociálních studií Masarykovy univerzity, mi přišly zajímavé (a
inspirující) tak oborové stránky, které používá například Národní technická knihovna nebo
univerzitní knihovna v dánském Árhusu.
Ani jedno z řešení však není možné považovat vyhovující. Především proto, že kategorizace
zdrojů je mnohdy pouze na úrovni oblastí jako je například biologie, strojírenství, atd. a podle
typu elektronických informačních zdrojů jakou jsou například ebooky, databáze nebo
multimédia. Žádné z analyzovaných řešení také nepracovalo s možností procházet nebo jakkoliv
filtrovat jednotlivé studijní obory nebo jejich možnou kombinaci.2 0 7
Na obrázku níže je několik
vybraných webových stránek.
2 0 7
Poznámka autora práce: V případě mnou nalezených stránek nebyla nikde možnost jakkoliv se dostat ke
kategorizaci elektronických informaních zdrojů na úrovni jednotlivých studijních oborů.
70
Obrázek 17: Ukázka vybraných stránek v rámci desk research. Zleva Aarhus, Národní technická
knihovna, Ústřední knihovna Fakulty sociálních studií Masarykovy univerzity
6.3. Uživatelský výzkum a modelování uživatelů
V rámci projektu pracuji s informacemi, které mi byly poskytnuty Ústřední knihovnou. Tyto
informace vycházejí z předchozích výzkumů, které Ústřední knihovna prováděla v oblasti
využívání stránky ezdoje.muni.cz a získávání zpětné vazby na současnou podobu této stránky.
Jelikož nebyl v úvodu provedený uživatelský výzkum (s ohledem na rozsah a časovou náročnost
takového výzkumu, by jej i ani nebylo možné v rámci diplomové práce realizovat) nepracuji
proto s personami založenými na uživatelském výzkumu.2 0 8
2 0 8
Poznámka autora práce. Uznávám však, že alespoň částečný uživatelský výzkum by na začátku projektu
proveden být měl. Především z důvodu validace hypotéz o uživatelích a návrzích v rámci designového procesu.
Proto jsem v průběhu designového procesu vytvořil online dotazník, který se zaměřuje na to, jakje stránka
ezdroje.muni.cz studenty využívána, zdaje studentům její používání doporučováno od vyučujících a také co se je
jim na stávající podobě stránky líbí nebo nelíbí ajak ji případně používají. Dotazník však není validní z důvodu
nedostečného počtu respondentů. Důvodem je nevhodně zvolená distribuce dotazníku mezi studenty.
71
Proto j sem potřeby návrhu ve spolupráci s Ústřední knihovnou vytvořil několik proto-person
uživatelů a prioritizoval jejich důležitost pro samotný návrh.
6.3.1. Proto-persony
Proto-persony jsem definoval po vzoru, který popisuje K i m Goodwin.209 'Vytvořené protopersony
tedy neobsahují žádné demografické údaje, ale pouze popis jejich potřeb a cílů, které
chějí naplnit. Jsou to tedy hypotetičtí uživatelé, které jsem modeloval na základě specifikace
Ústřední knihovny Filozofické fakulty.
Tento přístup k modelování uživatelů se mi s ohledem na zvolený designový přístup, kde se
zaměřuji primárně na aktivity a cíle, zdá v této fázi dostačující. Vytvořil jsme celkem čtyři
proto-persony - u kterých jsme si dále určil jejich priority v rámci samotného návrhu - tedy
které jsou pro primární a které jsou sekundární.
lil
P e t r
(primární)
- student magisterského oboru n a FF
Jeho cíl:
Netrávit hledáním e-zdrojú zdrojů pro své studium
příliš m n o h o času a vyhnout se těm. které
nejsou relevantní.
K a r e l
- vyučující n a Filozofické fakultě
Doporučovat studentům c o nejvíce relevantní
zdroje. Tyto zdroje mít p o d kontrolou a sjednotit
tak znalosti studentů.
K l á r a
(primární)
Jeho cíl:
Rychle se zorientovat v dostupných zdrojích pro
o b a obory před prvními zkouškami
J a n a
• knihovnice v Ústřední knihovně FF
Jeho cíl:
Rychle řešit dotazy studentů na dostupnost
e-zdrojů a v případě dotazu jim dobře poradit
a mít je kam odkázat.
Obrázek 18: Vytvořené proto-persony. Autor: Ondřej Honel
2 0 9
viz kapitola 6.4.2. Proto-persony GOODWIN, Kim. Designingfor the digital age: how to create humancenteredproducts
and services. Indianapolis, IN: Wiley Pub., c2009, s. 294. ISBN 978-0-470-22910-1.
72
6.4. Návrh - skicování, wireframe a prototyp
V rámci této části se zaměřujeme na popis toho, jak vzniká samotný návrh od fáze úvodních
skic, ktré slouží jako výchozí zobrazení pro následnou tvorbu drátěných modelů, grafický návrh
podoby stránek až po tvorbu interaktivního prototypu, který je finálním výstupem praktické části
diplomové práce.
6.4.1. Skicování
Úvodní skici se zaměřují především na rozvržení požadovaných obrazovek, se kterými bude
uživatel pracovat v rámci hledání elektronických informačních zdrojů pro svůj obor. Obsahují
především prvky, které již od začátku procesu považujeme za nezbytné, a vychází z požadavků,
které si stanovila Ústřední knihovna.
Ať už se jedná o konkrétní prvky na stránce, jako jsou kategorie nebo to, jaké možnosti by
uživatel na dané stránce měl mít - a následně také prvků, které nám vyplynuly z
analýzy ,,konkurenčních řešení" a které považujeme za vhodné také pro naše řešení. Skici
nezobrazují finální podobu návrhu, ale jsou pro nás základem pro následné vytváření drátěných
modelů (wireframů).
Skici jsem vytvořil v několika variantách, abych zachytil nejrůznější modely zobrazení obsahu
stránek a obsažených prvků, které zároveň definují to, jakým způsobem by měl se s navrženými
stránkami uživatel interagovat a jakým způsobem s nimi bude pracovat a procházet je.
Jednotlivé elementy stránky jsem pro úplnost doplnil i stručným popisem toho, jak se tyto
elementy chovají nebo k čemu slouží. Kompletní seznam prvků a jejich úplný popis je následně
součástí wireframů.
Jelikož jsem si na začátku projektu stanovil, že se chci výsledným návrhem přiblížit (dodržet)
vizuální styl aplikovaný na stránkách Filozofické fakulty Masarykovy univerzity, zvolil jsme
pro stránku zobrazující seznam zdrojů pro daný obor rozložení stránky ze skici, která mu
odpovídá nejblíže - viz obrázek 20. Tuto skicu jsem následně přenesl do podoby wireframů.
Jako stránku pro vyhledávání oborů jsem pro větší přehlednost zvolil variantu, která obsahuje
pouze vyhledávací pole s našeptávačem a seznamem oborů pro případné ruční vyhledávání - viz
obrázek 19.
73
Důvodem je především to, že na této obrazovce nejsou zobrazeny žádné další elementy, které by
odváděly pozornost uživatele nebo způsobovaly jeho zmatení v tom, k čemu stránka slouží a jak
ji používat. V počátku jsem zvažoval i variantu integrace vyhledávacího pole oborů přímo na
současnou stránku knihovny, která odkazuje na elektronické informační zdroje. Tato stránka se
však nejevila jako nejvhodnější především proto, že již obsahuje vyhledávácí pole pro přímé
hledání zdrojů v rámci databáze EBSCO, odkaz na stránku ezdroje.muni.cz a také informace o
tom, jak s elektronickými zdroji pracovat.
i®:
; viHurt. Wis • tíi.nww r r nwi •
{^) |rt*L€trfw^. Pate. '.i MitPrtWitr,
\ \ \ \ WHLtblfir/iM' ÄSV' oftittv
klh- Tp
(£) zře ; í<" ; /aa.; «*é';
• • • l í t o J . '
P&*iVt **» «^-í*.l*. í sítí
2 3
8?
. . * W
M i ř w « " t - <*^6
1
Obrázek 19: Skicy zobrazující ve dvou variantách celkový návrh rozložení webové stránky pro
vyhledávání oborů. Autor: Ondřej Honel
snwlw-f ^uk^ittÁcu intuit ; yeä-A
(5). TTfcUuc* kftrBb-nlii^tiwU
Qi). TNÍTA-Ď -rtínínckii k. • • •
(j)' ÍÍF'ÍÍV ."Sety
( í p - - p O n r ' MUmifu " M Ä J Í Č
y?,. V> . .
AVI fy-
°H
*W
• '
Mí*?, pt^kxiu eat . . . .
Obrázek 20: Skicy zobrazující ve dvou variantách celkový návrh rozložení obrazovky s již zvoleným
oborem a výpisem dostupných zdrojů rozdělených do příslušných kategorií. Autor: Ondřej Honel
6.4.2. Drátěné modely (wireframy)
Drátěné modely vycházejí z úvodních skic a jsou rozpracované do takové podoby, na jejichž
základě budu vytvářet finální vizuální podobu stránek. Wireframe jsem v několika fázích
konzultoval s knihovnou a veškeré změny zapracoval přímo do finální podoby drátěného
modelu.
74
Hlavní změnou bylo sloučení obou variant zobrazení stránek s nalezenými zdroji, kde jsem
přidal úvodní text, který seznamuje uživatel s tím, kde se nachází a jak se zdroji pracovat.
Veškeré interakce a stavy jako je například klik, aktivní stav prvků, atd., které se na stránkách
objevují, jsou pro každou stránku popsány slovně, jelikož je nelze jinak do návrhu přenést.
Pro vytvoření drátěných modelů jsem využil návrhový software Sketch app, který je běžně
používaný při návrzích webových stránek nebo aplikací na platformě Mac OS. Tento program
jsem zvolil především z toho důvodu, že v něm budu následně navrhovat i grafickou podobu
stránek a také proto, že jej znám a tudíž jsem eliminoval nutnost hledání a především učení se v
novém prostředí jiných programů.
Volba digitální podoby drátěného modelu měla také další ryze praktický důvod a to především
ten, že případná editace a iterace takového drátěného modelu je poměrně jednoduchá a
nevyžaduje, jako je tomu v případě papírového drátěného modelu, neustále překreslování
rozvržení stránky a obsažený elementů i v případě drobných změn.
P o z n á m k y
I /yhledavaci F :: r i nateplavacem
- .. • i, iti i začne ptat název
oboru, rozbalíme se mu pod vyhledávaní
okna kde te zobrazí nalezené výsledky
a ty te die toho |ak píše budou zpřesňoval
nebo ti ulivalel vybere len který potřebuje
J V případ* ze ulivalel nezná naze. oboru
nebo nechce využil vyhledavači pole.
múze listoval katalogem oboru po kliku
rozbail nabídka oborů - bod 4
j Rozbalena nabídka dostupných předmélU
na stránku jednooborového sludla
V !•:••>••<• it sluněni hledá kombinaci oboru
KONTAKT INFORMACE 0 KNIHOVNĚ
SLEOUJTE NOVINKY Z KNIHOVNY NA • ©
Obrázek 21: Ukázka drátěného modelu stránky s vyhledáváním oborů včetně poznámek k funkcinalitě
vybraných prvků na stránce. Autor: Ondřej Honel
75
Navržené drátěné modely (a výsledný návrh) nepracují s finální podobou textů. M o u snahou
však je, aby tyto „pracovní texty" byly jednak pro účely testování co nej věrnější a případně
sloužily jako základ pro konečnou podobu textů. Proto jsem se při návrhu vyhnul používání
univerzálních výplňových textů jako je například lorem ipsum.
6.4.3. Grafický návrh (vizuální styl)
Již od začátku je cílem, aby výsledný grafický návrh stránky s konkrétním oborem odpovídal
(co nejvíce se přiblížil) stávajícímu vizuálnímu stylu, který je aplikovaný na webových
stránkách Masarykovy univerzity respektive Filozofické fakulty, byť ne v jeho 100% podobě.
Vycházím přitom z toho, že je cílem, aby byl grafický návrh pro uživatele jednoznačně
identifikovatelný v tom smyslu, že si jej uživatel spojí s vizuální podobou, kterou zná ze stránek
Filozické fakulty a také z předpokladu, že v budoucnu s nej větší pravděpodobností dojde ke
změně podoby stávajících webových stránek Ústřední knihovny Filozofické fakulty v rámci
redesignu webových stránek Masarykovy univerzity resp. všech jejich fakult a webů.
Mnou navržená grafická podoba tyto potřeby a možné eventuality reflektuje a to především na
úrovni rozvržení obrazovky (tedy celkového layoutu), použitých ovládacích prvků, písma a
doplňkových grafických prvků jako jsou fotografie případně ikony. Barevně bude návrh
využívat stávající paletu barev, kterou používá knihovna na současných webových stránkách.
Protože Ústřední knihovna je součástí systému Filozofické fakulty resp. M U , nepovažuji za
nezbytné, aby se v tomto případě vytvářel výrazně odlišný grafický návrh, který by stránky
knihovny nějak výrazně odlišoval nebo jí vytvářel svým způsobem vlastní značku a identitu.
Naopak je cílem, aby tuto stránku dokázal uživatel rychle identifikovat a zorientovat se zde.
Dalším důvodem je také to, že stránku může používat i uživatel, který není z Masarykovy
univerzity. M ý m cílem je tedy podpořit to, že tato stránka patří do systému Masarykovy
univerzity a posílila tak její značku.
76
Grafický návrh tedy musí splňovat tato kritéria:
•být lehce identifikovatelný jako součást vizuálního stylu používaného na webových
stránkách Filozofické fakulty - co nejvíce se jim přibližovat
•obsahovat rozvržení stránky (layout) a prvky, které jsou používány na stránkách
Filozofické fakulty
•na úrovni konkrétní oborové brány používat doplňkové grafické prvky jako jsou
fotografie, které jsou tématické
• používat pro uživatele známý jazyk
• musí být přehledný a to i pro uživatele, který stránku nevštěvuje poprvé
Stránka s vyhledáváním oborů bude plně odpovídat stávající podobě (layoutu) webových
stránek knihovny. Předpokládám, že uživatel, pokud bude obor vyhledávat, začne právě zde.
ÚSTŘEDNÍ KNIHOVNA UÉfDnnvDO-IOOO
k 1 taOiImi f
Teorie interaktivních
médií a Sociologie
Přehled elektronických informačních zdrojů
Jak začít
SLEDUJTE NOVINKY Z KNIHOVNY NA • © •
Obrázek 22: Ukázka výsledného grafického návrhu konkrétní oborové stránky. Autor: Ondřej Honel
11
6.4.4. Prototyp
Protyp vychází z návrhu drátěných modelu a byl vytvořený pomocí webové aplikace Invision,
která umožňuje vytvářet protypy z návrhů, které jsem vytvořil v programu Sketch app. Jedná se
0 jednoduchou formu protypu, která zobrazuje nejen vizuální podobu stránky, ale také provázání
jednotlivých stránek mezi sebou a interakce, ke kterým zde dochází.
Použitá aplikace neumožňuje kromě propojování obsahu jednotlivých stránek žádné další
pokročilé interakce, jako jsou například animace.
Pouze v případě vytváření prototypu pro dotyková zařízení umoňuje aplikace zvolit volbu
přechodu - interakce, jako je „tapmití" prstem nebo „swipe ", tedy tažení prstem do strany.
Tato aplikace je pro většinu návrhů webových rozhraní (pokud tedy nevyžadují animace apod.)
dostačující a často používaná i přes své limity. Zároveň tato forma prototypu dokáže uživateli s
určitým omezením simulovat prostředí stránky, je nenáročná na tvorbu, protože nevyžaduje
znalost hmtl nebo programovacích jazyků a je možné ho jednoduše sdílet online - například pro
potřeby testování. Dalším přínosem je, především pro následnou fázi vývoje to, že aplikace
dokáže zobrazit zdrojový kód stylů pro vývojáře a to v několika formátech. Díky tomu designér
nemusí vytvářet složitou dokumentaci pro vývojáře a při důkladném návrhu, kde jsou vytvořené
1 případné stavy jednotlivých elementů stránek, vidí vývojář k jakým interakcím dochází. Dále
tato aplikace obsahuje také možnost vkládat do návrhu komentáře případně možnost
kolaborativní práce s prototypem mezi více uživateli (vkládání poznámek, ruční kreslení do
návrhu, atd.). Díky této aplikaci tak lze v podstatě zdarma vytvořit verzi interaktivního
prototypu vhodného i k testování jednoduchých webových stránek a aplikací.
Vytvořený prototyp slouží nejen k představení výsledného návrhu pedagogům a vedoucím
jednotlivých oborů (a samozřejmě interně také zaměstnancům knihovny), ale také pro následné
uživatelské testování prováděném knihovnou v terénu na základě definovaných scénářů.
Výsledný prototyp je přístupný online na adrese https://invi s.i o / Y K H 1AFMR2X6
78
ÚSTŘEDNÍ KNIHOVNA
I FILOZOFICKÉ FAKULTY MU
T WIFI v knihovně
HLAVNI STRANA POPRVÉ V KNIHOVNĚ NAŠE SLUŽBY KATALOGY A DATABÁZE KURZY A PŘEDNÁŠKY KONTAKTY
Vyhledávání oborových bran
elektronických informačních zdrojů
Ve vyhledávacím poli začnite psát naiev hledaného oboru. Poté bude presmerovaní
na stránku vybraných elektronických zdroju pro tento obor
X
Unk To:
Nebo vyberte požadovaný obor ze seznamu zdeVyhledáváni
ObonJ Naleptav* •
Nebo vyberte požadovaný obor ze seznamu zdeUr*
Back 1Close i
KONTAKT
FHoiofkká fakulta
Úatrednl knihovna
INFORMACE 0 KNIHOVNĚ
•jfíi • Wtuakii prohlídka knihovny • OknTiovr
• Fologalene • Kdy je Ott
• Rady a smémioe • Kontaktyi
Previous Screen m Series
External URL
Prototyp« Stretni
Stránka Oboru VytMána Kategwie
1JJl Diplomová prace Vyhledáváni Oboru - © Q g > o rt O • *•> UtlHAND * iH»m
Obrázek 23: Ukázka vytváření prototypu v aplikaci invisionapp.com. Autor: Ondřej Honel
6.5. Evaluace a testováni
Tato část práce se věnuje návrhu konceptu, jakým způsobem bude probíhat uživatelské testování
navrženého prototypu oborové stránky s elektronickými informačními zdroji. Koncept
uživatelského testování je postavený na metodice, kterou používá a popisuje Steve Krug ve své
knize Don't make me thing - A Common Sense Approach to Web Usability.210
V rámci
uživatelského testování se zaměřujeme nejen samotnou použitelnost navrženého řešení, ale také
jeho užitečnost a hodnocení vizuálního stylu.
6.5.1. Koncept uživatelského testování
Uživatelské testování probíhá vždy s jedním účastníkem (respondentem), kterého testem provádí
tazatel (moderátor). Uživatelské testování prototypu bude kvalitativní povahy, kdy na základě
předem připraveného scénáře bude s uživatelem vedený hloubkový rozhovor.
Uživatelské testování se kromě testování použitelnosti navrženého řešení zaměřujeme také na
testování užitečnosti a testování grafického designu.
2 1 0
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s. 130-159. ISBN 0-321-34475-8.
79
Uživatel je v úvodu testování seznámen s průběhem a důvody testování a je mu předán k
podpisu informovaný souhlas se zpracováním a užitím dat pro účely testování. Svým podpisem
testovaný uživatel souhlasí se zpracováním takto získaných dat včetně obrazového a zvukového
záznamu. Získaná data budou pro účely zpracování anonymizována. Tento informovaný souhlas
je v jedné kopii předán uživateli a v jedné kopii uložen u facilitátora resp. v Ústřední knihovně.
Jako ideální počet účastníků testování je pět uživatelů, což vychází z doporučení pro uživatelské
testování podle Jakoba Nilsena, který v článku o uživatelském testování píše - „Při testování s 5
lidmi najdete téměř stejné množství problémů, jaké byste našli při použití test s mnohem více
participanty. " 2 U
Tento počet uživatelů je široce přijímán jako dostatečný a lze jej najít jako doporučený počet
uživatelů pro testování napříč publikacemi - například počet uživatelů 3-5 zmiňuje Jan Řezáč.2 1 2
Na základě toho, co doporučuje například Steve K r u g 2 1 3
, je zvolena forma vícekolového
uživatelského testování, pokud to bude potřebné2 1 4
a to především z důvodu získání co nejvíce
poznatků od uživatelů a také odhalení co největšího počet případných chyb nebo problémů. V
praxi to znamená to, že bude nutné po každém kole testování prototyp aktualizovat na základě
získané zpětné vazby, tak jak je doporučeno Krugem.
Důležité je zpětná vazba uživatele. Tedy jak se mu v novém prostředí pracuje, jak na něj působí
- zdaje srozumitelné, jak se mu líbí a zdaje námi navržená průchod (cesta k protypu) funkční.
Z důvodu technické limitace prototypu nelze provádět testování na úrovni toho, že by uživatel
mohl neomezeně procházet návrhem oborové stránky (vyhledávat, „proklikávat" celé prostředí,
atd.). Testování se zaměřuje také na poznání cesty uživatele službou (stránkou), tedy to jakým
způsobem se na připravenou oborovou stránku dostane například z úvodní stránky knihovny.
2 1 1
Vlastní překlad autora práce: Původní znění:,,Testing with 5 people lets you find almost as many usability
problems asyou'dfindusing many more testparticipants. "
NIELSEN, Jakob. How Many Test Users in a Usability Study?. Nielsen Norman Group [online]. 2017 [cit.
2018-01-04]. Dostupné z: https://www.nngroup.corn/articles/how-many-test-users/
2 1 2
ŘEZÁČ, Jan. Web ostrýjako břitva: návrhfungujícího webu pro webdesignery a zadavatele projektů. Vydání
druhé. Brno: House of Řezáč, 2016, 135. ISBN 978-80-270-0644-1.
2 1 3
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s.139. ISBN 0-321-34475-8.
2 1 4
To závisí na tom, jaké výsledky získá knihovna z prvního kola uživatelského testování.
80
Scénář testování odpovídá tomu, jak jej navrhuje a popisuje Steve Krug ve své knize v rámci
kapitoly Testování použitelnosti za 10 centů denně. 2 1 5
Krug scénář uživatelského testování
rozděluje do několika částí. V úvodu seznamuje uživatele s tím, co jej vlastně čeká a jak bude
testování probíhat. Co se stane pokud, bude mít uživatel dotaz, na který nedokáže tazatel
zodpovědět a především pak informuje uživatele o tom, že průběh testování je dokumentován
(kamera a zvuk) a že tyto záznamy slouží pouze pro potřeby projektu a nejsou dále
zveřejňovány.
Následuje sled několika otázek, kdy se snažíme o uživateli dozvědět, co dělá, jaké má v
kontextu testovaného produktu nebo stránky návyky - jaké stránky navštěvuje a proč.
Krug tuto část zařazuje především proto, že na jejím základě pozná návyky a motivace uživatele
a tak k tomu, aby se uživatel před samotným testováním uvolnil a rozmluvil. Poté přichází na
řadu již samotné testování, které Krug začíná tím, že uživateli ukáže testovanou stránku - zde jej
zajímá to, zda uživatel ví, kde se nachází, co na stránce je, co se mu líbí nebo nelíbí. Jaké má ze
stránky pocity, zda se mu líbí vizuální styl, zda jsou texty srozumitelné, zda rozumí tomu, co
jednotlivé části stránky dělají a kam se v případě, že na ně klikne dostane nebo co může
očekávat jako výstup.
Po této fázi přichází testování stránek na základě plnění předem stanovených úkolů - scénářů.
Krug ve všech fázích testování doporučuje a ukazuje, že s uživatelem interaguje, doptává se jej
například na to, co očekává od dané akce, zda všemu rozumí nebo pokud nerozumí, jak daný
problém chápe. Krugův ukázkový uživatelský test nezabere více než 45 minut. Předpokládá se,
že v rámci testování zpracovaného prototypu bude časová dotace na testování nižší - kolem
20-30 minut.
Ústřední knihovna bude navržený prototypu konzultovat a testovat také se zástupci vybraných
oborů (garanty oborů) a vyučujícími. Zaměří především na obsahovou stránku navrženého
prototypu - tedy v jaké formě budou jednotlivé části obsahu zobrazeny a co mají obsahovat mají
mít odkazy na elektronické informační zdroje anotace toho, co obsahují a co v nich student
může primárně najít.
2 1 5
KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley, Calif: New
Riders Pub., c2006, s.146-155. ISBN 0-321-34475-8.
81
Nelze totiž vyloučit variantu, že pro každý obor bude mít stránka jinou podobu (bude určitým
způsobem personalizována). V praxi to znamená například to, že ne všechny obory musí mít na
této stránce zobrazovat odkazy na multimediální zdroje nebo ebooky. Knihovna bude v této fázi
testování (představení prototypu) sehrávat roli moderátora a odborníka, který by měl uplatnit své
zkušenosti a expertízu v oblasti toho, co mohou studentům nabídnout za zdroje a formáty, jakým
způsobem co nejefektivněji tvořit oborové brány s elektronickými informačními zdroji, ale také
poznatků z průběhu uživatelských testování a obecně znalosti toho, co vyžadují studenti ve
chvíli, kdy do knihovny přichází a hledají potřebné zdroje pro své studium.
Ústřední knihovna by měla mít také snahu případně vysvětlit a zdůvodnit potřebu spolupráce
mezi knihovnou a jednotlivými obory a také vyznám toho, proč elektronické informační zdroje
studentům v rámci studia doporučovat (zde je to především snadná dostupnost relevantních
odborných zdrojů a jejich aktuálnost).
6.6. Shrnutí
Výsledný návrh reflektuje knihovnou definovaný ideální „konečný" stav, ale je velice
pravděpodobné, že v úvodní fázi případné implementace bude nutné určitým způsobem podobu
návrhu přizpůsobit současnému stavu a možnost. Je také nutné vytvořit dokumentaci, systém
zpracování a vytváření elektronických informačních zdrojů mezi jednotlivými obory a
knihovnou. Zde se tedy navazujeme na úvodní kapitolu, která se věnuje tématu digitálního
informačního kurátorství a s tím související role knihovníků - kurátorů podle Michala
Černého2 1 6
a také metodě, jak vytvořit kvalitní oborou bránu nebo literárního průvodce tak jak je
definuje například Hjorland2 1 7
.
V rámci designového procesu a především ve fázi ideace jsme přišel řadu další konceptů, jak by
mohl výsledný návrh vypadat - od velmi jednoduchých návrhů přes výrazně pokročilé řešení.
2 1 6
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivých nástrojům. Brno: Flow, 2015. ISBN 978-80-88123-03-3.
viz kapitola 3.2. Digitální informační kurátorství a doménová analýza v knihovnách
2 1 7
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, pp.422-462, https://doi.org/
10.1108/00220410210431136
viz kapitola 3.2. Digitální informační kurátorství a doménová analýza v knihovnách
82
Například přístup k e-zdrojům přímo z rozhraní ISu resp. provázání profilu studenta se stránkou
ezdroje.muni.cz. V tomto případě by měl student na základě svého oboru automaticky přístup k
oborové bráně s informačními zdroji, tedy viděl svou oborovou bránu e-zdrojů tak, jak je
prezentována v našem současném návrhu, případně s nimi mohl dále pracovat na úrovni
personalizace této stránky nebo zdrojů. Toto řešení by však zřejmě vyžadovalo nemalé změny v
rámci portálu elektronických informačních zdrojů Masarykovy univerzity a ISu. Na druhé straně
by tyto návrhy mohly být pozitivním posunem a zjednodušením práce a přístupu k
elektronickým informačním zdrojům s ohledem na jejich uživatele (studenty) v rámci univerzity.
S ohledem na to, že se jedná o prototyp služby, kterou by chtěla knihovna zavést a jejíž
úspěšnost můžeme nyní pouze odhadovat, zvolili řešení, které není svou případnou
implementací nijak složité.
83
7. Závěr
V rámci této diplomové práce se mi ve spolupráci s Ústřední knihovou Filozifické fakulty
Masarykovy univerzity podařilo vytvořit interaktivní prototyp možné podoby oborové microsite,
která by měla sloužit jako ucelený seznam (rozcestník) elektronických informačních zdrojů pro
konkrétní studijní obor nebo kombinaci oborů. Jelikož bude tento prototyp dále testován nejen s
uživateli (studenty) a také zástupci oborů na Filozofické fakultě, nelze jej považovat za finální
řešení, ale spíše úvodní nástin toho, jak může vypadat ucelená a efektivní distribuce
elektronických informačních zdrojů za využití poznatků nejen z oblasti informační vědy a tím
souvisejících konkrétních specifik jako je například potřeba v dnešní době pracovat s rolí
digitálního kurátora, kterou definuje Michal Černý2 1 8
nebo přístupu k informačním službám a
zůsobu, jak vytvářet oborové vstupní brány a literární průvodce, tak jak je popisuje například
Birger Hjorland v rámci textu o doménové analýze v informační vědě. 2 1 9
Je také nutné zmínit
to, že se mi bohužel nepodařilo projít celým designovým procesem, resp. nepodařilo se mi získat
dostatečná data z vytvořeného dotazníku a to především díky nevhodně zvoleným kanálům pro
distribuci a také velmi úzkému nastavení cílové skupiny, která měla dotazník vyplnit. Jsem si
vědom toho, že se tento fakt může projevit v následné fázi uživatelského testování, které bude
probíhat mimo tuto diplomou práci a proto jsme v texu diplomové práce představil pouze
koncept, s jakým bude Ústřední knihovna k testování přistupovat.
Současně jsem prostřednictvím diplomové práce a především pak v teoretické části představil
designové oblasti, jako je user experience design a jemu příbuzné nebo navazující obory a
následně pak používané metod v rámci designových procesů. Teoretický část si nekladla za úkol
vytvářet nebo sjednocovat stávající definice těchto stále poměrně mladých oborů, ale vytvořit
spíše přehledný základ nejen pro pochopení vztahů a významu těchto oborů, ale především pak
pro jejich následnou praktickou aplikaci v praktické části této diplomové práce, tedy při
vytváření návrhu oborových stránek elektronických informačních zdrojů.
2 1 8
ČERNÝ, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických východisek k
jednotlivých nástrojům. Brno: Flow, 2015. ISBN 978-80-88123-03-3.
2 1 9
HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as well as
innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, pp.422-462, https://doi.org/
10.1108/00220410210431136
84
O tom, zda bude tento prototyp nebo jeho iterace úspěšný však kromě testování bude rozhodovat
především to, jakou pozici zaujme knihovna (a následně pak pedagogové) při jeho obhajobě a
samozřejmě následné distribuci. Je nutné si připomenout, že se jedná jen o malý výsek v rámci
všech nastávajících aktivit, které má knihovna před sebou - ať už vezme v potaz strategický
dokument pro rozvoj Filozofické fakulty nebo specificky pak roli knihovny v rámci fakulty. Zde
bude knihovna jistě do budoucna muset reflektovat a využít metody a „bestpractices" z oblasti
designového myšlení pro knihovny a designu služeb obecně, které jsou aktuálně vlivem
zahraničních knihoven jako je D O K K 1 v Árhusu na vzestupu a stává se i u nás velkým tématem
v kontextu toho, jaké by měly být knihovny v 21. století a jak se přizpůsobit změnám ve
společnosti a jejím potřebám.
85
8. Bibliografie
3. #8 Výzkum od stolu. 100 metod [online], [cit. 2018-03-08]. Dostupné z: http://100metod.cz/post/
156756345404/8-výzkum-od-stolu
4. #12 Dotazník. 100 metod [online], [cit. 2018-03-08]. Dostupné z: http://100metod.cz/post/
45747047096/ 12-dotazn%C3%ADk
5. AMBROSE, Gavin a Paul HARRIS. Design thinkingfor visual communication. Second edition. New
York: Fairchild Books, an imprint of Bloomsbury Publishihng Pic, 2015. ISBN 978-2-940411-17-7.
6. CABLE, Steve a Richard CADDICK. Communicating the User Experience: A Practical Guide for
Creating Useful U X Documentation. 1st edition. West Sussex: Wiley, 2011. ISBN 978-1-119-97110-8.
7. CHASE, Stephanie. Design inking in Action: Changing the Public Service Model. OLA Quarterly
[online]. 2017, 2-22-2017, 22(3), 15-19 [cit. 2018-03-20]. Dostupné z: https://commons.pacificu.edu/
cgi/viewcontent.cgi?referer=https://www.google.cz/&httpsredir=l&article=1865&context=olaq
8. COOPER, Alan, Robert. REIMANN a Dave CRONIN. Aboutface 3: the essentials of interaction
design. [3rd ed.], Completely rev. & updated. Indianapolis, IN: Wiley Pub., c2007. ISBN
978-0-470-08411-3.
9. CULEN, Alma Leora, Jan DELONG, Andrea Alessandro GASPARINI, Roman NOVOTNÝ, Pavla
MINARIKOVÁ a Ladislava ZBIEJCZUK SUCHA. Knihovníci jako designéři: případové studie o
zlepšování služeb v knihovnách. Brno: Masarykova univerzita, 2016. ISBN 978-80-210-8358-5.
10.CERNY, Michal. Digitální informační kurátorství v pedagogickém kontextu: od teoretických
východisek kjednotlivých nástrojům. Brno: Flow, 2015. ISBN 978-80-88123-03-3.
11.Designové myšlení pro knihovny: příručka pro knihovny zaměřené na uživatele. Brno: IDEO, 2016.
ISBN 978-80-88123-11-8.
12. Dlouhodobý záměr Filozofické fakulty Masarykovy univerzity na léta 2016-2020. Brno: Masarykova
univerzita, 2016. ISBN 978-80-210-8301-1.
13. DVOŘÁKOVÁ, Lucie. Informační architektura. Inflow [online]. 2010 [cit. 2018-03-10]. Dostupné z:
http://www.inflow.cz/informacni-architektura
14. Elektronické informační zdroje: cesta ke kvalitním informacím. Ústřední knihovna FF MU, 2014.
Dostupné také z: https://www.slideshare.net/rs_knihovnaffmu/pruvodce-eiz-jaro2014
86
15. FOLMER, Eelke. 41. Interaction Design Patterns. Interaction DesignFoundation [online], [cit.
2018-03-10]. Dostupné z: https://www.interaction-design.org/literature^ook/the-glossary-of-human-
computer-interaction/interaction-design-patterns
16. GARRETT, Jesse James. The elements of user experience: user-centered designfor the Web and
beyond. 2nd ed. Berkeley, CA: New Riders, c2011. Voices that matter. ISBN 03-216-8368-4.
17. GIBBONS, Sarah. Service Design 101. Nielsen Norman Group [online]. 2017 [cit. 2018-03-10],
Dostupné z: https://www.nngroup.com/articles/service-design-101/
18. GOODWIN, Kim. Designing for the digital age: how to create human-centeredproducts and
services. Indianapolis, IN: Wiley Pub., c2009. ISBN 978-0-470-22910-1.
19. HCD Design zaměřený na člověka: soubor nástrojů [online]. Brno: Kabinet informačních studií a
knihovnictví M U Brno, 2013. ISBN 978-80-905480-1-5.
20. HILLERY. 12 Wireframes examples from some of our favorite ux designers. Invisionapp.com
[online]. 2017 [cit. 2018-03-26]. Dostupné z: https://www.invisionapp.com/blog/wireframe-examples/
21. HJORLAND, Birger. Domain analysis in information science: Eleven approaches - traditional as
well as innovative. Journal of Documentation, 2002. Vol. 58 Issue: 4, pp.422-462, https://doi.org/
10.1108/0022041021043113 6
22. HOLZMAN, Ondřej. Platbou to nekončí. Chceme zajistit maximální pohodlí i při doručení, říká šéf
U X v Mall.cz Honza Nováček. In: Tyinternety.cz [online]. 21.3.2018 [cit. 2018-03-30]. Dostupné z:
https://tyinternety.cz/e-commerce/chceme-zajistit-maximalni-pohodli-i-pri-doruceni-rika-sef-ux-v-
mall-cz/
23. Human-Computer Interaction (HCI). Interaction Design Foundation [online], [cit. 2018-03-01],
Dostupné z: https://www.interaction-design.org/literature/topics/human-computer-interaction
24. KOSNAR, Petr. Jak designem vyvolat emoce: Role UX. In: Czechdesign [online]. 10.10.2016 [cit.
2018-03-10]. Dostupné z: http://www.czechdesign.cz/temata-a-rubriky/jak-designem-vyvolat-emoce-
role-ux
25. KRUG, Steve. Don't make me think!: a common sense approach to Web usability. 2nd ed. Berkeley,
Calif: New Riders Pub., c2006. ISBN 0-321-34475-8.
26. Libdesign: Odkiskupro knihovníky [online]. 2016 [cit. 2018-03-20]. Dostupné z: http://
libdesign.kisk.cz
87
27. MAČEK, Pavel. Návrh uživatelského rozhraní aplikace pro správu úkolů [online]. Brno, 2011 [cit.
2018-04-15]. Dostupné z: . Diplomová práce. Masarykova univerzita,
Fakulta informatiky. Vedoucí práce doc. Ing. Jiří Sochor, CSc.
28. Material Design [online]. Google [cit. 2018-03-20]. Dostupné z: https://material.io/guidelines/
components/bottom-navigation.html#
29. MEYER, Kate. The Aesthetic-Usability Effect. Nielsen Norman Group [online]. 2017 [cit.
2018-01-04]. Dostupné z: https://www.nngroup.com/articles/aesthetic-usability-effect/
30. MINAŘIKOVA, Pavla. Designové myšlení pro knihovny: projekt Libdesign. Brno, 2016. Magisterská
diplomová práce. Masarykova univerzita, Filozofická fakulta, Ustav české literatury a knihovnictví.
Vedoucí práce Ladislava Zbiejczuk Suchá.
31. MOGGRIDGE, Bill. Designing interactions. Cambridge, Mass.: MIT Press, c2007. ISBN
0262134748.
32. NIELSEN, Jakob. A 100-Year View of User Experience. Nielsen Norman Group [online]. 2017 [cit.
2018-03-01]. Dostupné z: https://www.nngroup.com/articles/100-years-ux/
33. NIELSEN, Jakob. How Many Test Users in a Usability Study?. Nielsen Norman Group [online],
2017 [cit. 2018-01-04]. Dostupné z: https://www.nngroup.com/articles/how-many-test-users/
34. NIELSEN, Jakob. Mental Models. Nielsen Norman Group [online]. 2010 [cit. 2018-03-01]. Dostupné
z: https://www.nngroup.com/articles/mental-models/
35. NNGROUP. Don Norman: The term "UX". In: Youtube [online]. 2016 [cit. 2018-03-05]. Dostupné z:
https://www.youtube.com/watch ?v=9BdtGjoIN4E
36. Notes on User Centered Design Process (UCD). W3.org [online], [cit. 2018-03-18]. Dostupné z:
https://www.w3.org/WAI/redesign/ucd
37. NORMAN, Donald A. The design of everyday things. New York: Doubleday, 1988. ISBN
0-385-26774-6.
38. NORMAN, Don a Jakob NIELSEN. The Definition of User Experience (UX). Nielsen Norman
Group [online], [cit. 2018-03-03]. Dostupné z: https://www.nngroup.com/articles/definition-user-
experience/
88
39. NOVOTNÝ, Roman. Designové myšlení do českých knihoven. Inflow [online]. 2018 [cit.
2018-03-18]. Dostupné z: http://www.inflow.cz/designove-mysleni-do-ceskych-knihoven
40. ŘEZÁČ, Jan. Web ostrý jako břitva: návrh fungujícího webu pro webdesignery a zadavatele projektů.
Vydání druhé. Brno: House of Řezáč, 2016. ISBN 978-80-270-0644-1.
41. SAFFER, Dan. Designing for interaction: creating innovative applications and devices. 2nd ed.
Berkeley, CA: New Rders, 2010. Voices that matter. ISBN 978-0-321-64339-1.
42. SAURO, Jeff. DOES THE FIDELITY OF A PROTOTYPE AFFECT RESULTS?. MeasuringU
[online]. 2017 [cit. 2018-03-20]. Dostupné z: https://measuringu.com/prototype-fidelity/
43. SHARP, Helen., Yvonne. ROGERS a Jenny PREECE. Interaction design: beyond human-computer
interaction. 2nd ed. Hoboken, NJ: Wiley, c2007. ISBN 978-0-470-01866-8.
44. SPENCER, Donna. A practical guide to information architecture. Penarth: Five Simple Steps, 2010.
ISBN 9780956174048.
45. STICKDORN, Marc, a Jakob SCHNEIDER. THIS IS SERVICE DESIGN THINKING: Basics, Tools,
Cases. Hoboken, New Jersey: WILEY, 2011. ISBN 978-1-118-15630-8.
46. STRENKOVÁ, Jana. Elektronické informační zdroje na M U [online]. Brno, 2006 [cit. 2018-04-16],
Dostupné z: . Diplomová práce. Masarykova univerzita, Filozofická
fakulta. Vedoucí práce RNDr. Miroslav Bartošek, CSc.
47. TREDER, Marcin. The History of User Experience Design. Medium.com [online], [cit. 2018-03-02],
Dostupné z: https://medium.eom/@marcintreder/the-historv-of-user-experience-design-5d87dlf81f5a
48. U N G E R Russ. a Carolyn. CHANDLER. A project guide to UX design: for user experience designers
in the field or in the making. Berkeley, CA: New Rders, c2009, s. 101. ISBN 978-0-321-60737-9.
49. VÁLKA, Ondřej. Co je U X design. In: Ondřej Válka: an information interaction designer [online],
2011 [cit. 2018-02-27]. Dostupné z: http://valka.info/notes/2011/04/co-je-ux- design/.
50. YOUNG, Indi. Mental models: aligning design strategy with human behavior. Brooklyn, N . Y :
Rosenfeld Media, c2008. ISBN 1-933820-06-3.
89
9. Seznam tabulek
Tabulka 1:
Přehled čtyř přístupů interakčního designu a jejich vlastností 34
Tabulka 2:
Přehled vybraných modelů designového procesu se stručným popisem jejich zaměření a
zdroj em, ve kterém j sou uvedeny 40-41
Tabulka 3:
Rozdíly mezi výzkumem trhu a designovým výzkumem 45
Tabulka 4:
Srovnání nástrojů kvalitativního a kvantitativního výzkumu 48
Tabulka 5:
Nástroje používané ve fázi poznávání v rámci designového procesu Libdesign 49
Tabulka 6:
Přehled typů prototypu, jejich výhod a použití 62
Tabulka 7:
Využité metody a nástroje v jednotlivých fázích designového procesu podle Libdesign 69
90
10. Seznam obrázku
Obrázek 1: Zobrazení vztahů a oblastí v rámci User Experience designu resp.
interakčního designu 12
Obrázek 2: Znázornění multidisciplinarity oboru Human-computer interaction 17
Obrázek 3: Diagram znázorňující faktory ovlivňující vznik inovací 19
Obrázek 4: Proces designového myšlení a jeho fáze 19
Obrázek 5: Disciplíny obklopující interakční design 31
Obrázek 6: Ukázka designového systému společnosti Google s názvem
Material Design 37
Obrázek 7: Přehled dílčích kroků výzkumného procesu 46
Obrázek 8: Příklady různých podob výsledné persony uživatele 51
Obrázek 9: Příklad proto-persony 53
Obrázek 10: Ukázka překrytí některých atributů a vlastnosti mezi personami a trřními
segmenty 55
Obrázek 11: Ukázka afinitiního diagramu na příkladu nákupního seznamu 58
Obrázek 12: Ukázka úvodní skicy rozložení webové stránky 59
Obrázek 13: Ukázka možné podoby drátěného modelu 60
Obrázek 14: Ukázka prototypu s nízkou věrností a vysokovou věrností 61
Obrázek 15: Dialogové okno pro potvrzeni uložení změn v dokumentu 63
Obrázek 16: Znázornění závislosti počtu odhalených chyb na počtu testovaných
uživatelů a počtu testovacích kol 65
Obrázek 17: Ukázka vybraných stránek v rámci desk research 71
Obrázek 18: Vytvořené proto-persony 72
91
Obrázek 19: Skicy zobrazující ve dvou variantách celkový návrh rozložení webové
stránky pro vyhledávání oborů 74
Obrázek 20: Skicy zobrazující ve dvou variantách celkový návrh rozložení obrazovky s
již zvoleným oborem a výpisem dostupných zdrojů rozdělených
do příslušných kategorií 74
Obrázek 21: Ukázka drátěného modelu stránky s vyhledáváním oborů včetně poznámek
k funkcinalitě vybraných prvků na stránce 75
Obrázek 22: Ukázka výsledného grafického návrhu konkrétní oborové stránky 77
Obrázek 23: Ukázka vytváření prototypu v aplikaci invisionapp.com 79
92
11. Seznam příloh
Příloha 1: Projekt diplomové práce
Příloha 2: Proto-persony
Příloha 3: Wireframe
Příloha 4: Prototyp (exportované obrazovky)
Příloha 5:
Obrázek 10 Ukázka překrytí některých atributů a vlastnosti mezi personami a trřními segmenty
93