In this talk I share my findings after 4 years of working on Digital PR. We'll go through different ways of making an attractive campaign that journalists would like to feature on their articles. I don't use Linkdin a lot but you can find me at @JazBatisti on twitter if you have any questions.

1. DESIGNING FOR
DIGITAL PR
By
Jazmin Batisti

2. Summary of the talk
WHAT WE DO
WHAT I’VE
LEARNT
01. 03.
02. 04.
WHAT HAPPENS
NEXT?
CONCLUSION
My design
background and my
job at Verve.
The importance of
having wash-up
sessions and learning
from our mistakes.
Things to consider
at the time of
designing.
A summary of my
findings.

3. WHAT
WE DO
01.

4. DIGITAL CAMPAIGNS
Big Data
We gather data and
visualise it to make
it easier to digest
for the user.
01.

8. DIGITAL CAMPAIGNS
Big Data
We gather data and
visualise it to make
it easier to digest
for the user.
01.
Image Heavy
These campaigns are
very visual and focus
on images or videos.

12. DIGITAL CAMPAIGNS
Big Data
We gather data and
visualise it to make
it easier to digest
for the user.
01.
Image Heavy
These campaigns are
very visual and focus
on images or videos.
Games
Interactive games and
puzzles that
challenge the user.

17. DIGITAL CAMPAIGNS
Big Data
We gather data and
visualise it to make
it easier to digest
for the user.
01.
Image Heavy
These campaigns are
very visual and focus
on images or videos.
Games
Interactive games and
puzzles that
challenge the user.
Editorial
Heavy blocks of text
accompanied by images
or pieces of data.

20. WHAT I’VE
LEARNT
02.

21. BEFORE WE START
Brand Guidelines
How do we fit the
content with the
client’s visual
language?
02.

22. BEFORE WE START
Brand Guidelines
How do we fit the
content with the
client’s visual
language?
02.
Publications
Which are our target
publications and how
do we appeal to them?

23. BEFORE WE START
Brand Guidelines
How do we fit the
content with the
client’s visual
language?
02.
Publications
Which are our target
publications and how
do we appeal to them?
Showing the Content
What’s the best way
of displaying the
information we have?

24. BEFORE WE START
Brand Guidelines
How do we fit the
content with the
client’s visual
language?
02.
Publications
Which are our target
publications and how
do we appeal to them?
Showing the Content
What’s the best way
of displaying the
information we have?
Key Elements
Do we need to
outsource any
elements?

25. Brand Guidelines
It’s hard to get a link from a campaign
that looks too branded as it might be
perceived as advertising.

31. As you can see, both campaigns use the
same colours but we used them in very
different ways.

32. Target Publications
For the campaign to be featured, and
especially if we want it to be
embedded, we need it to look like it’ll
fit the publication’s aesthetics.

38. Showing the Content
Different concepts require different
approaches to design.
Sometimes we want our website to be
striking, but in some cases we need
to give way to the content so it can
be the protagonist.

50. Key Elements
Sometimes our campaigns require assets
that might need outsourcing. Like
videos, pictures, surveys, etc.
➔ Important! If you source images from
the internet, check copyright first.

55. THINGS TO CONSIDER
Embed Function
An effective way
to avoid nofollow
links.
02.

56. THINGS TO CONSIDER
Embed Function
An effective way
to avoid nofollow
links.
02.
Additional Assets
Extra material
can often help
us get links.

57. THINGS TO CONSIDER
Embed Function
An effective way
to avoid nofollow
links.
02.
Additional Assets
Extra material
can often help
us get links.
Responsive Design
It’s important
that our design
adapts to all
screens.

58. THINGS TO CONSIDER
Embed Function
An effective way
to avoid nofollow
links.
02.
Additional Assets
Extra material
can often help
us get links.
Responsive Design
It’s important
that our design
adapts to all
screens.
Accessibility
We need to make
sure everyone
can use and see
our campaigns
properly.

59. Embed Function
The possibility to embed a campaign
allows the user to interact with our
piece without leaving the site they’re
currently on.

63. Works within the Article
We can include a follow
link inside the code
Follow Link
Why Embed?
This allows the user to
interact with our campaign
without leaving the site

