Slide 1
Slide 1 text
CONTENT-FIRST DESIGN
BRAVERY.CO
#contented18
WHAT DOES IT REALLY MEAN AND HOW CAN IT ENHANCE
THE AUDIENCE EXPERIENCE?
Slide 2
Slide 2 text
JOEL G GOODMAN
PRINCIPAL, BRAVERY MEDIA
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
Bravery is a service design and product
development studio planted squarely in the
higher education sector. We create daring
solutions to the core challenges facing
institutions of higher learning.
Slide 5
Slide 5 text
@JOELGOODMAN
BRAVERY.CO | @BRAVERYMEDIA
Slide 6
Slide 6 text
CONTENT-FIRST DESIGN
BRAVERY.CO
#contented18
WHAT DOES IT REALLY MEAN AND HOW CAN IT ENHANCE
THE AUDIENCE EXPERIENCE?
Slide 7
Slide 7 text
WHAT IS
CONTENT-FIRST DESIGN?
BRAVERY.CO
#contented18
Slide 8
Slide 8 text
Content-first design is the practice of putting
users first by addressing their content needs
before assuming their visual wants.
BRAVERY.CO
#contented18
Slide 9
Slide 9 text
THE TYPICAL APPROACH
TO WEB REDESIGNS IN HIGHER EDUCATION
BRAVERY.CO
#contented18
Slide 10
Slide 10 text
THE TYPICAL APPROACH
TO WEB REDESIGNS IN HIGHER EDUCATION
BRAVERY.CO
#contented18
oversimplified
Slide 11
Slide 11 text
Leadership Mandate
Get Bids orAssign In-house
Design!
Content Migration
Fill-in the content gaps!
Option 1
Option 2
Slide 12
Slide 12 text
Leaving content till last guarantees this
web project launches in a suboptimal state.
BRAVERY.CO
#contented18
Slide 13
Slide 13 text
THE PROBLEM HERE…
BRAVERY.CO
#contented18
Slide 14
Slide 14 text
User Experience / UX
Images
VIDEO
Microcopy
Information Architecture
CONVERSION RATE OPTIMIZATION / CRO
Visual Design
User Journey Maps
Competitor Audits
Usability Studies
Interaction Design
User Personae
BRAND VOICE
CONTENT PORTABILITY
Accessibility
Search Engine Optimization / SEO
Content Engineering
Content Gap Analysis
Governance
CHANNEL DISTRIBUTION
Metadata Strategy
User Acceptance
Macro Copy
Slide 15
Slide 15 text
WHY CONTENT-FIRST?
BRAVERY.CO
#contented18
Slide 16
Slide 16 text
1.
Our content is the actual product.
BRAVERY.CO
#contented18
Slide 17
Slide 17 text
BRAVERY.CO
#contented18
Student Services Campus Accommodation Campus Life
Alumni Outreach Library Facilities
Business Services Accessibility Online Study
Slide 18
Slide 18 text
BRAVERY.CO
#contented18
Student Services Campus Accommodation Campus Life
Alumni Outreach Library Facilities
Business Services Accessibility Online Study
Slide 19
Slide 19 text
BRAVERY.CO
#contented18
Student Services Campus Accommodation Campus Life
Alumni Outreach Library Facilities
Business Services Accessibility Online Study
SERVICES ARE A
FUNCTION OF OUR CONTENT
Slide 20
Slide 20 text
AND WHAT ABOUT OUR
WEBSITES?
BRAVERY.CO
#contented18
Slide 21
Slide 21 text
Design is a function of the content it is
meant to convey.
BRAVERY.CO
#contented18
Slide 22
Slide 22 text
“Content precedes design. Design in the absence
of content is not design, it's decoration.”
BRAVERY.CO
#contented18
Jeffrey Zeldman
5 May 2008, Twitter
Slide 23
Slide 23 text
2.
Content can lend clarity to our goals.
BRAVERY.CO
#contented18
Slide 24
Slide 24 text
GOALS GET YOU
STARTED
BRAVERY.CO
#contented18
Slide 25
Slide 25 text
GOALS KEEP YOU
FOCUSED
BRAVERY.CO
#contented18
Slide 26
Slide 26 text
When you know that your new website, email, or
microsite is meant to increase applicants, enquiries, or
fundraising amounts your copy can be written with
purpose and your media chosen for maximum impact.
BRAVERY.CO
#contented18
Slide 27
Slide 27 text
GOALS REVEAL YOUR
AUDIENCES
BRAVERY.CO
#contented18
Slide 28
Slide 28 text
3.
Content helps designers do their jobs better.
BRAVERY.CO
#contented18
Slide 29
Slide 29 text
Lorem ipsum dolor amet poutine everyday carry
dreamcatcher, bespoke yr jianbing small batch tumeric
heirloom affogato. Master cleanse chillwave viral
succulents hoodie kickstarter tacos lyft. Man bun small
batch PBR&B tilde yr everyday carry vexillologist
cornhole intelligentsia tousled swag cardigan readymade
messenger bag. Slow-carb austin direct trade biodiesel
butcher. Ramps small batch food truck gastropub. Copper
mug tote bag pitchfork kickstarter pabst kogi.
Pug helvetica tacos authentic shoreditch food truck
mustache. Skateboard shabby chic quinoa, keffiyeh
bicycle rights chambray distillery keytar master
cleanse hashtag freegan banh mi tattooed meh. VHS
biodiesel whatever austin, salvia yuccie banh mi
hammock food truck cloud bread cred. Letterpress
actually sartorial literally four dollar toast air
plant mlkshk you probably haven't heard of them green
juice hell of williamsburg hoodie venmo. Fam kombucha
salvia ugh green juice retro chicharrones palo santo
HIPSTER IPSUM
Slide 30
Slide 30 text
I'm speaking with myself, number one, because I have a
very good brain and I've said a lot of things. You’re
disgusting.
The concept of Lorem Ipsum was created by and for the
Chinese in order to make U.S. design jobs non-
competitive. I’m the best thing that ever happened to
placeholder text. Look at that text! Would anyone use
that? Can you imagine that, the text of your next
webpage?! Trump Ipsum is calling for a total and
complete shutdown of Muslim text entering your website.
Be careful, or I will spill the beans on your
placeholder text. I know words. I have the best words.
Does everybody know that pig named Lorem Ipsum? She's a
disgusting pig, right? I'm speaking with myself, number
one, because I have a very good brain and I've said a
lot of things. You're telling the enemy exactly what
you're going to do. No wonder you've been fighting
Lorem Ipsum your entire adult life.
TRUMP IPSUM
Slide 31
Slide 31 text
Hodor hodor. HODOR hodor, hodor. Hodor, hodor, hodor
hodor. HODOR hodor, hodor. Hodor hodor! Hodor! Hodor
hodor. Hodor hodor HODOR! Hodor. Hodor hodor.
Hodor? HODOR HODOR! HODOR HODOR! Hodor hodor! Hodor,
hodor. Hodor. Hodor... Hodor hodor.
Hodor hodor. Hodor hodor. HODOR HODOR! Hodor hodor.
Hodor, hodor. Hodor. Hodor. Hodor? Hodor hodor. HODOR
hodor, hodor.
Hodor hodor! Hodor hodor HODOR! Hodor. Hodor, hodor,
hodor hodor. HODOR? Hodor! Hodor hodor. Hodor? Hodor,
hodor. Hodor. HODOR hodor, hodor. HODOR? Hodor, hodor.
Hodor. Hodor! Hodor hodor.
Hodor, hodor, hodor hodor. Hodor hodor! Hodor... Hodor
hodor. Hodor! Hodor hodor. Hodor hodor! Hodor! Hodor
hodor. Hodor hodor! Hodor? HODOR HODOR! Hodor hodor!
Hodor, hodor, hodor hodor. Hodor hodor. Hodor, hodor.
HODOR IPSUM
Slide 32
Slide 32 text
(LOADS MORE GENERATORS
AT LOREMIPSUM.IO)
BRAVERY.CO
#contented18
Slide 33
Slide 33 text
SERIOUSLY, THOUGH.
BRAVERY.CO
#contented18
Slide 34
Slide 34 text
DESIGNERS NEED
PARAMETERS
BRAVERY.CO
#contented18
Slide 35
Slide 35 text
DESIGNERS NEED
PARAMETERS
BRAVERY.CO
#contented18
(I can say this because I am one)
Slide 36
Slide 36 text
LET’S LOOK AT THE
GAMING SECTOR
BRAVERY.CO
#contented18
Slide 37
Slide 37 text
“Game designers start with the story. What they add
to the experience complements and builds on the core
story; it doesn’t distract from the priority of
‘accomplish goal,’ even when that takes a year longer
than expected…”
BRAVERY.CO
#contented18
Steph Hay
29 April 2015, A List Apart
Slide 38
Slide 38 text
WHAT STORY DO YOU
NEED TO TELL?
BRAVERY.CO
#contented18
Slide 39
Slide 39 text
WHAT CONVERSATION DO YOU
WANT TO HAVE WITH YOUR
AUDIENCE?
BRAVERY.CO
#contented18
Slide 40
Slide 40 text
WHAT CAN YOUR VISITORS
LEARN THROUGH ACTIONS?
BRAVERY.CO
#contented18
Slide 41
Slide 41 text
MAPPING ACTIONS TO YOUR
NARRATIVE IS KEY
BRAVERY.CO
#contented18
Slide 42
Slide 42 text
HOW TO START
DOING THIS NOW!
BRAVERY.CO
#contented18
Slide 43
Slide 43 text
1.
Talk to your designers at the project start.
BRAVERY.CO
#contented18
Slide 44
Slide 44 text
APPROACH IT
AS A PARTNERSHIP
BRAVERY.CO
#contented18
Slide 45
Slide 45 text
YOU’RE ALL
IN THIS TOGETHER.
BRAVERY.CO
#contented18
Slide 46
Slide 46 text
2.
Include your stakeholders, but not too much.
BRAVERY.CO
#contented18
Slide 47
Slide 47 text
YOU’LL BE RESEARCHING
WHILE BUILDING BRIDGES
BRAVERY.CO
#contented18
Slide 48
Slide 48 text
CONTENT INSIGHTS COME
FROM INSIDER KNOWLEDGE
BRAVERY.CO
#contented18
Slide 49
Slide 49 text
DON’T LET OUTSIDERS
TAKE OVER.
BRAVERY.CO
#contented18
Slide 50
Slide 50 text
3.
Start writing as soon as possible.
BRAVERY.CO
#contented18
Slide 51
Slide 51 text
YOUR STAKEHOLDERS CAN
HELP YOU IDENTIFY
CONTENT GAPS
BRAVERY.CO
#contented18
Slide 52
Slide 52 text
REFERENCE CONTENT EXPERTS
IN-FLOW RATHER THAN
DURING FINAL REVISIONS
BRAVERY.CO
#contented18
Slide 53
Slide 53 text
USE TEMPLATES AND
PROTOTYPES TO HELP
IDENTIFY DESIGN NEEDS
BRAVERY.CO
#contented18
Slide 54
Slide 54 text
bonus.
These practices can actually cause an IA to
naturally reveal itself.
BRAVERY.CO
#contented18
Slide 55
Slide 55 text
Content-first design is the practice of putting
users first by addressing their content needs
before assuming their visual wants.
BRAVERY.CO
#contented18
Slide 56
Slide 56 text
QUESTIONS?
BRAVERY.CO
#contented18
Slide 57
Slide 57 text
No content