Do-It-Yourself Digital Design:

A Guide for Marketers

Credits
Editing Neil Bhapkar Writing and Research Aaliyah Madadi Graphic Design Jenny Choi & Jose Sanchez

Do-It-Yourself Digital Design: A Guide for Marketers

Table of Contents
1 3 5 7 9 11 14 15 Introduction Layout Visual Hierarchy Font Style & Font Size Negative Space Colours Ask the Expert: Andy Edgecombe Conclusion

Do-It-Yourself Digital Design: A Guide for Marketers

Introduction
Theres no doubt that the majority of content today is being created and consumed in the digital space. According to Google, 90% of US media consumption is screenbased with 90% of people using multiple screens sequentially. Furthermore, the importance of content marketing continues to rise
Forecast: Yearly Interactive Marketing Spend (US)
$58.5 billion $49.6 billion $41 billion $67.9 billion

as companies are expected to increase their interactive marketing spend from $49.6 million in 2013 to $76.6 million in 2016. But what exactly are the best practices for designing your digital content? Regardless of whether youre using content marketing software such as Uberflip to create flipbooks, or posting your content on websites such as Wordpress, its important to ensure that your content is fully optimized for the digital world. You have the Perfect Content... But now you need the perfect design and delivery. Its easy to get lost in the hype of your

2012

2013

2014

2015

Do-It-Yourself Digital Design: A Guide for Marketers

content, but how you design and deliver your message is just as important as what youre saying. Digital users have high expectations. A report by Google found that 78% of consumers leave a site when content isnt mobile friendly. It also showed that 61% of users are unlikely to return if content isnt optimized for mobile. With the rise in multi-screen content consumption, its even more imperative to ensure that your content is accessible and engaging, regardless of the device being used by your audience. While you can use responsive design technology to serve up the perfect version of your content on any device,

A report by Google found that 78% of consumers leave a site when content isnt mobile friendly.
marketers should remember to consider all platforms and screen sizes when designing their content. Ultimately, the key to creating engaging digital content is to keep your audience in mind how do they consume content and how can you grab their attention at first glance? Lets take a look at a few best practices for creating engaging digital content.

Do-It-Yourself Digital Design: A Guide for Marketers

Layout
A recent study by Poynter Institute identified that tablet users prefer to read content in landscape mode. While print content is generally read in a portrait position (think newspaper columns), tablet readers have an overwhelming instinct to swipe horizontally. The bottom line is that to create an ideal digital page turn experience, create your content spreads in landscape mode.

Do-It-Yourself Digital Design: A Guide for Marketers

In addition, your digital content should not use more than 3 columns per page. Jose Sanchez, Communications and Design specialist at Uberflip, explains that readers attention spans are lower

for digital content versus print. Consequently, its important that your content doesnt look cluttered or overwhelming, otherwise you risk losing your audience.

Lastly, its imperative that digital content is highly visual rather than a flat text-based experience. Elements to Consider: Bullet points Charts Pictures Graphics Different font styles (for example, bold or italicize important parts of your content)

Do-It-Yourself Digital Design: A Guide for Marketers

Visual Hierarchy
Visual hierarchy is the order in which our brain perceives and categorizes content. Creating visual hierarchy is an important element in content design and can be achieved by creating visual contrast between different elements on a page. Consider the following image:

Do-It-Yourself Digital Design: A Guide for Marketers

Its evident that the image on the right is less overwhelming than the image on the left. Incorporating visual hierarchy into your contents design will increase the likelihood that readers can quickly extract your main message and continue reading if theyre interested. Visual hierarchy can be achieved by: Breaking up your content into different sections Using visuals Including spaces between paragraphs Using different colours or various-sized shapes to draw attention to specific elements on the page. For example, use larger text for main headlines

Visual hierarchy is also important if you want to focus your audiences attention on certain aspects of your page. For example, perhaps your content has various CTAs (callto-action) such as social shares or free trial buttons: by using visual hierarchy you can draw the readers attention toward these areas which increases the likelihood that theyll notice and perform the action. ConversionXL, a web design company, explains that you should determine visual hierarchy by ranking elements on your website based on your business objectives. You need to determine your goals in order to know what you should prioritize by using visual hierarchy.
6

Do-It-Yourself Digital Design: A Guide for Marketers

Font Style and Size

