Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

40
Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Transcript of Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Page 1: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Page 2: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

I am Preston ZellerDigital Marketing at DiscoverOrg

Strategist, Designer, Writer, Technologist

You can find me at @zellerhaus

or PrestonZeller.com

Hey There

Page 3: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

What We’ll Cover

1. Who is this for?2. Why do we design?3. UX….or UI?4. Aligning Product & Marketing5. UX Principles & Strategy6. Design Optimization Process7. Experimentation8. FAQ

Page 4: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Who is this for?And why should you care about great UX/messaging?

1

Page 5: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Who is this for?

◉ Product ○ desktop, mobile, app

◉ Lead Generation◉ eCommerce◉ Anyone designing/building a product they

want to have maximum impact

Page 6: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Why do we design?Goals, motivation, why you care...

2

Page 7: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Solve ProblemsBring clarity to ideas, actions, and concepts

Page 8: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

EfficiencyStorytelling

Brand AwarenessExperience

Page 9: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Why does design sometimes feel like this?

Page 10: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

UX…or UI?Aren’t they the same? Not exactly.

3

Page 11: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Something that looks great but is difficult to use is exemplary of great UI and poor UX. While something very usable that looks terrible is

exemplary of great UX and poor UI.Helga Moreno

Page 12: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Keywords to define UXAnalytical (customers, competitors, etc), Strategic (content), Wireframing, Testing, Tracking, Analysis, Iteration

Page 13: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Keywords to define UIResearch, Brand, User Guides/Storyline, Interactivity & Animation, Screen size adaptation, Working with Dev

Page 14: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

It’s a Subjective Practice - Designing for the User

Page 15: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Align Product & MarketingThey’re more related than we think.

4

Page 16: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Buyer Personas

◉ What drives them?◉ What do they want to accomplish?◉ What problem are you solving for them?◉ Why you, not the ‘other guy’?

Do research on these people -

both customers and prospects

Page 17: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Value-based selling

Focus on messaging selling the financial impact relative to the price paid...relative to the competition.

Feature -> Benefit

Other areas to refine

Product launch timelines

The success of that new product hinges greatly on a the marketing roll out - communicate new features and benefits clearly so when the product it out, your buyers are ready.

Page 18: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

UX Principles &StrategyHighlights for your UX improvements

5

Page 19: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

People look up from their mobile device every 4-6

seconds

Page 20: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

How to Keep Attention?

Group Together

Different Visual Cues

Focus on Fewer

Page 21: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Patterns & SymmetryPositive emotions yield a perceived positive outcome.

So don’t bore you traffic!

Page 22: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Don’t Cause Confusion

◉ Boost feelings of achievement

◉ Understand choices and terms

◉ Cheerful, joyful messaging and imagery

Plutchik's wheel of emotions

Page 23: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Streamlining

EasierDecisions

Attention Emotions

Page 24: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Multiple Options?

FREEDOM TO ACT

Strike a Balance

Limiting the User?

PREVENTING ERRORS

Page 25: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Don’t piss off your users.

Page 26: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Design OptimizationProcessHow do we design smarter?

6

Page 27: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Set Clear Goals◉ Metrics will vary by context◉ What are the pain points?◉ Define business goals

Page 28: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Research◉ Validate hypothesis◉ Site analytics◉ UserTesting, Interviews, etc.

Page 29: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Visual Identity◉ Conveying the brand◉ Proper use of color, typography,

imagery◉ Illicit the right emotional

response

Page 30: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Content Creation◉ Information Architecture◉ Taking stock◉ Updating messaging

Page 31: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Prototyping◉ Wireframing, refined

wireframing◉ Refined to Static mock◉ They each bring upsides

Page 32: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Dev QA◉ Ensure the end experience is

what it should be◉ Speed! ◉ Crossbrowser & device

Page 33: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Launch◉ Plan to mitigate bugs,

performance issues, etc◉ Rollback plan if necessary

Page 34: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Building for ExperimentationTurn it into a conversion machine

7

Page 35: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Build a Culture Around This

A/B Testing

Comparing two elements on your page to determine which is better. Test and prove hypothesis statements.

CRO

Improve how website visitors interact with your site to take a desired action. Increase ROI with no additional expenditure on traffic acquisition

Personalization

Location, interest, interaction & purchase history. Make the overall experience with your asset more enjoyable.

Page 36: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue
Page 37: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Summing it Up

◉ Establish goals for improving UX◉ Research & Analyze ◉ Formulate a Strategy◉ Execute & Measure◉ Improve Incrementally

Page 38: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Resources

Wireframe

◉ Pen, pencil, paper◉ Sketch

Design

◉ Sketch, PS

Research

◉ UserTesting◉ Customer database

Optimization

◉ CrazyEgg◉ Optimizely◉ SumoMe◉ A/B Title Tester◉ InVision◉ Intercom

Page 39: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Any questions ?You can find me at

◉ @zellerhaus◉ PrestonZeller.com◉ [email protected]

Thanks!

Page 40: Streamlining UX: How Laser-Focused Messaging and Design Can Increase Revenue

Sources

◉ http://usabilitygeek.com/ethics-in-user-experience-design/◉ “Master Your Next Website Redesign” eBook - by Optimizely◉ https://careerfoundry.com/en/blog/ux-design/the-difference

-between-ux-and-ui-design-a-laymans-guide/◉ http://snip.ly/mjj7s#http://www.onextrapixel.com/2014/04/2

4/the-gap-between-ui-and-ux-design-know-the-difference/