Download - Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Transcript
Page 1: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

A BAUHAUS APPROACH TO DIGITAL STRATEGY

#GoalDrivenDesign

Michael Parler@michaelparler / prpl.rs

Page 2: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Today we’re exploring the pragmatic relationship between Goals, Strategies, and Tactics.

#GoalDrivenDesign

Page 3: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

#GoalDrivenDesign

Page 4: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

#GoalDrivenDesign

Creatives

Page 5: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

Programmers

#GoalDrivenDesign

Creatives

Page 6: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

Programmers

Marketers

#GoalDrivenDesign

Creatives

Page 7: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

Programmers

Marketers

Project Owners / Stakeholders

#GoalDrivenDesign

Creatives

Page 8: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…

Programmers

Marketers

Project Owners / Stakeholders

Corporate Businesses

#GoalDrivenDesign

Creatives

Page 9: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…Creatives

Programmers

Marketers

Project Owners / Stakeholders

Corporate Businesses

Creative Agencies

#GoalDrivenDesign

Page 10: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…Creatives

Programmers

Marketers

Project Owners / Stakeholders

Corporate Businesses

Creative Agencies

#GoalDrivenDesign

Startups

Page 11: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

To whom this concept applies…Creatives

Programmers

Marketers

Project Owners / Stakeholders

Corporate Businesses

Creative Agencies

Just about everyone here…

#GoalDrivenDesign

Startups

Page 12: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal Driven Design (GDD)A step beyond User-Centered Design. GDD supports

the realization that websites and web applications will serve two masters - End-Users and the

Stakeholders or Business Owners.

#GoalDrivenDesign

Page 13: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Page 14: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

BusinessGoals

#GoalDrivenDesign

Page 15: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

BusinessGoals

CustomerGoals

+

#GoalDrivenDesign

Page 16: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

BusinessGoals

CustomerGoals

Goal DrivenDesign

+ =

#GoalDrivenDesign

Page 17: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Products / Websites /

Applications

End Users /

Customers

Stakeholders / Business Owners

Brand Interaction

Business Relationship

Channel / AssetGoal

DrivenDesign

#GoalDrivenDesign

Page 18: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

The Bauhaus School in Dessau, GermanyBauhaus - lit. “house of construction”

#GoalDrivenDesign

Page 19: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Form Follows Function”The Bauhaus principle that the design

of a building or object should be primarily based upon its intended

function or purpose.

content: http://en.wikipedia.org/wiki/Form_follows_function

#GoalDrivenDesign

Page 20: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Form” is why vehicles are aerodynamic

#GoalDrivenDesign

Page 21: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Form” is why a bridge connect two points

#GoalDrivenDesign

Page 22: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Form” is why Google.com is just a search bar

#GoalDrivenDesign

Page 23: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

All great things lead with a functional

purpose

#GoalDrivenDesign

Page 24: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

TEDX PUGET SOUND

Simon Sinek

https://www.youtube.com/watch?v=u4ZoJKF_VuA

Start with Why: How Great Leaders Inspire Action

#GoalDrivenDesign

Page 25: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Starting with“Why”YOUR PURPOSE IN OUR DIGITAL ECONOMY

#GoalDrivenDesign

Page 26: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Why

How

What

Simon Sinek’s “Golden Circle”

#GoalDrivenDesign

Page 27: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Why

How

What

#GoalDrivenDesign

Page 28: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Defining your “Why” sets your compass for your

digital strategy.

#GoalDrivenDesign

Page 29: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal driven design ensures that every step you take, you

are fulfilling your “Why.”

#GoalDrivenDesign

Page 30: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

#GoalDrivenDesign

Page 31: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Like the Golden Circle, starting with your Goals drives your

Strategies and Tactics

#GoalDrivenDesign

Page 32: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Goals are the core.They form the foundation

of your online plans and objectives.

Goals are “why.”

#GoalDrivenDesign

Page 33: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Goals are also the measurable objectives.

You know, those S.M.A.R.T. KPIs…

Specific, Actionable, Relevant, Measurable, Time-bound

#GoalDrivenDesign

Page 34: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Strategy is the approachthat supports the

fulfillment of goals.

Strategy is “how.”

#GoalDrivenDesign

Page 35: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

“Adding new features” is not a Strategy.

“Counting likes on Facebook” is not a

Strategy.

“Re-skinning your blog” is not a Strategy.

#GoalDrivenDesign

Page 36: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

“Improving mobile experience”is a Strategy.

“Engaging insocial conversation”

is a Strategy.

“Simplifyingour lead funnel”

is a Strategy.

#GoalDrivenDesign

Page 37: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Tactics are the actionstaken to fulfill each individual strategy.

Tactics are the “what.”

#GoalDrivenDesign

Page 38: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Adding new features might be a viable Tactic.

