'

UX Fundamentals for Startups

Понравилась презентация – покажи это...





Слайд 0

UX FUNDAMENTALS FOR STARTUPS Pithan Rojanawong | VP, Head of UX Design & Analytics at Krungthai-AXA Life Insurance PCL


Слайд 1

HELLO, MY NAME IS PITHAN (TOZ) ➤ Short intros ➤ Name ➤ Role ➤ Experience with UX ➤ Expectation


Слайд 2

TODAY’S TOPICS ➤ What is UX? ➤ UX ≠ UI ➤ UX and Data ➤ Lean UX for Startups ➤ UX Toolkit ➤ Measuring UX ➤ Free/Affordable Tools for UX


Слайд 3

SO, WHAT EXACTLY IS UX? Intro to User Experience


Слайд 4

“ People ignore design that ignore people


Слайд 5

USER EXPERIENCE (UX) ➤ UX design is a strategic process aims to create a product that users will find easy to use, and quickly understand ➤ UX mindset focusing on delivering values, inspire the right kinds of ideas, and guides decisions ➤ UX reframes the question “What do we want to make?”, instead ask “what do we want to achieve?” (and a bunch other questions)


Слайд 6

THE UX QUESTIONS


Слайд 7


Слайд 8


Слайд 9

“…Not functioning with a case has always been the number one negative to Olloclip's products, so it's nice to have an option. Access to a functional case may persuade some people who have held off buying an Olloclip lens to try one out, and I do recommend bundling any lens purchase with a case if you're someone who doesn't like the risk of a naked iPhone….“ - MacRumor.com


Слайд 10


Слайд 11

UX ≠ UI Understand The Differences


Слайд 12

“ A user interface is like a joke. If you have to explain it, it’s not that good.


Слайд 13


Слайд 14

UI User Interface How people interact with websites/mobile apps/products UX User Experience How they feel while they’re using them


Слайд 15

WHAT MOST UX PEOPLE DO User research・User interviewing・ Gathering statistics・Personas・ Information architecture・Creating wireframes・Prototyping・Usability・User interface・Visual design・Interaction design・Content strategy・Accessibility・ Working closely with developers・ Communication with stakeholders


Слайд 16

WHAT MOST PEOPLE SEE THEY DO User research・User interviewing・ Gathering statistics・Personas・ Information architecture・Creating wireframes・Prototyping・Usability・User interface・Visual design・Interaction design・Content strategy・Accessibility・ Working closely with developers・ Communication with stakeholders


Слайд 17

IMAGE: LUXR.COM


Слайд 18

UX + UI TOGETHER IMAGE: http://www.asinthecity.com


Слайд 19

IMAGE: http://shittyuiuxanalogies.tumblr.com/


Слайд 20

Product Owner Marketing Manager Content Specialist UX Designer Project Manager Business Analyst UI Designer Developer


Слайд 21

UX AND DATA Marrying UX and Analytics


Слайд 22

DATA, A (VERY) IMPORTANT PART OF UX ➤ UX is also about data-driven decision making ➤ Especially when we already have a product. E.g. a website ➤ We can make use of web analytics data to know where is the opportunities to improve, issues to fix


Слайд 23

THE OLD WAY ➤ HIPPO (Highest Paid Person’s Opinion)


Слайд 24

DATA HAS NO VALUE ➤ Data and tools have no value ➤ It’s the people who use them, that can make the data valuable ➤ People with analytical skill


Слайд 25


Слайд 26

766 800 Other Referral Direct 619 600 539 400 200 0 May June July


Слайд 27

“… is Krungthai-AXA 12PL a type of savings or an insurance product?” Question posted on 24 Oct 2013 The link to our website that results in “Page not found” because the original page no longer exists


Слайд 28

HAVE QUESTIONS THAT DATA CAN (HELP) ANSWER ➤ You can’t expect Google Analytics to tell you what to do with your website ➤ Invest 10% in tools, 90% in people


Слайд 29

UX + DATA


Слайд 30

LEAN UX FOR STARTUPS UX for Startups


Слайд 31

LEAN UX ➤ Lean UX is researching and validating your user experience as quickly and cheaply as possible ➤ If you’re already doing UX: it’s all about getting outcomes (good UX) rather than getting outputs (UX documents) ➤ If you haven’t done UX: it’s all about picking the best learning tools from UX toolkit to match your situation


Слайд 32

LEAN UX VS AGILE UX


Слайд 33