One of the most common pitfalls of creating digital content is using font sizes that are too small. With the multitude of different devices and screen sizes, its important to use a font style and size that your audience can easily read on any device. Consider the following two images:

The typical font size for print publications ranges from 9 point to 12 point. One of the most popular fonts for newspapers is Times New Roman.

The best font size for digital content ranges from 16 point to 18 point. Remember that your content should be optimized for mobile devices, in addition to desktops.

Do-It-Yourself Digital Design: A Guide for Marketers

Regardless of the device youre currently using, the second image is clearer and easier to read. Keep in mind that over 20% of North American web traffic comes from mobile devices with screen sizes that are generally smaller than traditional desktops. A good approach might be to first test out your font size and style on mobile to ensure that its readable. As a general rule of thumb, use font sizes that are 16 point or larger, depending on the boldness and size of your font style.

Do-It-Yourself Digital Design: A Guide for Marketers

Negative Space
It might be helpful to think of negative space as providing a visual break for your reader it makes your content more appealing and less daunting. Negative space also emphasizes your content and visuals by contrasting them against blank space. Think of your content as a photograph although its text-based, the design of your entire piece should be as aesthetically appealing as a well-taken photo. Negative space will help achieve this effect. Check out the excerpt below from a G-Adventures brochure for a good example of negative space:

Do-It-Yourself Digital Design: A Guide for Marketers

As you design your content for digital, also consider leaving ample space for enhancements such as photo galleries, videos, audio, and social media widgets. To maximize engagement, try to complement your content with enhancements where applicable.

For example, if youre writing a piece about the new features of the iPad Mini, include a photo gallery that showcases these features. One of the biggest differentiators between print and digital content is the ability to include fun and engaging enhancements, so make sure you leave enough space in your design.

Do-It-Yourself Digital Design: A Guide for Marketers

10

Colours

Strong content does not rely on colour but uses colour to enhance design elements. Colour should be used to accentuate and grab your audiences attention but a strong design should be effective even when viewed in greyscale. Ultimately, the most important elements of good design are the concept and theme; but once those are established, colour is the next ingredient for making your content pop. You should use enough colour to create contrast but avoid using too much as this can be overwhelming for
11

your reader. Generally, using a maximum of 5 harmonizing colours is enough to offer visually appealing content. Also consider planning your colour theme upfront and then be consistent with the colours and shades you use across all your content. This consistency will also create familiarity between your different pieces and can help reinforce your brand. In general, the best colours for digital are RBG, which is a palette optimized for digital content. Non-RBG colours might look dull when viewed across digital devices.

Do-It-Yourself Digital Design: A Guide for Marketers

Another key is to make colours vibrant by slightly increasing their saturation and contrast. This allows content to look sharp on any screen -- even those with lower resolution. Playing with the colour saturation/contrast are simple techniques to ensure that your content looks crisp on every device. Before and after saturation and contrast

Do-It-Yourself Digital Design: A Guide for Marketers

12

Colours
Heres a brief explanation of the psychology associated with different colours. Remember that colour is highly subjective so use these as general guidelines.

Flip to the right to see more colours

13

Do-It-Yourself Digital Design: A Guide for Marketers

Ask the Expert

As a Designer and Art Director, Andy Edgecombe has had the pleasure of working in four different continents. In late 2010, he founded andyedge. com and continues to work with experienced teams to create identities and usercentered digital designs that enhance the global brand experience. He has designed for the worlds most successful brands, including Disney, Sony, IBM, HP, Shell, Bacardi, Xerox, and Uberflip. In this interview, Andy shares best-practices on designing for digital.

Designing for Digital

Andrew Edgecombe, Creative Director

Do-It-Yourself Digital Design: A Guide for Marketers

14

Conclusion
The effectiveness of your digital design can make or break your content marketing efforts: well-designed content essentially sets the tone for your piece and piques your audiences interest in your topic. Despite the weight that design plays in todays online world, you dont need to be a seasoned designer to create a visual paradise for your audience. Through this guide, youve now acquired a comprehensive toolkit for making your content pop. And for more insight into making your design accessible on any device, heres an exclusive link to our Responsive Design whitepaper. Good luck on your visual journey!

Curious about Uberflip?

Check out our case studies to see how top brands are using our platform.

15

Do-It-Yourself Digital Design: A Guide for Marketers