Acquiring “likes” on Facebook might be a

Tactic.

Re-skinning a blog might be a Tactic.

#GoalDrivenDesign

Page 39: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goals

Strategies

Tactics

Be sure that your Tacticsfulfill your Strategies.

#GoalDrivenDesign

Page 40: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Some Misguided

Tactics

add a “rotating carousel” to our homepage

get “social integration” on our website

do more “parallax”

#GoalDrivenDesign

Page 41: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

If Tactics do not fulfill a Goal or Strategy, then they

are wasteful.

#GoalDrivenDesign

Page 42: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Work together to eliminate Waste

#GoalDrivenDesign

Page 43: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Wireframing without purpose is putting Tactics before Goals.

The result is a wasteful interface that fails to serve a need.

Page 44: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Page 45: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

What are the purpose of these interface elements?

Page 46: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Collaborative Goal Identification brings knowledge of users and software developers together.

#GoalDrivenDesign

content: http://jonkarpoff.com/gdd-goal-driven-design/

“ ”

Page 47: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

End-Users:Customers, prospects, employees,

partners, members, advocates.

Business Owners: Operations, developers, designers, legal,

marketing, sales, product owners.

#GoalDrivenDesign

content: http://jonkarpoff.com/gdd-goal-driven-design/

“ ”

Page 48: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Each has a stake in the success of one or more goals they expect

the product to meet.

#GoalDrivenDesign

content: http://jonkarpoff.com/gdd-goal-driven-design/

“ ”

Page 49: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Good news is that goal-driven design is amenable

to immersive design techniques and lean documentation.

#GoalDrivenDesign

content: http://jonkarpoff.com/gdd-goal-driven-design/

“ ”

Page 50: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Identification of common goals allow the creation of Archetypes or Personas.

#GoalDrivenDesign

content: http://jonkarpoff.com/gdd-goal-driven-design/

“ ”

Page 51: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Plan Strategies

Execute Tactics

DiscoverGoals

StrategySales

UXContentResearch

AnalysisArtifactsNegotiation

Typical Project Plan

AssetsTechnology

QualityMedia

Page 52: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Plan Strategies

Execute Tactics

DiscoverGoals

Strategy AssetsSales

UXContent Technology

Quality

ResearchAnalysis Media

ArtifactsNegotiation

Goals are the Drivers

Page 53: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Plan Strategies

Execute Tactics

DiscoverGoals

StrategySales

UXContentResearch

Analysis

Communication is Critical

ArtifactsNegotiation

🔗 🔗Assets

Technology

QualityMedia

Page 54: Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Page 55: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Communication breakdownis wasteful.

Over-communication is alsowasteful - e.g. “useless meetings.”

Page 56: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Plan Strategies

Execute Tactics

DiscoverGoals

Group Work & Productivity

Communication & Workflow

Group Work & Productivity

Group Work & Productivity

Meetings Meetings

Page 57: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Strategy” vs. “Tactics”

#GoalDrivenDesign

Page 58: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Strategy An efficient use of the available resources for the achievement

of the main Goal.

#GoalDrivenDesign

Page 59: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

TacticsThe tools and services to

produce a sound Strategy.

#GoalDrivenDesign

Page 60: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal:

A Practical Example…

Move my knight to respond your pawn.Tactic:

Strategy: Control the middle of the board.

Checkmate an opponent's king.

#GoalDrivenDesign

Page 61: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Strategy Tactics

#GoalDrivenDesign

Page 62: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

๏ Broaden my publishing reach

Strategy Tactics

#GoalDrivenDesign

Page 63: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

๏ Broaden my publishing reach

✓ Social listening

Strategy Tactics

#GoalDrivenDesign

Page 64: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

๏ Broaden my publishing reach

✓ Social listening

Strategy Tactics

#GoalDrivenDesign

✓ Engage in conversations

Page 65: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Strategy Tactics

๏ Connect with my audience

#GoalDrivenDesign

Page 66: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Strategy Tactics

✓ Publish my presentation on Slideshare

๏ Connect with my audience

#GoalDrivenDesign

Page 67: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Strategy Tactics

✓ Publish my presentation on Slideshare

๏ Connect with my audience

#GoalDrivenDesign

✓ Share the link on Twitter

Page 68: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

๏ Keep my audience engaged with my content

Strategy Tactics

#GoalDrivenDesign

Page 69: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

✓ Build Subscribers

Strategy Tactics

๏ Keep my audience engaged with my content

#GoalDrivenDesign

Page 70: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

✓ Build Subscribers

Strategy Tactics

๏ Keep my audience engaged with my content

#GoalDrivenDesign

✓ Publish Email Newsletters

Page 71: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Too often, companies and stakeholderslead with tactics or strategies,

rather than leading with the goal.