WHY DO LEAN UX? ➤ UX doesn’t have to be expensive and time consuming ➤ Many UX tools can be done very cheap ➤ There are many free/affordable tools out there


Слайд 34

LEAN UX STARTING POINTS


Слайд 35

LEAN UX PROCESS IMAGE: LUXR.COM


Слайд 36

UX TOOLKIT UX Application for Startups


Слайд 37

TRADITIONAL UX TOOLS ➤ User Research ➤ Personas ➤ User Journeys ➤ Card Sorting ➤ Wireframes ➤ Mockups & Prototypes ➤ A/B Testing or MVT


Слайд 38

USER RESEARCH Understand Your Users & Their Needs


Слайд 39

WHY DO USER RESEARCH? ➤ It’s cheaper and faster to test assumptions and iterate with interviews, mockups and prototypes than to do those things after you launch a product


Слайд 40

USER RESEARCH ➤ Aim to understand “What are the user needs and pain points?” ➤ Question types determine research methodology What do people say? Self-report Why? Few participants What do people do? Observation How many/often? Many participants


Слайд 41

SO MANY TYPES OF RESEARCH SOURCE: H. MUELLER, GOOGLE AUS


Слайд 42

USING SOCIAL MEDIA ➤ In many cases, we can understand user needs from competitors’ social media


Слайд 43

USING SEARCH VOLUMES ➤ In other cases, we can make use of how people search for things on search engines ➤ Google AdWords provide free tool to get this data ➤ Google Trends also help


Слайд 44

INTERVIEWS ➤ Sometimes, the best way is to talk to users ➤ Keep questions open-ended ➤ Listen, listen, and listen; avoid interrupting users ➤ Plan who to interview (great if we have personas!)


Слайд 45


Слайд 46


Слайд 47

USER NEEDS ➤ …Then paraphrase quotes from your research into format “I want to X” “I want to online precheck in” “I want to be able to choose my flight time if my flight is cancelled” “I want to know what’s happening to my flight in unexpected extreme weather”


Слайд 48

USER NEEDS ➤ and create affinity diagram by grouping the related needs into groups ➤ This affinity diagram will also help us creating personas easier


Слайд 49

PERSONAS Create Characters from Your Users


Слайд 50

PERSONAS ➤ A persona is like a character that can represent a group of your users with a combination of similar demographics, behaviours, needs, goals, etc. ➤ Good personas are realistic, give actionable insights ➤ Good reference for future decisions


Слайд 51

PERSONAS SOURCE: HTTP://WWW.FAKECROW.COM


Слайд 52

PERSONAS SOURCE: MICROSOFT


Слайд 53

PERSONAS


Слайд 54


Слайд 55


Слайд 56


Слайд 57


Слайд 58


Слайд 59


Слайд 60


Слайд 61

PERSONAS ➤ Check your personas ➤ Could enough people like this exist? If not, adjust ➤ Is this a specific person you know? If yes, adjust


Слайд 62

USER FLOWS Understand Your User Journeys


Слайд 63

USER FLOWS


Слайд 64

SITE MAPS ➤ With user flows, we can create sitemap ➤ …which can also be used to test early on if it’s going to work well for users


Слайд 65

TREE TESTING ➤ Tree testing is a great way to test whether our designed content structure is really easy for users to access desired content


Слайд 66

CARD SORTING Designing Information Architect with Users


Слайд 67

CARD SORTING ➤ Card sorting is a good tool for getting to know how users would group content or features of your website or applications ➤ Increase “findability” of the web/app ➤ Can be done physically or with software


Слайд 68

CARD SORTING MADE EASY ➤ Prepare at least 30 cards ➤ Write down actions users can do on your website/mobile app, in plain language ➤ Do not write a card that force category ➤ Make them know that it’s not a test, no right or wrong ➤ Observe how participants group cards ➤ When they finish, ask them to name the category in their own words ➤ Ask them questions, try to understand their logic of grouping


Слайд 69

ANALYSE CARD SORTING RESULT ➤ Standardise group names ➤ Create standardised grid to see frequency ➤ Result of card sorting is just input for us to create information architect or sitemap that should be tested again later ➤ Card sorting won’t be useful without knowing the “why”


Слайд 70

CARD SORTING DIGITALLY ➤ Service like OptimalSort enables you to conduct card sorting online ➤ Tools like this automatically collect all the data and (almost) ready for you to analyse ➤ Downside is we don’t get to talk or observe them like doing it in person


Слайд 71