64. Things to keep in mind:
➔ White or very
light-coloured backgrounds.
➔ Avoid adding a scroll
function
➔ Don’t include sharing
buttons
➔ Avoid using client’s logo

65. Additional Assets
We use additional assets as a
reinforcement for the campaign. They
help us explore other angles, make our
emails more eye-catching and, as with
embeds, persuade the user to stay on
the article for longer.

66. Why they work:
➔ Including images or gifs in our outreach emails
helps get the attention of the journalist.

67. Why they work:
➔ Including images or gifs in our outreach emails
helps get the attention of the journalist.
➔ Additional assets (especially gifs or video)
encourage the user to stay on the article for
longer.

68. Why they work:
➔ Including images or gifs in our outreach emails
helps get the attention of the journalist.
➔ Additional assets (especially gifs or video)
encourage the user to stay on the article for
longer.
➔ If a campaign is not working very well, we can
explore other angles and create additional
assets to outreach.

69. Why they work:
➔ Including images or gifs in our outreach emails
helps get the attention of the journalist.
➔ Additional assets (especially gifs or video)
encourage the user to stay on the article for
longer.
➔ If a campaign is not working very well, we can
explore other angles and create additional
assets to outreach.
➔ If a campaign worked very well we can use them
to keep it evergreen.

83. Responsive Design
Sometimes journalists will read our
emails on the go. This means our
designs will be seen on desktop, tablet
and mobile, so we need to make sure
they look good on all devices.

84. Things to keep in mind:
➔ If your campaign is not a website (for example an
infographic) make sure the content looks well on
mobile.

85. Things to keep in mind:
➔ If your campaign is not a website (for example an
infographic) make sure the content looks well on
mobile.
➔ A good alternative is making one big infographic and
then dividing it into parts so it’s easier to see.

86. Things to keep in mind:
➔ If your campaign is not a website (for example an
infographic) make sure the content looks well on
mobile.
➔ A good alternative is making one big infographic and
then dividing it into parts so it’s easier to see.
➔ On mobile, make sure your font is at least 14px.

87. Things to keep in mind:
➔ If your campaign is not a website (for example an
infographic) make sure the content looks well on
mobile.
➔ A good alternative is making one big infographic and
then dividing it into parts so it’s easier to see.
➔ On mobile, make sure your font is at least 14px.
➔ It’s ok to sacrifice some graphs in favour of
something simple like a table if that will make it
easier for people to look at the content.

90. Accessibility
Accessibility in design is a complex
topic, but for the purpose of this talk
I’m going to focus on the need for
making designs easy to read and use for
as many people as possible.

91. Things to keep in mind:
➔ Be mindful of contrast, especially on text. If
you’re unsure about the contrast on your design, run
it through an accessibility checker like colorable
or webAIM.

92. Things to keep in mind:
➔ Be mindful of contrast, especially on text. If
you’re unsure about the contrast on your design, run
it through an accessibility checker like colorable
or webAIM.
➔ Avoid pure black on pure white and vice versa.

93. Things to keep in mind:
➔ Be mindful of contrast, especially on text. If
you’re unsure about the contrast on your design, run
it through an accessibility checker like colorable
or webAIM.
➔ Avoid pure black on pure white and vice versa.
➔ Don’t use colour as the only way to communicate
something. Don’t rely on sound either.

94. Things to keep in mind:
➔ Be mindful of contrast, especially on text. If
you’re unsure about the contrast on your design, run
it through an accessibility checker like colorable
or webAIM.
➔ Avoid pure black on pure white and vice versa.
➔ Don’t use colour as the only way to communicate
something. Don’t rely on sound either.
➔ If possible, don’t place important information on
hover.

95. Things to keep in mind:
➔ Be mindful of contrast, especially on text. If
you’re unsure about the contrast on your design, run
it through an accessibility checker like colorable
or webAIM.
➔ Avoid pure black on pure white and vice versa.
➔ Don’t use colour as the only way to communicate
something. Don’t rely on sound either.
➔ If possible, don’t place important information on
hover.
➔ Use alternative text for your images.

99. WHAT
NEXT?
03.

