making meaning in content and design (bloomstein at how)

Post on 18-Oct-2014

5.576 Views

Category:

Technology

0 Downloads

Preview:

Click to see full reader

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

@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

@mbloomstein | #HIDC 3

© 2013

@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.

You need this.

@mbloomstein | #HIDC 6

© 2013

© narniafans.com

@mbloomstein | #HIDC 7

© 2013

©Skillset.org

@mbloomstein | #HIDC 8

© 2013

Titles < Roles < Skills

© The Creative Group

@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

Deliverables are merely

punctuation in the

conversation.

Don’t let them replace

the conversation.

@mbloomstein | #HIDC 13

© 2013

Why content strategy?

@mbloomstein | #HIDC 14

© 2013

Why content strategy?

Because we all want the same thing,

but content keeps getting in the way.

@mbloomstein | #HIDC 15

© 2013

Why content strategy?

Launch on time

@mbloomstein | #HIDC 16

© 2013

Why content strategy?

Stay within budget

@mbloomstein | #HIDC 17

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally

@mbloomstein | #HIDC 18

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally, across channels

@mbloomstein | #HIDC 19

© 2013

Why content strategy?

Maintain a consistent user experience

visually and verbally, across channels,

among platforms and devices

@mbloomstein | #HIDC 20

© 2013

Why content strategy?

Without the team killing each other over

differences in opinion and changing goals

@mbloomstein | #HIDC 21

© 2013

Establish the

message architecture. THIS CAN

HAPPEN.

@mbloomstein | #HIDC 22

© 2013

More

like

Apple.

@mbloomstein | #HIDC 23

© 2013

@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

@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

@mbloomstein | #HIDC 26

© 2013

@mbloomstein | #HIDC 27

© 2013

From: Little MOO | Print Robot <noreply@moo.com> 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

@mbloomstein | #HIDC 28

© 2013

Message architecture…

Cheeky

Customer oriented and responsive

Helpful

@mbloomstein | #HIDC 29

© 2013

Versus brand values?

@mbloomstein | #HIDC 30

© 2013

Versus a mission or vision?

“Great design for everyone”

Vision and direction are different.

This inspires, but isn’t tactical.

@mbloomstein | #HIDC 31

© 2013

@mbloomstein | #HIDC 32

© 2013

Gracious

• Welcoming, anticipatory service

Elite and premium

• Selective membership

• “Curated” experiences

Traditional

• Enduring heritage

• Preserving appreciation for quality

Message architecture?

@mbloomstein | #HIDC 33

© 2013

@mbloomstein | #HIDC 34

© 2013

First things first.

What do you need to communicate?

@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”…

If you don’t know what

you need to communicate,

how will you know if you

succeed?

@mbloomstein | #HIDC 37

© 2013

What’s a message architecture?

A hierarchy of communication goals

that reflects a common vocabulary.

@mbloomstein | #HIDC 38

© 2013

A little thing with big impact.

@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.”

@mbloomstein | #HIDC 40

© 2013

A little thing with big impact.

@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

@mbloomstein | #HIDC 42

© 2013

@mbloomstein | #HIDC 43

© 2013

@mbloomstein | #HIDC 44

© 2013

@mbloomstein | #HIDC 45

© 2013

@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-

unsubscribe@insiders.miniusa.com

and include “Unsubscribe” and

your favorite fruit in the

subject field.

@mbloomstein | #HIDC 47

© 2013

Message architecture drives

the user experience

@mbloomstein | #HIDC 48

© 2013

…in content

@mbloomstein | #HIDC 49

© 2013

…and in design

@mbloomstein | #HIDC 50

© 2013

…and in the choice of features

and content types

@mbloomstein | #HIDC 51

© 2013

What’s a message architecture?

A hierarchy of communication goals

that reflects a common vocabulary.

@mbloomstein | #HIDC 52

© 2013

What’s a message architecture?

Concrete, shared terminology,

not abstract concepts.

@mbloomstein | #HIDC 53

© 2013

Welcoming,

but elite.

Selective?

@mbloomstein | #HIDC 54

© 2013

Traditional,

but edgy.

@mbloomstein | #HIDC 55

© 2013 ©Warby Parker

@mbloomstein | #HIDC 56

© 2013

Words are valuable,

but meaningless without

context and priority.

@mbloomstein | #HIDC 57

© 2013

Words are valuable,

but meaningless without

context and priority.

@mbloomstein | #HIDC 58

© 2013

@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

@mbloomstein | #HIDC 60

© 2013

Why do this?

Words are cheaper than comps.

@mbloomstein | #HIDC 61

© 2013

Why do this?

Refine the concept, rather than confirm

the purpose.

@mbloomstein | #HIDC 62

© 2013

Why do this?

Promote new content types to manifest

the message architecture—not just

because they’re trendy or feasible.

@mbloomstein | #HIDC 63

© 2013

Why do this?

Gain standards by which to conduct

a qualitative audit.

(What is “good” anyway?)

@mbloomstein | #HIDC 64

© 2013 © Lucas Films

@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?

@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

@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

@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

@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

@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

@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?

@mbloomstein | #HIDC 72

© 2013

Thank you!

Margot Bloomstein @mbloomstein margot@appropriateinc.com slideshare.net/mbloomstein amzn.to/CSatWork

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

top related