DESIGN FOR WHAT 

MATTERS
www.flickr.com/photos/vfsdigitaldesign/6590371661
sara wachter-boettcher / how design / may 2014
with content strategy
Welcome to
modern web
design.
make us look
formal AND fun!
www.flickr.com/photos/bevgoodwin/9482142313/
i’m important!
put me on the
homepage!
me too!
no, me!
www.flickr.com/photos/puuikibeach/8564682770
we have our
content ready.
just need to drop
it in!
www.flickr.com/photos/karenhorton/3577837508
suddenly, print
looks pretty good.
space limitations
fixed versions
certainty
space limitations
fixed versions
certainty
space limitations
fixed versions
certainty
space limitations
fixed versions
certainty
The web has
upended design.
What’s left?
www.flickr.com/photos/27549109@N06/8452742700/
design for the
medium.
Screen sizes?
Device types?
‘‘We need to shed the notion that we
create layouts from a canvas in.
We need to flip it on its head, and create
layouts from the content out.
— Mark Boulton,

“A Richer Canvas”
Content is our
medium.
Content strategy
can guide you.
Content strategy
creates clarity.
It’s about defining
a purpose and a
realistic plan for
content.
realistic
realistic
Use it to...
• define the message
• determine priorities
• collaborate before
crunch time
MESSAGING
PRIORITIZATION
COLLABORATION
MESSAGING
PRIORITIZATION
COLLABORATION
‘‘Words are cheaper than comps.
— Margot Bloomstein
At kickoff: Create
a shared frame of
reference.
the margot
method
Who are we?
What are we trying to
communicate?
How should we sound?
the message
“mad lib”
What are our goals?
Who is our audience?
Why will they care?
What should drive our
decisions?
Outcomes trump
opinions.
MESSAGING
PRIORITIZATION
COLLABORATION
www.flickr.com/photos/bevgoodwin/9482142313/
‘‘Large organizations endure their fair
share of politics… It’s hard to navigate
these mini turf wars, so tools like
carousels are used as appeasers to keep
everyone from beating the sh** out of
each other.
— Brad Frost, “Carousels”
Strategy gives you
tools for making
tough choices.
Strategy makes it
possible to say
“no” during design.
the dot-vote
decider
www.flickr.com/photos/jason_diceman/11678089443/
‘‘Before… wireframing, we can express our
site’s information hierarchy in the
simplest possible way: as a numbered list…
No matter what the homepage looks like—
if it can correctly present this information,
it will be a victory.
— Matt Griffin,

“Responsive Comping”
What do we need?
What can we cut?
Where does this fit?
What’s the hierarchy?
MESSAGING
PRIORITIZATION
COLLABORATION
www.flickr.com/photos/puuikibeach/8564682770
‘‘Content strategy: Avoiding the 11th-
hour sh**storm problem.
— Karen McGrane
You can make
launch less painful.
www.flickr.com/photos/west_point/5357124683
create a parallel
process for content.
the rewrite
workshop
How does this reflect
our strategy (or not)?
What would need to
change to make this
on message?
Where do I start?
the divide-
and-conquer
Which jobs need to
be done?
Who is responsible?
How important are
they to the project?
www.flickr.com/photos/clam113/2666711074
start with a
team sport.
www.flickr.com/photos/dandelion-tree/4525221446
keep everyone
active.
Activities help...
• focus the team
• encourage decisions
• make the work feel
achievable
www.flickr.com/photos/merlym/3512356738/
BUT I’M A
DESIGNER!
Content strategist
Content strategy
Bring your design
skills to content
problems.
www.flickr.com/photos/101018579@N06/12068350556
WHAT’S IN
THE FRAME?
focal points
branding
feeling
action
But there’s
another side, too.
subject matter
internal resources
workflows
maintenance
www.flickr.com/photos/paulmannix/261313412
you can be
the bridge.
www.flickr.com/photos/paulmannix/261313412
what we
need to
sustain
what we
need for
launch
change can be
disorienting.
www.flickr.com/photos/adactio/12674602864/
www.flickr.com/photos/visualsensory/6849199972
content strategy
helps us focus.
Flickr images used via Creative Commons Attribution license unless otherwise noted.
Illustrations by Eva-Lotta Lamm. Used with permission.
sarawb.com // @sara_ann_marie
thank you,
BOSTON

Design for What Matters With Content Strategy