WIREFRAMES Making Sure Everyone’s on the Same Page


Слайд 72

WIREFRAMES ➤ Wireframes are great for communicating with all stakeholders ➤ Make sure everyone’s see the same thing, on the same page ➤ Adjust until finalised before UI designer work on mockups & prototypes


Слайд 73


Слайд 74


Слайд 75


Слайд 76


Слайд 77

MOCKUPS & PROTOTYPES Get Closer to the Real Thing


Слайд 78

WHEN TO DO MOCKUPS ➤ Sometimes we can do wireframes and mockups in parallel ➤ Mockups also let us see the look & feel of the final design ➤ Good for communicating with stakeholders to finalise all the small details that wireframes couldn’t


Слайд 79

WHEN TO DO PROTOTYPES ➤ When we know what’s gonna be on pages/screens and the agreed look & feel/mood & tone ➤ Hotspot prototypes = interactive prototypes that look and act similar to the real thing


Слайд 80

A/B TESTING & MULTIVARIATE TEST Qualitatively Improving Your Products


Слайд 81

A/B TESTING


Слайд 82

MULTIVARIATE TEST (MVT)


Слайд 83


Слайд 84


Слайд 85


Слайд 86


Слайд 87


Слайд 88


Слайд 89

GOOD A/B TEST OR MVT ➤ You test on something that is explainable ➤ Know what it will impact (e.g. conversion rates, more clicks, more sign ups) ➤ Sufficient visitors to make statistical significance


Слайд 90

BONUS STUFF ➤ UX Checklist http://uxchecklist.github.io/ ➤ Website UX Checklist https://keepwomen.com/ static_pages/checklist_tool


Слайд 91

MEASURING UX The Challenging Part


Слайд 92

HOW TO MEASURE SUCCESS OF UX ➤ Metrics checklist


Слайд 93

GOOD & GREAT METRICS


Слайд 94

WEB ANALYTICS FRAMEWORK


Слайд 95

KRUNGTHAI-AXA LIFE WEB ANALYTICS Website Goals E-Commerce / Lead Generation / Customer Portal / Provide Info Segmentation KPIs Goals Macro Conversions Online Sales •  E-Commerce goal completion •  Revenue/ online sales •  Traffic sources •  Geography Sales Lead •  Lead form goal completion •  Lead-to-sale conversion rate •  Traffic sources •  Geography Micro Conversions Awareness •  Website traffic •  Landing pages •  SEO impression •  SEO click-thrurate •  Traffic sources •  Media channels •  Campaigns Collect Lead Provide Info. Facilitate Customers •  Email collected •  Game user registration •  Site search usage •  Branch locator usage •  Nearby branch (GPS) usage •  PDF files download •  Live chat •  Claims form files download •  Specific page web traffic •  Contact form completion •  Traffic sources •  Media channels •  Campaigns •  Traffic sources •  Geography •  Traffic sources •  Geography


Слайд 96

FREE/ AFFORDABLE TOOLS FOR UX …for StartUps


Слайд 97

WEB ANALYTICS Web Analytics ➤ Google Analytics - Free Tools to help you record heatmaps, recording sessions, form analytics, funnels, etc ➤ Hotjar - Free, $29-$89/month ➤ MouseStats (starts $16/month) ➤ MouseFlow (starts $19/month)


Слайд 98

CREATING FLOWS, WIREFRAMES, AND PROTOTYPES Wireframes ➤ Sketch (bohemiancoding.com) $90/license ➤ Omnigraffle ($99/license) Prototyping ➤ invisionapp.com - Free, starts $20/month ➤ Axure ($289/License)


Слайд 99

USER TESTS ➤ OptimalWorkshop.com - Free, various options ➤ usertesting.com (various price plans)


Слайд 100

A/B TEST OR MVT ➤ Optimizely - Free, with enterprise plans ➤ Unbounce (starts $49/month) ➤ Visual Website Optimiser (starts $49/month)


Слайд 101

PRIORITIES FOR STARTUPS Recap… ➤ If you’re already doing UX: it’s all about getting outcomes (good UX) rather than getting outputs (UX documents) ➤ If you haven’t done UX: it’s all about picking the best learning tools from UX toolkit to match your situation


Слайд 102

THANK YOU! Pithan Rojanawong (Toz) - pithan.toz@gmail.com VP, Head of UX Design & Analytics Krungthai-AXA Life Insurance PCL


Слайд 103


×

HTML:





Ссылка: