99
Nir Kosover

UX @ Wix, keys for a successful UX design process

Embed Size (px)

DESCRIPTION

In this presentation, I will cover the basic methodology and process of doing UX design in wix as an example of a consumer web product company, referring to concepts like Agile and Lean Ux as ways of shortening the creation process. The process is demonstrated through a case study of the wix app market with an emphasize of the keys to success in implementing such process and methodologies in consumer web companies

Citation preview

Page 1: UX @ Wix, keys for a successful UX design process

Nir Kosover

Page 2: UX @ Wix, keys for a successful UX design process

Meet Mr. Jesse W. Reno

Page 3: UX @ Wix, keys for a successful UX design process

Genius!

Page 4: UX @ Wix, keys for a successful UX design process

Genius

Page 5: UX @ Wix, keys for a successful UX design process

Escalators first time users

Page 6: UX @ Wix, keys for a successful UX design process

Real users are unpredictable

Page 7: UX @ Wix, keys for a successful UX design process

About me

Page 8: UX @ Wix, keys for a successful UX design process

Real World UX

Page 9: UX @ Wix, keys for a successful UX design process

Methodology Insights

Agenda

Page 10: UX @ Wix, keys for a successful UX design process

Agenda Methodology

Insights

Page 11: UX @ Wix, keys for a successful UX design process

Traditional methodology ( waterfall )

Giphy.com

Page 12: UX @ Wix, keys for a successful UX design process

Welcome to the real world

Mcbess.com

Page 13: UX @ Wix, keys for a successful UX design process

Lean & Agile to the rescue

Page 14: UX @ Wix, keys for a successful UX design process

Iterative approaches Cutting the waste

Shortening the cycle

Lean & Agile

Page 15: UX @ Wix, keys for a successful UX design process

Lean & Agile

           

Page 16: UX @ Wix, keys for a successful UX design process

47,000,000 websites Over 190 countries

Page 17: UX @ Wix, keys for a successful UX design process
Page 18: UX @ Wix, keys for a successful UX design process
Page 19: UX @ Wix, keys for a successful UX design process
Page 20: UX @ Wix, keys for a successful UX design process
Page 21: UX @ Wix, keys for a successful UX design process
Page 22: UX @ Wix, keys for a successful UX design process

Gangs & Guild MVP* mind set

UX at Wix

Page 23: UX @ Wix, keys for a successful UX design process

Let’s create an App Market

Case study

Page 24: UX @ Wix, keys for a successful UX design process

Portable.tv

Page 25: UX @ Wix, keys for a successful UX design process

Stake holders align the product vision

Project launch (1)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 26: UX @ Wix, keys for a successful UX design process

“Knowledge is power”

Research

Francis Bacon

(2)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 27: UX @ Wix, keys for a successful UX design process

Competitor research

Wix App Market – Research

Page 28: UX @ Wix, keys for a successful UX design process

Competitor research

Wix App Market – Research

Page 29: UX @ Wix, keys for a successful UX design process

Get a feel for the final product

Prototyping (3)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 30: UX @ Wix, keys for a successful UX design process

Text is part of the product

Look for the complicated scenarios (first time, empty states, errors,

Languages, etc..)

Wire frames flow

Wix App Market - Prototyping

Page 31: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 32: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 33: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 34: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 35: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 36: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 37: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 38: UX @ Wix, keys for a successful UX design process

Wireframes flow

Wix App Market - Prototyping

Page 39: UX @ Wix, keys for a successful UX design process

Refine Continue

Decision Point

Page 40: UX @ Wix, keys for a successful UX design process

Exploring options & making decisions

Design (4)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 41: UX @ Wix, keys for a successful UX design process

Exploring designs

Wix App Market - Design

Page 42: UX @ Wix, keys for a successful UX design process

Exploring designs

Wix App Market - Design

Page 43: UX @ Wix, keys for a successful UX design process

Exploring designs

Wix App Market - Design

Page 44: UX @ Wix, keys for a successful UX design process

Decide and finalize

Design

Page 45: UX @ Wix, keys for a successful UX design process

       

Final designs

Wix App Market - Design

Page 46: UX @ Wix, keys for a successful UX design process

       

Final designs

Wix App Market - Design

Page 47: UX @ Wix, keys for a successful UX design process

       

Final designs

Wix App Market - Design

Page 48: UX @ Wix, keys for a successful UX design process

       

Final designs

Wix App Market - Design

Page 49: UX @ Wix, keys for a successful UX design process

Wix Brand Book UX Patterns as a way of life

Design

Page 50: UX @ Wix, keys for a successful UX design process

Brand Book

Wix App Market - Design

Page 51: UX @ Wix, keys for a successful UX design process

Design   UX Patterns

Wix App Market - Design

Page 52: UX @ Wix, keys for a successful UX design process

UI Library - App Market

Wix App Market - Design

Page 53: UX @ Wix, keys for a successful UX design process

Deliver properly (Style guides, responsive behavior, mobile)

Make sure it’s pixel perfect

Build (5)

Project Launch Research Prototyping Design Build Pre Release Release    

Page 54: UX @ Wix, keys for a successful UX design process

BI events Internal release

Pre Release (6)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 55: UX @ Wix, keys for a successful UX design process

Progressive Rollout (Using A/B testing)

Release (7)

Project Launch Research Prototyping Design Build Pre Release Release

   