#GoalDrivenDesign

Page 72: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Strategy without Tactics is the slowest route to victory.

Tactics without Strategy is the noise before defeat.”

- Sun Tzu -The Art of War

#GoalDrivenDesign

Page 73: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Page 74: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Cloud Computing” is a Tactic

#GoalDrivenDesign

Page 75: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

“Migrating to the cloud” is a Strategy

#GoalDrivenDesign

Page 76: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

…which fulfills a Goal of “reducing operational costs”

#GoalDrivenDesign

Page 77: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Poor Design puts the Cart “Before” the Horse

#GoalDrivenDesign

REMEMBER FORM “FOLLOWS” FUNCTION

Page 78: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What happens when youlead with “Tactics” whendesigning or investing inUser Experience (UX)?

#GoalDrivenDesign

Page 79: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

This is a real sample from a potential client we are auditing at PRPL.

They provide recruiting services for digital talent…

Page 80: Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Page 81: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What do I search? Why can’t you just show me jobs?

Page 82: Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Page 83: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

I searched “HTML CSS”. Now what do I do?

Page 84: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

…I guess subscribe to RSS?

Page 85: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

This experience was probably designed by an engineering team

who followed Tactics (functional specs) without

consideration of the User Goals.

#GoalDrivenDesign

Page 86: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Companies invest in this softwaree.g. - Business Strategy.

Without fulfilling its users’ needse.g. - Business Goals.

#GoalDrivenDesign

Page 87: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Page 88: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Refining Your Tactics

#GoalDrivenDesign

Page 89: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

- Kaizen -

A philosophy forcontinuous

improvement.

#GoalDrivenDesign

Page 90: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Kaizen is Japanese for “good change.”

The philosophy is to “always make better.”

#GoalDrivenDesign

Page 91: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Kai (change)

#GoalDrivenDesign

Zen (good)

Page 92: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Frequent, small improvements.

Design out overburden and inconsistency.

Eliminate waste.

#GoalDrivenDesign

Page 93: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Act

PlanCheck

Do

Assess

Design

Execute

Evaluate

Page 94: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Apply Kaizen to measure and optimize Strategies & Tactics.

#GoalDrivenDesign

Page 95: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Eliminate useless features, bogus efforts, and time-consuming processes.

#GoalDrivenDesign

Page 96: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Quiz Time

#GoalDrivenDesign

Page 97: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal Strategy Tactic

#GoalDrivenDesign

Selling 15K new downloads is a…

Page 98: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal Strategy Tactic

#GoalDrivenDesign

Selling 15K new downloads is a…

Page 99: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal Strategy Tactic

#GoalDrivenDesign

Building a New Website is generally a…

Page 100: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Building a New Website is generally a…

Goal Strategy Tactic

#GoalDrivenDesign

Page 101: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Posting Jobs on LinkedIn is a…

Goal Strategy Tactic

#GoalDrivenDesign

Page 102: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Posting Jobs on LinkedIn is a…

Goal Strategy Tactic

#GoalDrivenDesign

Page 103: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Recruiting New Talent is a…

Goal Strategy Tactic

#GoalDrivenDesign

Page 104: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Goal Strategy Tactic

#GoalDrivenDesign

Recruiting New Talent is a…

Page 105: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Measure & Optimize

#GoalDrivenDesign

Page 106: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Page 107: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

There is an intelligent reason Google Analytics limits you to

20 goals per domain.

Individual Goals should be focused. They are the high-level

drivers for your business.

Page 108: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

Real Goals: Sell Products.

Acquire Customer Leads.

Call Phone Numbers.

Get Driving Directions.

Page 109: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

#GoalDrivenDesign

These are real drivers for the experience design.

Page 110: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Let’s bring it all together

#GoalDrivenDesign

Page 111: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Tackle everything in the right order…

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 112: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

✓ Identify your Business and User Goals(form follows function).

✓ Make sure everyone on each teamunderstands both goals.

✓ Develop Strategies to fulfill these Goals.

✓ Deploy Tactics to fulfill your Strategies.

✓ Measure and Improve (Kaizen).

✓ Eliminate Waste. Wasted motion is not work.

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 113: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What are your Business Goals?

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 114: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What are your Customer Goals?

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 115: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What Strategiesare you planning?

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 116: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Do your Tactics fulfill the needs of

your goals?

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 117: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

What useless processes or planned

features can you eliminate today?

Goa

l Dri

ven

Roa

dmap

#GoalDrivenDesign

Page 118: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

Questions?

#GoalDrivenDesign

Page 119: Goal-Driven Design: A Bauhaus Approach to Digital Strategy

A BAUHAUS APPROACH TO DIGITAL STRATEGY

#GoalDrivenDesign

Michael Parler@michaelparler / prpl.rs