Postupy a používané metody při tvorbě zadání webu, UX Wireframe
Download as PPTX, PDF4 likes2,574 views
Postupy které jsou využívány při návrhu obsahu, struktury webů. Návrh webu je jako architektonický plán pro stavbu domu. Prezentace obsahuje používané postupy a stručné informace o konkrétních metodách Vypracováno na základě UX zkušeností Michala Nováka a knihy Web ostrý jako Břitva www.seopc.cz
Postupy a používané metody při tvorbě zadání webu, UX Wireframe
- 1. Postup při návrhu webu Návrh webu je jako architektonický plán pro stavbu domu. • Prezentace obsahuje používané postupy a stručné informace o konkrétních metodách • Vypracováno na základě UX zkušeností Michala Nováka a knihy Web ostrý jako Břitva Ing. Michal Novák, www.seopc.cz, 2014
- 2. Vytvoření vazby Radost z užívání Přesvědčivost Důvěryhodnost Dostupnost Nalezitelnost Smysluplnost Upozornění, pozornost Získat zájem Rozhodnutí Akce Maslowova pyramida potřeb na webu Model chování Lidí (AIDA) Konkurence v prostředí / cena webu • Vyšší cena Velká webu konkurence v prostředí • Nižší cena Malá konkurence Web info Maslowova web pyramida
- 3. Činnosti související s návrhem webu / Práce web architekta Generování nápadů Brain storm, design studio Obsah – lístečky, myšlenková mapa 6 kloboků Struktura obsahu Pojmenování obsahu Navigace, menu Průchod webem Obsah důvěry URL, title Obsah k aktualizaci Obsah každé stránky Skyci , Wireframe Prototyp (HTML) Design webu Proč to celé děláme? • Proč to celé děláme: • Jaký je smysl? 1. Klient • Definice potřeb a procesů • Souvislost s businessem 2. Uživatel, prostředí • Přínos pro uživatele • V jaké situaci se setkává uživatel s webem 3. Návrh webu • Obsahová strategie, funkce • Skyci, wireframe, prototyp 4. Ověření • Testování • Představení zákazníkovi Zadání webu do vývoje • Zadání pro vývoj, tvorbu obsahu Definice procesů Definice produktu, služeb Metoda kontaktních míst SWOT Strategie firmy, mk. kanály Pozice webu na cestě uživatele Definice možného obsahu Sdělitelný příběh Brand / vzor Vizuál klienta Definování designu: ne/líbí Definice cílů Definice produktu, služeb Očekávání Konverze Unikátní prodejní argumenty Analýza klíčových slov Rozhovory, dotazníky Uživatel. Výzkum Prodejny, obchodníci Konkurence / spojenec Persony (příběh setkání s..) Skupiny lidí Storyboards Konkurenční Současný web / obsah Doplňující informace Tvorba URL Robots.txt Sitemap.xml Simulace chování webu Reporting 404, výpadků Práva na zdrojové kódy, DB Obsah k aktualizaci Práva a funkčnost administrace Uživatelské testování Expertní externí pohled Testování A/B Gerilová testování Heat mapy Test formulářů
- 4. Činnosti související s návrhem webu / Práce web architekta Podrobněji: Fáze 1. Objevení klienta Fáze 2. Uživatelský výzkum Fáze 3. Návrh webu a) obsah b) wireframe Fáze 4. Testování, ověření návrhu
- 5. Fáze 1. Objevení klienta Metody / postupy* Definice projektu Definice produktu – jeho přínosu, důvodu existence.Unikátní prodejní argumenty. Omezení: a)rozpočet, b)čas, c)co bude (výsledek) Cíle / očekávání Definice cílů, očekávání, souvislost webu s businessem. Definice procesů na straně pro zákazníka. Jaká očekávání na web. Očekávané chování návštěvníků (jednorázové – opakující se) Rozhovor s obchodníky, prodavači Potřeby pro jejich business. Pozice webu na cestě uživatele Metoda kontaktních míst Definování míst kde všude se uživatel setkává se značkou. Součást designu služeb. Brand / příběh Příběh přínosu služby (webu) pro člověka. Vzor brandu. Hodnoty a strategie Dotazník Seskupení otázek pro písemné odpovědi klienta Obsah Možnost dodání obsahu pro nový web (video, texty, obrázky, návody…). Obsah důvěry * Výčet některých postupů Komunikovat s jedním zástupcem klienta, který má zodpovědnost a rozhodovací pravomoc.
- 6. Fáze 2. Uživatelský výzkum Metody / postupy* Persony Archetyp člověka, Příběh propojující člověka s produktem (webem), rozdíly person (vlastnosti), situace člověka a webu, priority Uživatelský výzkum Vzory chování lidí na webu v souvislostech. Testování , přípravy scénářů, recruitmentu, vyhodnocení B2B /B2C Potřeby lidí, rozhodovací procesy v B2B Analýza klíčových slov Analýza chování dle hledání slov, zdroje: interní hledání, Seznam, Google, PPC a reklamní kampaně, našeptávače, konkurence, Google trends Rozhovory, dotazníky Rozhovory s potenciálními i reálnými uživateli webu. Motivace, očekávání, emoce Chování na současném webu Chování dle statistik Google analytics. Vstupní stránky v závislosti na konverzi. Stránky opuštění. Průchody webem. Vracející se návštěvníci * Výčet některých postupů
- 7. Fáze 3a. Návrh webu - obsah Metody / postupy* Mapa obsahu Cíl stránky, co chceme říci, jaká zpráva, požadovaná akce uživatele, emoce -> vzniknou nadpisy, konkrétní obsah. Papírové štítky Myšlenková mapa Lepítka na stěnu, flipchart, souvislosti mezi myšlenkami Brainstorming Chrlení nápadů bez ladu a skladu 6 klobouků Pohled na problém z pohledu: fakta, emoce ,pozitivní, negativní, kreativní myšlení, přemýšlivý Obsahová strategie Plánování, tvorba vyhodnocení obsahu, obsah i pro marketingové kanály, současný web Design studio Týmy lidí se stejným zadáním, řeší problém * Výčet některých postupů
- 8. Fáze 3b. Návrh webu - wireframe Metody / postupy* Návrh informační architektury Jazyk, seskupení obsahu, třídění obsahu, přechod mezi kategoriemi Navigace webu priority obsahu (potřeby), interní hledáním, rozsah menu. Způsob zobrazení Průchod webem navazuje na uživatelský výzkum, motivace návštěvníka, průchod obvykle nezačíná na home page, průchod - odkazy, akční prvky Skyci Papírové náčrtky jednotlivých stránek, obsahu, menu Wireframe Drátěný model stránek, obsahem rozložením obsahu, přibližným zdůrazněním některých prvků Model Verze vhodná pro prezentování klientovi. Obvykle v HTML s základními nadpisy. Vždy se slovním doprovodem * Výčet některých postupů
- 9. Fáze 4. Testování, ověření návrhu Metody / postupy* Uživatelské testování Testování s jednotlivci, předem dané zadání, laboratorní či domácí prostředí Expertní externí pohled Zpětná vazba od odborníka v oboru Test formulářů Automatické či ruční testování funkcionalit webu Testování A/B Testovány postupné změny při redesignu, vliv na chování. Multivariantní testování Heat mapy Informace o využívání webu. Kliknutí, scrool mapy, mouse Chování ze statistik Vyhodnocení cílů webu dle chování ze statistik webu (Google Analytics) Gerilová testování Testování v terénu s náhodnými lidmi * Výčet některých postupů