Page 56: UX @ Wix, keys for a successful UX design process

Test & Plan

Wix App Market - Case study

Fix crucial mistakes Add new features Complete revamp

Page 57: UX @ Wix, keys for a successful UX design process

Quick survey

Page 58: UX @ Wix, keys for a successful UX design process

Current design

Wix App Market - Quick survey

Page 59: UX @ Wix, keys for a successful UX design process

New design

Wix App Market - Quick survey

Page 60: UX @ Wix, keys for a successful UX design process

1 2

What’s your favorite?

Current New

Click on categories reduced by 38.7%, Add apps reduced by 11.5%

Test results

Wix App Market - Quick survey

Page 61: UX @ Wix, keys for a successful UX design process

Think small

The Biggest Tip

flikie.com

Page 62: UX @ Wix, keys for a successful UX design process

Changing place from 5th to 4th

Small change big impact

Think small

Page 63: UX @ Wix, keys for a successful UX design process

11.4% more users open the app market 13.8% more apps added

Small change big impact

Think small

Page 64: UX @ Wix, keys for a successful UX design process

Think small

       

       

Categories & name changes

5.88% more apps added

Page 65: UX @ Wix, keys for a successful UX design process

Insights

Page 66: UX @ Wix, keys for a successful UX design process

Insights

Page 67: UX @ Wix, keys for a successful UX design process

Them &

Us

Page 68: UX @ Wix, keys for a successful UX design process

Them

mcbess.com

Know your users

Page 69: UX @ Wix, keys for a successful UX design process

Usability, Interviews, Surveys, Personas Scenarios, Use cases, Card sorting,

Experience maps ..

Know Your Users

Insights - Know your users

Page 70: UX @ Wix, keys for a successful UX design process

Design   Wix kitchen

Insights - Know your users

Page 71: UX @ Wix, keys for a successful UX design process

Design   Wix kitchen

Insights - Know your users

Page 72: UX @ Wix, keys for a successful UX design process

In coffee houses At your own desk In a special lab

Insights - Know your users

?

Page 73: UX @ Wix, keys for a successful UX design process

In coffee houses At your own desk In a special lab

Usability Testing

Insights - Know your users

Page 74: UX @ Wix, keys for a successful UX design process

Spread the word

Insights - Know your users

Page 75: UX @ Wix, keys for a successful UX design process

Nothing taste better than Cheap Feedback

Know your users

Page 76: UX @ Wix, keys for a successful UX design process

Feedback links

   

   

Know your users

Page 77: UX @ Wix, keys for a successful UX design process

Get on the phone

Know your users

Page 78: UX @ Wix, keys for a successful UX design process

Feedback  phone  call?    Hi,    I'm  Michael,  a  Product  Manager  at  Wix.com.      I'm  reaching  out  to  ask  whether  I  could  give  you  a  quick  call  to  learn  about  your  experience  with  Wix’s  Online  Store.  I’d  like  to  learn  about  your  needs  and  capture  any  feedback  that  could  help  improve  the  product  for  you  and  users  with  similar  needs.      Are  you  free  this  week  or  next  for  a  call?    Thanks  Michael  

Email example

Know your users

15-30% response rate

Sodahead.com

Page 79: UX @ Wix, keys for a successful UX design process

What do users want?

New Features

Know your users

Page 80: UX @ Wix, keys for a successful UX design process

Social channels etc..

Use your community

Know your users

Page 81: UX @ Wix, keys for a successful UX design process

Wish list

Know your users

Page 82: UX @ Wix, keys for a successful UX design process

Sometimes users know best

Don’t be afraid to ask

Know your users

Page 83: UX @ Wix, keys for a successful UX design process

How do we mark out of stock items?

Know your users

Page 84: UX @ Wix, keys for a successful UX design process

A B C

Know your users

Page 85: UX @ Wix, keys for a successful UX design process

Know your users

We’re working on a few designs, and would like to know which one you prefer

Page 86: UX @ Wix, keys for a successful UX design process

5 out of 6 responded within 24 hours

Know your users

Page 87: UX @ Wix, keys for a successful UX design process

A B C

Know your users

Page 88: UX @ Wix, keys for a successful UX design process

mcbess.free.fr

Us The team

Page 89: UX @ Wix, keys for a successful UX design process

What’s your team DNA?

Who are you’re A players?

The team

Insights - The Team

Page 90: UX @ Wix, keys for a successful UX design process

“ The main thing I’m looking for when interviewing UX candidates

Are their social skills

Aarron Walter, mailchimp

Page 91: UX @ Wix, keys for a successful UX design process

Culture

Insights - The Team

Page 92: UX @ Wix, keys for a successful UX design process

Insights - The Team

Mistakes please!

Page 93: UX @ Wix, keys for a successful UX design process

Insights - The Team

Let’s meet

Page 94: UX @ Wix, keys for a successful UX design process

Insights - The Team

Transparency

Page 95: UX @ Wix, keys for a successful UX design process

Insights - The Team

Knowledge Sharing

Page 96: UX @ Wix, keys for a successful UX design process

Where do we go from here?

Page 97: UX @ Wix, keys for a successful UX design process

Meet Alva j. Fisher

Page 98: UX @ Wix, keys for a successful UX design process

The first electric washing machine

Page 99: UX @ Wix, keys for a successful UX design process

Thanks