117
@rd2inc rd2inc.com

Planning for Success: Design Like a Pro

  • Upload
    rd2-inc

  • View
    634

  • Download
    3

Embed Size (px)

DESCRIPTION

Presentation for Dallas/Fort Worth WordPress Meetup, 4/24/10, by Chris Ronan and Leia Scofield of RD2, Inc.

Citation preview

Page 1: Planning for Success: Design Like a Pro

@rd2incrd2inc.com

Page 2: Planning for Success: Design Like a Pro

Chris Ronan 

    @cronan

    http://blog.rd2inc.com/archives/author/chris-ronan/

Leia Scofield      

    @leia

    http://blog.rd2inc.com/archives/author/leia/

Page 3: Planning for Success: Design Like a Pro

A Design Studio + Lab + Partner

Page 4: Planning for Success: Design Like a Pro

For companies who want to be the best in their line of business.  And, for those who recognize the importance of delivering on design innovation as a valuable tool to take on their journey

Page 5: Planning for Success: Design Like a Pro

what does "RD2" stand for?

Page 6: Planning for Success: Design Like a Pro

R = ResearchD = DesignD = Develop

Page 7: Planning for Success: Design Like a Pro
Page 8: Planning for Success: Design Like a Pro

The name, further explained:

http://blog.rd2inc.com/?p=677

Page 9: Planning for Success: Design Like a Pro

tools

Page 10: Planning for Success: Design Like a Pro

Some of our tools are obvious

     Text editors

    Graphic design software (Adobe Suite)

    Staging servers and environments

Page 11: Planning for Success: Design Like a Pro

Some are less obvious

    User Experience Plan

    WordPress

    Drupal

Page 12: Planning for Success: Design Like a Pro

Yes, we use Drupal too

Page 13: Planning for Success: Design Like a Pro

[bending spoon pic]

Page 14: Planning for Success: Design Like a Pro

But why do we love WordPress?

Page 15: Planning for Success: Design Like a Pro

[light saber pic]

Page 16: Planning for Success: Design Like a Pro
Page 17: Planning for Success: Design Like a Pro

From this...

Page 18: Planning for Success: Design Like a Pro
Page 19: Planning for Success: Design Like a Pro

To this...

Page 20: Planning for Success: Design Like a Pro

 

Page 21: Planning for Success: Design Like a Pro

 

Page 22: Planning for Success: Design Like a Pro
Page 23: Planning for Success: Design Like a Pro

 

Page 24: Planning for Success: Design Like a Pro
Page 25: Planning for Success: Design Like a Pro

 

Page 26: Planning for Success: Design Like a Pro

 

Page 27: Planning for Success: Design Like a Pro

 

Page 28: Planning for Success: Design Like a Pro

what's the big design challenge?

Page 29: Planning for Success: Design Like a Pro

design is subjective

Page 30: Planning for Success: Design Like a Pro

That's the challenge and the beautiful thing all rolled into one

Page 31: Planning for Success: Design Like a Pro

Applications of design that work best can

perform:

 

In a subjective world

In an objective world

Page 32: Planning for Success: Design Like a Pro

sub·jec·tive [suhb-jek-tiv]

-adjective

"existing in the mind; belonging to the thinking subject rather than to the object of thought" "placing excessive emphasis on one's own moods, attitudes, opinions, etc.; unduly egocentric."

Page 33: Planning for Success: Design Like a Pro

ob·jec·tive [uhb-jek-tiv]

-adjective

 "not influenced by personal feelings, interpretations, or prejudice; based on facts; unbiased: an objective opinion." "verifiable"

Page 34: Planning for Success: Design Like a Pro

Subjective:

We picked these colors because...It was the color of my first bicycle

They're the color of my dog's eyes

Because I think this color palette is beautiful

Page 35: Planning for Success: Design Like a Pro

Objective:

We picked these colors because...They support the mood of your overall company

message and go to market strategy

They are in the corporate style guide

They exemplify a fundamental change or

direction in management

They best convey the mood and message I'm

trying to communicate

Page 36: Planning for Success: Design Like a Pro

how do you design like a pro?

Page 37: Planning for Success: Design Like a Pro

