Design

How To Evoke Different Sentiments With Background Images

Posted by on .

Background images serve as a setting for your content, it is the canvas of which the artist creates and clearly plays a vital role in communicating your narrative

[This is part of the Infographic Design Series. Check out the other posts!]

Background images serve as a setting for your content, it is the canvas of which the artist creates and clearly plays a vital role in communicating your narrative. In this post, I will be using a few approaches to show you the different sentiments a background image can evoke. With each example, you will learn how applying different background image and background styles can have an effect your message.

Backgrounds as an indication of your subject matter

Here’s how the same copy used against different backgrounds can influence viewer’s perception of your content.

We can see that both backgrounds strike an impression of “lifestyle” when associated with the header “Stress and Health”. However, the image on the left indicates that the scope of the topic will be on the causes and risk factors due to its dark and dull color scheme and ‘sad’ icons. The image on the right on the other hand, may stress more on the solution as it has a brighter outlook and uses ‘active’ icons.

Using images as background to reinforce your point

Let us take a look at the following example using the same background, but with different copy. This is to show you how same background can be perceived differently with accompanying copy.

bg-sentiment2

The background image used in both infographic headers above is simply a picture of a road at dusk. It is subjective in nature but may be used to portray a lonely journey, a secluded path or simply just a road at dusk.

However, accompanied by a copy, the background on the left does not just complement the topic—unexploited marketing strategy, it also delivers the message effectively. On the subject of “The Road Less Taken” (where road refers to marketing strategy), the background image carries an implicit meaning of novelty or something not done by many.

The example on the right draws out the subject of safety tips for hitchhikers. This, on the other hand, brings out an impression of a dark and dangerous road, hence, it amplifies the message about the need to be safe..

This example shows us that an image can be perceived in many ways. To evoke different sentiments with background images, you just need to look for an image that can tell your story. You have access to over 400 photos in our magic.piktochart gallery or you can even upload some of your own high quality images to customize your infographics.

How to make background images look more professional

Now, let’s get down to business. You have selected the right image to convey your key message. How do you make it look pretty and make sure your text stands out? There are a few very simple tricks that can be used to create a banner for your next email campaign, call-to-action for you signature or small visual to go along with your social media post.

Let’s illustrate them using header banners from our latest #PiktoTips series of emails.

1. Create an additional layer to add effects to your photo
To do that, simply add a rectangle shape to your canvas and cover your image with it. Next, change its color and opacity. You can play around with it to see what works best with your text. In the example below, our rectangle was black with the opacity of around 20%. This made our white text stand out better as the original image was too bright.

Banner PiktoTips#4 (1)

2. Add different fonts, numbers and icons to the mix
Don’t be afraid to mix and match different kinds of fonts and have some fun experimenting with their sizes! Take a look at some font tips in our typography blogpost if you need guidance. In the example below, we used Poiret One for the number, Not Courier Sans for the second text and Lanenar font for the third one. For the cleaner and more consistent look, try not to use 2-3 different fonts though.

Colors and Layouts

3. Take advantage of Text Frames
You might have noticed that most of the thumbnail images that accompany our blogposts consist of an image and an icon with text. We use nothing but our own Text Frames for it! You can find them under “Text” in the editor and drag and drop them to your image. This way you don’t even need to think of pairing fonts and icons.

Featured image -BI2(1)

Key takeaways

  • Whether it’s using icons or photos, make sure to keep the style consistent.
  • Select your background purposefully. Your background must be relevant to the content.
  • When in doubt, keep your background plain.

To avoid

  • Inconsistency:  Starting with a 100% image background in the first block then followed by blocks of colorful iconography.
  • Too many background patterns: Avoid having too many different background colors or patterns in different blocks.

We hope this post gets you inspired to create enriching stories with compelling and meaningful background images whether using icons or photos. Come share your story with us by leaving your comments below and don’t forget, Make Information Beautiful!

Tags:

2 Shares
Tweet
Share
Share
Pin2
Buffer
+1