User Experience (UX) Basics for Business

Download User Experience (UX) Basics for Business

Post on 26-Jan-2017

323 views

Category:

Business

3 download

Embed Size (px)

TRANSCRIPT

Ux Basics for BusinessA short introduction for business ownersand founders without any User Experience skills.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessIntroducing the PixieBrutal Pixie is an Australian content strategy companyOur core concept is connectionhttps://hangouts.google.com/call/6yotwmamw6b4mho3nhlknrqxmma

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessIntroducing the PixieUx projects and consulting include:The Location SA Map Viewer (2015)(unofficially) the SA Water Website (2014)A range of startup and small business websites

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessIntroducing the PixieUx projects and consulting include:The Location SA Map Viewer (2015)http://location.sa.gov.au/viewer(unofficially) the SA Water Website (2014)http://www.sawater.com.au

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessDefinitionsAccessibilityCustomer experienceUsabilityUser Experience

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for Business5 Stages of Work Plan Prepare Prototype Test Triage & Iterate

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanPlanning Ux is like planning any commercial thing that has people interaction.

Examples include books, websites, products, businesses.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanWho is your audience?

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanWho is your audience?Know who they are, and the devices they useUnderstand their contexts of useUnderstand their reasons for using the product or siteKnow when they use itKnow how they use it etc

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanWhat is the purpose of your site or product?

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanWhat is the purpose of your site or product?There are 3 parts:Your purposeYour audience's purposeThe purpose of the site or product

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanAudience + Purpose = RelevanceRelevance of the product is essential, or you wouldn't build itCreate use casesCreate a relevant user experience studyGood questions = good resultsBad questions = good results that don't help you

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 1: PlanCritical question: What problem are they solving?Know the problemKnow how you solve itUnderstand the fastest, simplest way to the solutionBuild the solutionTest for the solutionDon't frustrate people or make them think.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 2: PrepareSix minutes of thinking saves you six weeks of work

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 2: PrepareSix minutes of thinking saves you six weeks of workUse cases:WhatWhyHowWhenDefine what success looks like (key measures)

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 2: PrepareWork out your method.

For the purposes of today, I'm going to teach you the method that we use and recommend for SMEs.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypePrototyping is not developmentThere are many tools you can use.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypePrototyping is not developmentThere are many tools you can use.AxureBalsamiq MockupsOmnigraffleOther wireframing tools

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeAs far as tools go, here's our preferred one:

Paper & Pen

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeBest practice paper prototyping by Mozilla.

Mozilla used paper prototyping to go through a lot of iterations of the Firefox interface. They did it before they went back to development.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeWhen people click the right thing first, they are three times more likely to succeed in whatever they are doing.So, the first stage was to limit choice.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: Prototype ExampleThis is the firstprototype usedby Mozilla.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: Prototype ExampleThis is a lateriteration of the same page.

Note theincreasedsimplicity.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: Prototype ExampleAn early HTMLversion of the page.

Note use of colour groups.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: Prototype ExampleThe final version.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeMozilla's key learnings were:Use a method that lets you do fast, frequent iterationsTest earlyBe consistent with colour, size, and resolution.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeGood prototyping is quickPaper is the fastest prototyping methodGo to HTML in your last stages only

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessPro TipPaper prototyping also works for continuous improvement. You can use it:In meetings with people you knowIn meetings with people you don't knowOver the phone and in many other situations.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 3: PrototypeGood prototyping is quickPaper is the fastest prototyping methodGo to HTML in your last stages only

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestTypical understanding of Ux testing = $$, difficultTest components are:DesignTest conductorsObserversFocus groups are not tests or test environments.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestHow many should you test?

5 tests will surface 80% of the problems.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestThere are two types of testTask-oriented testA do they get it test

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestTask oriented tests give testers a purpose and problem to solve.What they don't do is tell them what they have to do

Task-based tests present a problem and ask for a solution. Be careful about your language: Avoid using any of the items on the prototype to describe it.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestTask oriented tests give testers a purpose and problem to solve.What they don't do is tell them what they have to do

Do they get it tests are not so directed. You still want a use case, but the purpose is to see if people understand the interface, not necessarily to solve a direct task.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestExample of task-based test phrasing.

This is good:You want red shoes.

This is not: You need to go to shoes and put the red ones in your cart.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestArrange for observers. Or alternatively, use your smartphone to record the tests.Review the tests with your team straight away. Block out the morning for tests, then lunch over a review.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 4: TestArrange for observers. Or alternatively, use your smartphone to record the tests.Review the tests with your team straight away. Block out the morning for tests, then lunch over a review.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 5: Triage & IterateKnow the difference between problems and distractionsPut them into an order that will help you test again.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 5: Triage & IterateThings to fixSurprises with an obvious solution.The first time a user encounters it and everyone goes ohhhhhhh. Fix immediately.Short, cheap wins.Changes that require almost no effort. OR things that require a bit of effort but are highly visible. Fix next.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 5: Triage & IterateThings to ignoreFeature requests. Probe deeper usually people just request what they like.Your impulse to add things. NEVER add things. More likely you need to remove things that are distracting or obstructive.Kayaks. If the user quickly realises they've gone wrong, and right themselves, and is unfazed, it isn't enough of a problem.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessStage 5: Triage & IterateFix the immediate problemsNext, fix the short, cheap winsRe-test.Rinse and repeat until you're satisfied that you've solved as much as possible.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessSometimes it's not usabilityTesting, testing, testing, and getting nowhere fast? Maybe it's the content.

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessSometimes it's not usabilityTesting, testing, testing, and getting nowhere fast? Maybe it's the content.Understandability versus usabilityPull the content out and test it without the design

#PixieSessionswww.brutalpixie.com | @brutalpixieUx Basics for BusinessOrUse a content-first method. (It's faster.)Test the content, make sure people can do