Step back and add the big, three letter filter...

Page 38: Planning for Success: Design Like a Pro

WHY

Page 39: Planning for Success: Design Like a Pro

Apply "WHY" to everything

Page 40: Planning for Success: Design Like a Pro

Do it deliberately and with discipline...

Page 41: Planning for Success: Design Like a Pro

...apply it to every idea, every widget, every category, every tag, every banner, every suggestion

Page 42: Planning for Success: Design Like a Pro

or your website could start to look like this

Page 43: Planning for Success: Design Like a Pro

 

Page 44: Planning for Success: Design Like a Pro

framework for design

Page 45: Planning for Success: Design Like a Pro

Step away from WordPress

Plan

Explore

Page 46: Planning for Success: Design Like a Pro

Give yourself a context for "WHY"

Page 47: Planning for Success: Design Like a Pro

STEP 1: define your goals and objectives

Page 48: Planning for Success: Design Like a Pro

The overarching reason or purpose

The highest level mission

The key summary

Often found through core values

Page 49: Planning for Success: Design Like a Pro

Goals and Objectives (Examples for Businesses)

Page 50: Planning for Success: Design Like a Pro

"Unleash the power and authenticity of our strongest assets: our employees and our customers."

Page 51: Planning for Success: Design Like a Pro

"Encourage brand loyalty and referrals from existing customers"

Page 52: Planning for Success: Design Like a Pro

"Educate prospects about our brand"

Page 53: Planning for Success: Design Like a Pro

Goals and Objectives (for People)

Page 54: Planning for Success: Design Like a Pro

"Share my knowledge"

Page 55: Planning for Success: Design Like a Pro

"Make friends"

Page 56: Planning for Success: Design Like a Pro

"Increase my notoriety"

Page 57: Planning for Success: Design Like a Pro

"Increase notoriety of my cat"

Page 58: Planning for Success: Design Like a Pro

Spend some time thinking about goals

Try them out on friends

Tie all your decisions back to goals

Page 59: Planning for Success: Design Like a Pro

meet christine - the client

Page 60: Planning for Success: Design Like a Pro

Age: 32Location: East Dallas • Private Yoga Instructor• Specialized methodology• Needs more clients

Page 61: Planning for Success: Design Like a Pro

Christine's Goals

Page 62: Planning for Success: Design Like a Pro

STEP 2: identify your audience

Page 63: Planning for Success: Design Like a Pro

Target Audience Definition & Personas:

A detailed picture of each member of your

audience in a “day in the life of” scenario

Often created from real life individuals who are

interviewed and/or studied

Motivations and activities are observed,

discussed, and documented

Page 64: Planning for Success: Design Like a Pro

It's about Personas, their demographics,

and data related to their experiences

Page 65: Planning for Success: Design Like a Pro

Data

google analytics

quantcast

woopra

 

polls

surveys

 

Page 66: Planning for Success: Design Like a Pro

who is looking at your site?

what time of day? what day of week? where are they coming from? what pages do they visit most?

what are they searching for?

what are they browsing with?  do they come back?

Page 67: Planning for Success: Design Like a Pro

location? language? age?  gender?  education level?  income?

Page 68: Planning for Success: Design Like a Pro

Is this who you want your audience to be?

What do you need to change or improve to

make your audience the right one for your

goals?

 

WHY?

Page 69: Planning for Success: Design Like a Pro

Personas

Page 70: Planning for Success: Design Like a Pro
Page 71: Planning for Success: Design Like a Pro

christine's personas

Page 72: Planning for Success: Design Like a Pro

Persona: Julio

Age: 24Location: Uptown Dallas • Ready for one-on-one lessons• Looking for a personable expert• Internet Savvy

Page 73: Planning for Success: Design Like a Pro

Persona: Joy

Age: 29Location: Carrollton • Busy mom• Long-time client of Christine's • Can't always make private

lessons

Page 74: Planning for Success: Design Like a Pro

Persona: Naomi

Age: 42Location: Tulsa • Proficient in yoga• Wants to learn Christine's

specialty• Can occasionally attend a

workshop

Page 75: Planning for Success: Design Like a Pro

Now your WHY has a WHO. 

