How to use Images effectively in your design

Image source

Words have their power and they also have limitations as language barriers but that’s where Images come into play, whether it is to convey a message, tell a story, or evoke an emotion.

Lots of information can be packed in a picture as the quote says “A picture’s worth a thousand words”, and it’s better to show than tell, because our brain can interpret an image faster than text. Our brain is designed to perceive the world visually, and that’s what we crave.

When used right, images can make miracles, it can help you manipulate feelings and emotions. But only when used right.

Images have a certain feeling attached to them, and it is important to keep in mind that pictures with humans attract more views than pictures without. It will feel more relatable and trustworthy, especially if the picture focuses on the face.

E.g. From each online store to brands like Armani, which uses pictures of humans, as shown in the picture below, these two models looking right at us to grab our attention right away.

Image credit: Armani

Using the right image is easier said than done. So, In this article, I’m going to show you a few things to keep in mind while using images in your design

1. Know Its purpose

Before you choose an image

• Know the goals of your project
• Know the message you want to convey
• Know the emotions you want to evoke

It will help you figure out what you want to say, what emotion or experience you want your user to have while using your product, choose the right imagery to convey your message, and help you stay relevant.

E.g. Nike sports bra.

Image Credit: Nike

“It is the most important piece of apparel for the active woman — a good one enables women to play sports, and sports can give women confidence in life,” says Janett Nichol, VP of Apparel Innovation. Nike sees the sports bra as so much more than an undergarment and wants women to celebrate the sports bra and to view it as a symbol of the power they possess.

Project Nike sports bra is a great example of how a brand delivers Its message and value.

2. Choose high-quality images

Your audience will judge your product right away in the first look and If they can’t even see the images properly then your product has already given them a bad “first impression”.

Image Credit: Unsplash

There are tons of great resources out there with high-quality stock images. I will enlist some of the best resources at the end of this article, so stay tuned.

3. Ensure better contrast

If you are using text on the image then make sure that they have a clear contrast between them. Because it makes the text/message difficult to read and will make them put in efforts to read. This can be a make or break for the user.

Image Credit: Unsplash

Stark is a great tool to check the contrast between your text and image.

4. Use what’s relevant

Make sure the picture you choose matches the message you want to convey.

Because every image has something to say, a story to tell.

Figure out the story you want to tell and make sure you are telling the same story or evoke the right emotion for everyone by using the right image.

Image Credit: Unsplash

Using irrelevant images can create confusion and they take up unnecessary space and make your design feel cluttered. Using what is relevant will help your user to feel that they are in the right place, It will evoke the right emotion rather than making them feel confused.

5. Create focus

To convey a clear message or to grab their attention, you should have a clear focus. It will also help the user to understand what you want to convey through the image, by just clearing the noise.

Nike does a great job by creating a clear focus on the shoe, grabs users’ attention instantly, and without any irrelevant information. Image Credit: Nike

Best resources for free stock images

I hope after reading this article you will be able to use images more effectively and as promised here are some of the best resources:

1. Unsplash: with over 2 million high-resolution images and 207,000 contributing photographers Unsplash is my personal favorite when it comes to using images for my design.
2. Pixabay: Over 1.7 million stock images and videos are available for free download. It’s also an alternative for Unsplash.
3. Pexels: For curated collections of copyright-free images and videos. If you don’t find the right images in both of the above, go for Pexels.

Conclusion:

By using the right imagery you can improve the user experience, convey your brand’s identity, build your reputation, evoke emotions and make your user feel good while they use your product. But it’s also important to be aware of the common mistakes because they evoke negative emotions like confusion and frustration, which can give the wrong message to your users, making your product not trustworthy, or safe.

So remember these tips

1. Know It’s purpose
2. Choose high-quality images
3. Ensure better contrast
4. Use what’s relevant
5. Have a clear point of focus

References:

1. https://dribbble.com/stories/2020/05/05/7-best-practices-photography-ui-design
2. https://www.smashingmagazine.com/2017/01/more-than-just-pretty-how-imagery-drives-user-experience/
3. https://xd.adobe.com/ideas/process/ui-design/effective-use-images-graphics-ux-design/
4. https://www.toptal.com/designers/ux/user-experience-imagery
5. https://webflow.com/blog/10-essential-ui-design-tips
6. https://www.nngroup.com/articles/image-focused-design/
7. https://www.invisionapp.com/inside-design/8-tips-on-choosing-the-right-photos-for-your-design/
8. https://uxplanet.org/5-simple-rules-for-using-images-more-effectively-4dfd9352d3cb