What is imagery in UI Design? Definition and Examples

What is imagery in UI Design? Definition and Examples

Sandesh Subedi
Dec 21, 2019

What is imagery?

An image speaks a thousand words — the most common proverb we use to describe the importance of an image. Imagery in UI design is the visual language used to help users relate to a brand, their products, adding an interactive element in the form of an image. Imagery in literature is a language that appeals to one or more of our five senses. Using images enhances the experience for the user by simplifying the complex concepts by reducing them to pictures. The human brain responds to images almost 50,000 faster than the text. The images you use should be informative, delightful. Above all, it should convey the right message to the user. We have prepared a list of imagery examples to be taken care of while utilizing imagery in UI design. Imagery in UI Design- Equal size
  • Appropriate position & size for your images.
Imagery in UI Design-Alt Text
  • Images should always have an alternative text attached to it. It still conveys the necessary information when the image fails to load.
Imagery in UI Design-Structured image
  • Every image should work as a story-teller for your interface, by conveying information in a structured, more accessible, and pictorial fashion.
Imagery in UI Design-Scalability
  • It shouldn’t be a distorted image, as it creates negative visual noise. It should be of perfect resolution and scalable across multiple devices.
Imagery in UI Design-Rule of Thirds
  • An image should constitute a point of focus. It introduces meaning to it.
Imagery in UI Design-Color blend
  • The color and the characters we use should blend well with the design aesthetics of our website or application.
Imagery in UI Design-Thumbnails
  • Introducing thumbnails (smaller images) is a good practice of providing a user with the context of what a video or an article is about in your design. You can place them over cards and can set different sizes and proportions to them.
Imagery in UI Design-Emotional response
  • Imagery evokes an emotional response from the users. In other words, it helps the user in establishing a connection with your interface.
Imagery in UI Design-Tutorials
  • Images are best used for creating tutorials of your product. Utilize images on the landing screens. It attracts the user and has high conversion rates of users as compared to if there are just texts on the screen.
In conclusion, more than just adding the element of beauty, images drive the user experience of your product.

Related Articles



© 2023 ProCreator. All rights reserved.