100. WASH–UP SESSIONS
Survey
We survey the
participants on what
worked and what
didn’t.
03.

101. WASH-UP SESSIONS
Survey
We survey the
participants on what
worked and what
didn’t.
03.
Document
We create a document
with our findings.

102. WASH-UP SESSIONS
Survey
We survey the
participants on what
worked and what
didn’t.
03.
Document
We create a document
with our findings.
Meeting
On special campaigns
we run an additional
meeting and go
through the feedback.

103. WASH-UP SESSIONS
Survey
We survey the
participants on what
worked and what
didn’t.
03.
Document
We create a document
with our findings.
Meeting
On special campaigns
we run an additional
meeting and go
through the feedback.
Learnings
We share the document
in an email so we all
learn from it.

104. Survey Questions:
➔ Do you think you were given enough time to
complete this project?
➔ What were the major challenges in your role?
➔ How would you rate the ease of this project
from a technical / practical perspective?
➔ What support or resources would have made your
job more easily accomplished?
➔ What were the notable successes/failures of our
internal work process? What were yours?
➔ How would you rate the overall collaboration
with the team?

105. Document:
➔ Overall results of survey
➔ Trends we identified
➔ Suggestions for improvements

106. Document:
➔ Overall results of survey
➔ Trends we identified
➔ Suggestions for change
Meeting:
➔ Everyone involved in the campaign should be
invited: designer, developer, outreach, project
manager, etc.
➔ The findings of the survey are discussed and we
analyse why a campaign performed the way it
did.
➔ We add the results of that discussion to the
final document.

107. CONCLUSION
04.

108. CONCLUSION
Before the Campaign
Ask ourselves key
questions that will
help us down the
line.
04.

109. CONCLUSION
Before the Campaign
Ask ourselves key
questions that will
help us down the
line.
04.
Other Features
Will this campaign
benefit from an embed
function? Any
additional assets
we’d like to use?

110. CONCLUSION
Before the Campaign
Ask ourselves key
questions that will
help us down the
line.
04.
Other Features
Will this campaign
benefit from an embed
function? Any
additional assets
we’d like to use?
During the Process
Is the campaign
showing what we
intended? Don’t be
afraid of starting
over. Test it.

111. CONCLUSION
Before the Campaign
Ask ourselves key
questions that will
help us down the
line.
04.
Other Features
Will this campaign
benefit from an embed
function? Any
additional assets
we’d like to use?
During the Process
Is the campaign
showing what we
intended? Don’t be
afraid of starting
over. Test it.
Look Back
Take a look at what
went well and what
needs improvement.
Ask other members of
the team.

112. THAT’S ALL
FOLKS!
jazmin@vervesearch.com
@JazBatisti
Jazmin Batisti

113. RESOURCES
➔ Wash up survey template by The Article Group
https://medium.com/article-group/who-shot-ya-a-better-post
-mortem-for-agencies-or-any-business-really-b9a829cd3fcb
➔ Pexels Free Image Bank https://www.pexels.com/
➔ WebAIM Contrast Checker
https://webaim.org/resources/contrastchecker/
➔ Stark (Contrast Sketch plugin)
https://www.getstark.co/
➔ MOZ on Alt text https://moz.com/learn/seo/alt-text
➔ Check that the colours on your website have good
enough contrast on colorable
https://colorable.jxnblk.com/

114. CREDITS
➔ Presentation template by Slidesgo
➔ Pictures by pexels.com
➔ Icons created by these designers from NounProject
◆ Accessibility and Survey icons by Yu Luck
◆ Assets icon by Shashank Singh
◆ Before icon by Carla Porciuncula
◆ Blog icon by lastpark
◆ Display icon by Icons Bazaar
◆ During icon by Shocho
◆ Document icon by Dennis
◆ Embed icon by Shastry
◆ Knowledge and Games icon by Supalerk Iaipawat
◆ Look back icon by Markus
◆ Meeting icon by Artworkbean
◆ Other icon by Myart
◆ Outsource icon by Andrey Vasiliev
◆ Responsive icon by Nikita Kozin
◆ Big Data icon by Eucalyp
◆ Target icon by Danil Polshin
◆ Visual icon by Anastasia Latysheva