First impressions are important, even in web design. According to research, we have as little as 50 milliseconds to make an impression that determines whether someone will continue on or leave. The look and feel of a website has everything to do with a product’s visual identity, but visual identity and user experience go hand in hand. Without one, the whole experience suffers.
That’s why it’s important to set the stage for imagery early in your design process. When wireframing, you can represent imagery with boxes and lines. This will set the stage for future graphics, while first giving focus on the usability of your experience. Eventually, you’ll want to test the effectiveness of the images used to make sure the meaning you intend translates to your user.
Imagery in UX primarily refers to the use of photos, illustrations, animations, and videos. Most commonly, imagery is used for:
A hero image is an oversized display with a visual, text and navigation elements above the scroll in your design framework. The stacking and layering of the elements is completely up to the designer, but one of the most common uses is a photo with text and element overlays.