making meaning in content and design (bloomstein at how)

72
@mbloomstein | #HIDC 1 © 2013 © 2013 MAKING MEANING IN CONTENT AND DESIGN MAKING MEANING IN CONTENT AND DESIGN Margot Bloomstein HOW Interactive Design Conference 110613 @mbloomstein #HIDC

Post on 18-Oct-2014

5.576 views

Category:

Technology


0 download

DESCRIPTION

How do you rally stakeholders around a unified user experience that’s consistent across design and content? That’s the challenge of a modern designer. Fortunately, content strategy is a powerful ally in that challenge. Amid constrained budgets, tight timelines, and unlimited interaction expectations, can you really add another tool to your toolkit? Can you afford to focus on content too? Yes—and you can’t afford to “let the client worry about it” any longer. We’ll discuss the value content strategy can add to your work and how it can help you streamline your process to save time and keep stakeholders happy. Then, we’ll discuss how to prioritize communication goals and develop a message architecture with a hands-on exercise—ideal whether you’re designing for the web, a mobile app, social media, or an offline experience. Finally, you’ll learn how to create consistency between copy, channels, and the typography and imagery you develop for those channels. There’s meaning in consistency, and you’ll explore how to master it in content and design. Presented at HOW Interactive Design Conference, #HIDC, November 6, 2013, in Chicago.

TRANSCRIPT

Page 1: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 1

© 2013 © 2013

MAKING MEANING IN CONTENT

AND DESIGN

MAKING MEANING IN

CONTENT AND DESIGN

Margot Bloomstein

HOW Interactive Design Conference

110613 @mbloomstein #HIDC

Page 2: Making Meaning in Content and Design (Bloomstein at HOW)
Page 3: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 3

© 2013

Page 4: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 4

© 2013

What is content strategy?

Planning for the creation, aggregation,

delivery, and governance of useful,

usable, and appropriate content in an

experience.

Page 5: Making Meaning in Content and Design (Bloomstein at HOW)

You need this.

Page 6: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 6

© 2013

© narniafans.com

Page 7: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 7

© 2013

©Skillset.org

Page 8: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 8

© 2013

Titles < Roles < Skills

Page 9: Making Meaning in Content and Design (Bloomstein at HOW)

© The Creative Group

Page 10: Making Meaning in Content and Design (Bloomstein at HOW)
Page 11: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 11

© 2013

Steps along the way…

Message architecture

Content audit/inventory

Prescriptive content matrix

Content model

Editorial style guidelines

Metadata guidelines

Governance guidelines

Page 12: Making Meaning in Content and Design (Bloomstein at HOW)

Deliverables are merely

punctuation in the

conversation.

Don’t let them replace

the conversation.

Page 13: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 13

© 2013

Why content strategy?

Page 14: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 14

© 2013

Why content strategy?

Because we all want the same thing,

but content keeps getting in the way.

Page 15: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 15

© 2013

Why content strategy?

Launch on time

Page 16: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 16

© 2013

Why content strategy?

Stay within budget

Page 17: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 17

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally

Page 18: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 18

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally, across channels

Page 19: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 19

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally, across channels,

among platforms and devices

Page 20: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 20

© 2013

Why content strategy?

Without the team killing each other over

differences in opinion and changing goals

Page 21: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 21

© 2013

Establish the

message architecture. THIS CAN

HAPPEN.

Page 22: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 22

© 2013

More

like

Apple.

Page 23: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 23

© 2013

Page 24: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 24

© 2013

More like Apple’s “message

architecture”

Confident but approachable; accessible

Simple

Minimal detail

Streamlined and anticipatory

Inviting, friendly

Supportive but not fawning

Page 25: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 25

© 2013

Message architecture

Cheeky

• Witty and fun

• Young without being childish

Customer oriented and responsive

• Approachable, friendly

• Championing and empowering

Helpful

• Accessible

Page 26: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 26

© 2013

Page 27: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 27

© 2013

From: Little MOO | Print Robot <[email protected]> Subject: MOO | Order 0629312615 | Confirmed Hello I'm Little MOO - the bit of software that will be managing your order with moo.com. It will shortly be sent to Big MOO, our print machine who will print it for you in the next few days. I'll let you know when it's done and on its way to you. Remember, I'm just a bit of software. So, if you have any questions regarding your order please first read our Frequently Asked Questions or contact customer services (who are real people!) Thanks, Little MOO, Print Robot

Page 28: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 28

© 2013

Message architecture…

Cheeky

Customer oriented and responsive

Helpful

Page 29: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 29

© 2013

Versus brand values?

Page 30: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 30

© 2013

Versus a mission or vision?

“Great design for everyone”

Vision and direction are different.

This inspires, but isn’t tactical.

Page 31: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 31

© 2013

Page 32: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 32

© 2013

Gracious

• Welcoming, anticipatory service

Elite and premium

• Selective membership

• “Curated” experiences

Traditional

• Enduring heritage

• Preserving appreciation for quality

Message architecture?

Page 33: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 33

© 2013

Page 34: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 34

