Design Best Practice
Masthead
Doubleclick Rich Media
Google confidential
Best Practice
There is no one right way to design a creative
It’s a complicated process and it depends a lot from the
core message, the brand guidelines, the goal and
functionality used.
But there are a few guiding principles it always help to
have in mind.
Google confidential
1. Call to Action
Impact the CTR
Be clear and concise
- Leave no doubts on the landing page content.
- Use active words.
- Give a reason to click.
- Don’t confuse users with too many buttons.
The CTA is mixed with the content and is unclear
Create a sense of urgency
- Push users to act now.
- Give an incentive to act now.
Make it stand out
- It should be the biggest button on the page.
- Use contrast colours.
- Use white spaces with the copy text.
Display it on every frames
The CTA stands out and communicate the benefit
Google confidential
- Not only on the last frame (user won’t wait).
- Test different Call To Action.
2. Images and colors
Draw attention to the creative and communicate the message
Connect images & the message
- Images should be related to the content and to
the core benefits of the product.
Direct the eye to the content
Direct eyes outside the creative. Background image brings confusion.
- Use human faces or (close-up work best).
- Profile work best to direct the eye.
- Use asymmetry or alignment.
Use strategic colors
- Contrast with YouTube background.
- Match the mood of the message (learn more).
Simplify
Direct eyes to the content. Background image highlight the message and CTA.
Google confidential
- Use simple images to not clutter the creative
with too much visual information.
- Use high quality images.
- Draw attention using famous characters.
3. Video
Increase visibility and engagement
Use the entire canvas
- Display a 970*250 intro video to draw attention.
- Insert a video carrousel.
- Activate the Full Screen option.
Don’t forget the Logo
- Place the logo in a dominant position of the
Masthead even during the video.
Interactive video
- Invite users to interact with the content of the
video to create a great user experience.
Call to action
- Add a call to action to increase the number of
video views.
Google confidential
4. Logo
Increase Brand Awareness
Always Visible
- Each frame should stand on it’s own
(don’t expect users to watch the masthead
during the whole 30 seconds).
No brand association. User need to wait to the end of the video.
Make it prominent
- Place the logo in a dominant position of the
Masthead.
- When utilizing more than one brand: prioritize
the most important logo.
The brand is communicated on every frame.
Google confidential
5. Social Network
Generate feedback on social networks
Entertain
- Don’t do brand pitch.
- Invite users to interact with Games, Polls, etc.
Personalize the content
Twitter feed is included inside the design (Gallery example)
- Create content that triggers reactions.
- Integrate Social elements directly into the
Masthead (Twitter feed, +1 button).
Call to action
- Show social buttons prominently .
- Encourage users to share with an incentive.
Include Google +1 recommendation (Gallery example)
Google confidential
6. Content
Focus on the main message
Keep it simple
- Don’t clutter the message with too many info.
- Create a strong headline that sum up the main
benefits of the product.
There is too much info, headlines are hard to detect. The core message is lost.
- Make the idea stick with a Simple, Unexpected,
Concrete, Credible and Emotion-Evoking
message.
Make it clear
- Display the core message prominently.
- Don’t make people think: use the same
semantic than your target.
Prioritize
The headline is clearly visible, there is a clear hierarchy in the content.
Google confidential
- Use a visual hierarchy to make the most
important content more visible.
7. Interactions
Create a unique experience
Make the Masthead the destination
- Display extra content through menu.
- Create mini games to engage users.
Interactive video to determine your “Power of Addiction”. Demo
Be relevant
- All interactions (even games) should help to
communicate the core message.
- Do not create interaction for the sake of it.
Call to action
- Increase the number of interaction with a strong call
to action (see Call to Action best practice).
Try a demo of Lloyds Money Manager. Demo
Tracking
- Name each exit differently to track user path. If
possible redirect to separate landing page.
Google confidential
8. Expand
Increase visibility and engagement
Collapsed panel
- Insert the most important content on the
collapsed panel (don’t hide it in the expand panel)
- If one of the goal is an high CTR, create an exit
on the collapsed panel.
Expanded panel
There is rich media in the collapse panel, the CTA is not engaging and there is no direct
exit.
- Use the huge canvas size to bring extra content
and interactions (games, videos etc.)
Call to Action
- Display a strong call to action to expand.
- Clarify what is hidden in the expand panel.
- Name exit from the collapsed and expanded
panel differently to track user path.
The collapse panel has a video, the call to action to expand is clear and a second Exit
redirects directly to the landing page (it will decrease the expansion rate but increase the
CTR).
Logo
- Insert it on all frames.
Google confidential
Sources
Other documentation
. Google conference - The human factor: Common Sense Ways
http://www.youtube.com/watch?v=-UOAa62w410
. Industry best practices
Google Benchmark: Better brand engagement with display formats
. External Studies and Books
Made to stick (Book)
The fundamental of Quality Ads Research: http://mktsci.journal.informs.org/content/18/3/333.short
Don’t make me think (Book)
Google confidential
Thank you!
Google confidential