CORE MASTERCLASSST

USER EXPERIENCE

@josecaballer @thechrisdo

@theskoolrocks #theskool

C

M

Y

K

Agenda1. Introduction (02 min)

2. You (10 min)

3. At the CORE of UX (5 min)

4. Principle 1: UX Mindset (5 min)

5. Principle 2: Patterns (5 min)

6. Principle 3: Story (5 min)

7. Principle 4: Anchors (5 min)

8. Principle 5: Agreement (5 min)

9. Principle 6: Validation (5 min)

10. QA (10 min)

Jose Caballer Chief Education Officer The Skool

YOU

At the CORE of UX

THE CHANGING ROLE OF THE DESIGNER

CEO

Design Manager

Marketing Manager

Tech Manager

Designer

CEO

Design

Marketing

Designer Tech

OLD TIMES TODAY

Before Now

Before Now

SCARY

Confidence Leadership

Communication Facilitation

Setting the Frequency

©2015 The Skool

It’s about controlling the flow of decisions

It’s a conversation

Look & Feel?

Customer Needs?

Business Goals?

Features?

Comps

Revisions

Revisions

Define Brand

Define Users

Prioritize Goals

Sitemap

Wireframes

Comps

Prototype

Development

QA

Step by Step.

Brand

User Goals

Who we are

Our customers needs

Our business goals

C

M

Y

K

The Brand The User Goals

CASE STUDY 1

24

Agenda

05:00 - 05:10 Intros05:10 - 05:25 Victor Introduces Moto Di Santa Monica and the project. 05:25 - 05:45 Alignment Exercise05:45 - 06:15 Brand Attributes Exercise06:15 - 06:30 Break06:30 - 07:30 Customer Profiles07:30 - 08:30 Goals Prioritization (Features)08:30 - 09:00 Wrap up Exercise - Reflection

28

Brand Attributes

Top 5 Attributes:

Caring Risk Taking Authentic Part of A Circle Informed Equipped

X-Factor:

Exclusive Inclusive

Culture Users Voice Feeling Impact X-FactorHow would your community describe you?

How would you describe your users?

How do you sound to others?

How others feel after interacting with you?

What tangible impact do you have on others?

How are your different from others?

AdventurousRebelPassionateGafFamilyCaring

Expressive SophisticateProfessionalRisk Taking Don’t Fit

FriendAdventurousAuthenticGenuineWiseGuide

ExcitedSafeUniqueImportantPart Of A Circle

Grow CommunityStatusExclusiveMore EducatedGuidanceInformed Equipped

ExperienceExclusive Inclusive Sage AdviceTrusted Firm

Moto Club Di Santa Monica

MCSM provides a Italian motorcycle sales and services to adventurous

professionals in a caring environment with an authentic voice. Helping them

feel they are part of a trusted family and leaving them better equipped to

succeed in their motorcycle lifestyle.

User ProfileDemographics

• 48 Years Old• Male• Second wife• 4 kids

Story

• Work on a stressful job with high power deals.

• Have to manage 100 people.• Want to get his own job and

leave his actual work.• Escape• 1 Brotherhood• Upgrade ride

Needs

• Bespoke Service• High Standards• Look Good / shop top shelf• Community• Special treatment• Reviews exclusive• Conversation

Solutions

• CRM System Exclusive events• Appeal, previews accessories,

Branded…• Newsletter• Featured • Service level• Membership Club

First Name: John McRowMiddle Aged Entrepreneur

RevenueTerm Description Desireablity Doability Total

M Premium Membership 10 7 17

S Accessories online 10 8 18

S Apparel online 10 8 18

S Service Appointment/leads 9 7 16

S Lead Gen Bikes/ Quality 10 7 17

S Financing Partner 10 9 19

M Return Business/Process 9 6 15

S Newsletter 8 9 17

AwarenessTerm Description Desireablity Doability Total

ML Retail Vision/Instore Exp 10 5 15