© 2013

First things first.

What do you need to communicate?

Page 35: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 35

© 2013

First things first.

start blogging, audit the content,

consolidate site architecture, add video

testimonials, incorporate reviews, relaunch

the site, develop new brand guidelines,

switch to a new CMS, or go “mobile first”…

Page 36: Making Meaning in Content and Design (Bloomstein at HOW)

If you don’t know what

you need to communicate,

how will you know if you

succeed?

Page 37: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 37

© 2013

What’s a message architecture?

A hierarchy of communication goals

that reflects a common vocabulary.

Page 38: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 38

© 2013

A little thing with big impact.

Page 39: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 39

© 2013

A little thing with big impact.

How could we prove this is a car not like

anything else out there? It’s a small car,

but it’s premium. You get a Porsche 911

ride for a fifth of the cost. It’s got history…

but in Europe.

You need to give people content to give

them history.”

Page 40: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 40

© 2013

A little thing with big impact.

Page 41: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 41

© 2013

Message architecture

Premium technology

• Assertive; ready to perform as a driver’s car

• Proactive and supportive of spontaneity

Classic design

• Experienced and savvy

Cheekiness

• Smart, “punny,” hip

• Fun, gleeful

Page 42: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 42

© 2013

Page 43: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 43

© 2013

Page 44: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 44

© 2013

Page 45: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 45

© 2013

Page 46: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 46

© 2013

If these emails are boring you

and you don’t mind missing out

on all the lip-smackin’ stuff

we’ll be sending in the future,

simply send a message to owner-

[email protected]

and include “Unsubscribe” and

your favorite fruit in the

subject field.

Page 47: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 47

© 2013

Message architecture drives

the user experience

Page 48: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 48

© 2013

…in content

Page 49: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 49

© 2013

…and in design

Page 50: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 50

© 2013

…and in the choice of features

and content types

Page 51: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 51

© 2013

What’s a message architecture?

A hierarchy of communication goals

that reflects a common vocabulary.

Page 52: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 52

© 2013

What’s a message architecture?

Concrete, shared terminology,

not abstract concepts.

Page 53: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 53

© 2013

Welcoming,

but elite.

Selective?

Page 54: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 54

© 2013

Traditional,

but edgy.

Page 55: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 55

© 2013 ©Warby Parker

Page 56: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 56

© 2013

Words are valuable,

but meaningless without

context and priority.

Page 57: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 57

© 2013

Words are valuable,

but meaningless without

context and priority.

Page 58: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 58

© 2013

Page 59: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 59

© 2013

How?

• Engage in a tangible, hands-on way

• Encourage debate and conversation

• Identify points of disagreement

• Prevent seagulling

• Force prioritization

• Encourage ownership & investment

Page 60: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 60

© 2013

Why do this?

Words are cheaper than comps.

Page 61: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 61

© 2013

Why do this?

Refine the concept, rather than confirm

the purpose.

Page 62: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 62

© 2013

Why do this?

Promote new content types to manifest

the message architecture—not just

because they’re trendy or feasible.

Page 63: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 63

© 2013

Why do this?

Gain standards by which to conduct

a qualitative audit.

(What is “good” anyway?)

Page 64: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 64

© 2013 © Lucas Films

Page 65: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 65

© 2013

What will you learn?

• What do we have?

• What are the patterns, elements, & types?

• Is it any good?

• What do we need to update?

• What do we need to translate?

• Where do we need more?

Page 66: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 66

© 2013

Where can you go?

• Apply a rubric to existing content, separate from

politics and history

• Prescribe new content—and reallocate budget

and resources—to address specific

communication goals

• Promote a new editorial calendar

• Consider CMS modifications to support new

content types

Page 67: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 67

© 2013

Steps along the way…

Message architecture

Content audit/inventory

Prescriptive content matrix

Content model

Editorial style guidelines

Metadata guidelines

Governance guidelines

Page 68: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 68

© 2013

Steps along the way…

Message architecture

Content audit/inventory

Prescriptive content matrix

Content model

Editorial style guidelines

Metadata guidelines

Governance guidelines

Gap analysis

Page 69: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 69

© 2013

Steps along the way…

Message architecture

Content audit/inventory

Prescriptive content matrix

Content model

Editorial style guidelines

Metadata guidelines

Governance guidelines

Gap analysis

How

Page 70: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 70

© 2013

Steps along the way…

Message architecture

Content audit/inventory

Prescriptive content matrix

Content model

Editorial style guidelines

Metadata guidelines

Governance guidelines

Gap analysis

How

By whom & when

Page 71: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 71

© 2013

But first things first:

What are you trying to

communicate?

What content do you have and

what do you need to do that?

Page 72: Making Meaning in Content and Design (Bloomstein at HOW)

@mbloomstein | #HIDC 72

© 2013

Thank you!

Margot Bloomstein @mbloomstein [email protected] slideshare.net/mbloomstein amzn.to/CSatWork

All photography © Margot Bloomstein unless otherwise noted. Screen grabs property of their respective owners at time of capture.