Page 76: Planning for Success: Design Like a Pro

STEP 3: know your competition

Page 77: Planning for Success: Design Like a Pro

Know and document your competitors

Do your Personas find them more

compelling? Why?

Make screenshots

Write your likes and dislikes 

Page 78: Planning for Success: Design Like a Pro

christine's competition

Page 79: Planning for Success: Design Like a Pro
Page 80: Planning for Success: Design Like a Pro
Page 81: Planning for Success: Design Like a Pro
Page 82: Planning for Success: Design Like a Pro
Page 83: Planning for Success: Design Like a Pro

STEP 4: find your inspiration

Page 84: Planning for Success: Design Like a Pro

It's not just about your competition

It's not just about others in your space

It's about completely different sources of

inspiration

Shoot it, snag it, scrap book it

Then document what inspires you about it

Page 85: Planning for Success: Design Like a Pro
Page 86: Planning for Success: Design Like a Pro
Page 87: Planning for Success: Design Like a Pro
Page 88: Planning for Success: Design Like a Pro
Page 89: Planning for Success: Design Like a Pro
Page 90: Planning for Success: Design Like a Pro
Page 91: Planning for Success: Design Like a Pro

STEP 5: plan your content

Page 92: Planning for Success: Design Like a Pro

Arguably your most important asset

Create an outline for anticipated content

Organize early

Write early

This informs the designer

This informs the developer

Don't forget to ask WHY 

Page 93: Planning for Success: Design Like a Pro

Pages?

Categories?

Tags?

Types of content?

Ads?

 

Posting frequency?

Multiple authors?

Page 94: Planning for Success: Design Like a Pro

Plan and write as much content as you can

BEFORE you start designing.

Page 95: Planning for Success: Design Like a Pro

christine's content

Page 96: Planning for Success: Design Like a Pro

Pages: About, Contact, Class Schedule Content Types: Photos, Video, Events, News Categories: Lessons, Links, Events, Photos, Announcements, Workshops Tags: Specific poses, locations, details

Page 97: Planning for Success: Design Like a Pro

STEP 6: list your features

Page 98: Planning for Success: Design Like a Pro

List your desired features

Every dropdown, every tag cloud, every

widget

Weigh them against your goals and

objectives...asking why.

How would your personas respond?

Page 99: Planning for Success: Design Like a Pro

Spam Prevention

Contact Form

Stats

Downloads

Related Posts

Comments

Page 100: Planning for Success: Design Like a Pro

christine's features

Page 101: Planning for Success: Design Like a Pro
Page 102: Planning for Success: Design Like a Pro

STEP 7: 

outline your needs

Page 103: Planning for Success: Design Like a Pro

Wire Framing

Prioritize your features and functions

Score each and every item

Apply them within a wire frame and be

careful not to increase your scope!

And remember: this is not design yet!

Page 104: Planning for Success: Design Like a Pro
Page 105: Planning for Success: Design Like a Pro

christine's outline

Page 106: Planning for Success: Design Like a Pro
Page 107: Planning for Success: Design Like a Pro

design like a pro

Page 108: Planning for Success: Design Like a Pro

Whether it's you, a design partner or a vendor,

now you have a collection of the most

important elements to inform design

Page 109: Planning for Success: Design Like a Pro
Page 110: Planning for Success: Design Like a Pro

If you follow a process or method with

discipline before you start design, you're

giving design a real chance

Page 111: Planning for Success: Design Like a Pro

This is the plan for your big idea.

It's your blueprint.

Page 112: Planning for Success: Design Like a Pro

Imagine you are building your home.

You need the architectural plan before

ordering the lumber.

Page 113: Planning for Success: Design Like a Pro

so remember...

Page 114: Planning for Success: Design Like a Pro

STEP 1: define your goals

STEP 2: identify your audience

STEP 3: know your competition

STEP 4: find your inspiration

STEP 5: plan your content

STEP 6: list your features

STEP 7: outline your needs 

Page 115: Planning for Success: Design Like a Pro

and always ask...

WHY

Page 116: Planning for Success: Design Like a Pro

thanks! and let the force be with you!

Page 117: Planning for Success: Design Like a Pro

@rd2incrd2inc.com