M Live help 5 6 11

S Finance calculation 7 8 15

L Video Comercial 9 4 13

S Video content 10 8 18

SM Marketing Materials / New 8 6 14

M News information 9 5 14

S Social Media (strategy) 10 6 16

EfficiencyTerm Description Desireablity Doability Total

S Featured Customers 10 7 17

S Customer Stories 10 8 18

M CRM 10 5 15

M Retargeting 7 6 13

M Facebook Ads 9 8 17

S Rate/ Review/ Wishlist 10 8 18

S Fun Engagement 10 8 18

S French Fun Toilet/website 10 8 18

Our Goals / Focus 1. Get Accessories online

2. Get Apparel online

3. Financing Partner

4. Video content

5. Customer Stories

6. Fun Engagement

7. French Fun Toilet / Website

CORE is the foundation for the conversation

Now you have to use the foundation to direct your project

39

40

41

42

1: Have a UX Mindset

• UX is not just the deliverables, it’s the conversation. • The mindset requires people skills and communication. • You have to experiement with many approaches.

Flexibility, empathy and adaptablity are key.

©2015 Chris Do 44

3 DIMENSIONAL DESIGN

DeliveryFacilitation

Visualization

It’s less about the deliverables and more about the client feeling included in the decision making.

2: Understand UX PatternsThere are already standard UI/UX patterns for Mobile, responsive web and almost any device.

• Do a competitive audit. • Ask you client’s what apps and sites they like. • Confirm pattern preferences with your client.

BKLYNA very complete template

ready to go for our

products.

https://themes.shopify.com/themes/brooklyn/styles/brooklyn/preview

JumpstartSimple, designed for one product but can be

expanded.

https://themes.shopify.com/themes/jumpstart/styles/jumpstart

SimpleSuper simple, starts

segmenting on the left

menu.

https://themes.shopify.com/themes/jumpstart/styles/jumpstart

3: Everything is Story

•Prioritize needs and create those stories first •Schedule a story session with your clients •Document and get approval

Stories are the bridge from customer needs to customer experience.

54

Story

Sequences

Acts

Sequences Sequences Sequences Sequences

Acts Acts

Sequences

Scene

Beats

Scene Scene Scene Scene Scene Scene Scene Scene Scene Scene Scene

User StoryFirst Name: John McRowMiddle Aged Entrepreneur

Find Out

• Trusted Friend• Cool video • Get a feel

Engage

• Customer highlights• Secret members Only

group• website• Private community• About us• Bio of founder

Return

• Content• Live help• Purchase• Sign up• newsletter

Buy

• Accessories for his bike• Get more info on a bike

and come in to learn more

Share

• Reviews• Tell friend• Gift toolkit• Facebook

Advocate

• Has a big circle• He has big influence• They care about

each other • Limited edition gifts

4: Anchor Your DecisionsMove forward gradually and anchor your next steps in the last deliverable you made.

•“Mrs Client, based on the 3 priority needs we did XYZ.” •Use ‘If then’ logic. “If the brand attribute was X then the color is X.” •Make it visual and confirm often. “Can you hear me now?”

Define Brand

Define Users

Prioritize Goals

Sitemap

Wireframes

Comps

Prototype

Development

QA

Anchors

More Important

Less Important

5: Confirm AgreementsAt the end of each anchor confirm and reconfirm approval. In writing and with witnesses.

•Use a signature form at the end of each deliverable.•Ask for confirmation before moving on to the next step.•Make things visual and easy to digest for your client.

6: Validate with Real UsersIt’s not enough to use assumptions and client input. Talking to customers is the best UX tool ever. YUGE!

•Get out of the office and go talk to customers. •Coordinate with your client to do customer interviews. •Get comfortable in a 3 way conversation with your client and their customers.

CASE STUDY 2

INCAE

theskool.co/collections/kits

@josecaballer @thechrisdo

@theskoolrocks #theskool

theskool.co