Color and depth are key themes this month as we look at the design trends happening across websites. Red is the primary color of choice, and you can see it almost everywhere; The new thing is that it is being used in backgrounds and as more than an accent color. In addition, 3D features and depth of field are making significant impressions.
Here’s what design is all about this month.
1. Red Backgrounds
Red is the color of power, passion and attention, but until recently, it was not the color of choice for website backgrounds. Now the trend is red as background color.
These designs are bold and in your face with bright color, feel almost salty in some cases, and a lot of impact.
But it works.
In the projects below, red is a powerful tool to help convey the message of the website design. Color requires you to engage with the design to see what is happening with the content, and in Pentel’s case, it is part of the brand’s color.
Arze uses a bold red background with a smaller narrative of a contrasting color to display items on the site. It’s an interesting and rather bold choice. The red background carries through the scroll as well. This is a use of color that is subtle but still comes across and helps to showcase products due to its high contrast.
Russia Invaded Ukraine is the perfect use of red as a color that invokes feelings of passion with content to explain the conflict. Red can be a charged color; here, that is precisely the secret.
Pentel uses a red background that is a bit softer than the previous examples. Here, red is a brand color, and they use the background to help highlight items and elements on the site. The red below also carries the scroll to keep the theme moving.
2. Icons and 3D Graphics
Three dimensional elements seem to keep ebbing and flowing with designers. We see a lot of 3D in projects, and then it seems to disappear again. It’s like we haven’t really figured out how to use it well or in a way that works with the content of the different designs.
Admittedly, creating and using 3D icons, graphics and diagrams can be difficult. They often look a bit bland and don’t go with all types of content. Therefore, they are not used that often.
Each of these projects takes a different approach:
Admilk enters with a series of 3D animations featuring the brand name. They are fun, light, and a little unexpected. The graphics include things that look like balloons, milk and cereal, and grass with flowers. (Click through to see each one.)
Refokus uses three-dimensional objects that move on a scroll to create a flow of direction and visual interest in an otherwise artistically sparse space. The objects follow the aesthetic of the scrollbar and create an interesting element that carries you through the design without overwhelming you with gimmicks.
Junni is one of those website designs that goes all in with 3D. This style of bubble rendering graphics is starting to become a 3D trend in itself as a style that is being used more and more with icons and even emojis. It has a lighthearted feel, and the animation makes it almost silly and a little childish.
3. Long Focal Depth
It’s been a while since this whole thing became a true photography or videography trend, but there are so many examples of this image/video style in projects that it can’t be ignored. Long focal depth is almost everywhere, from travel sites to architecture and e-commerce.
A long focal depth or depth of field allows the image to show a lot of space in the image in a way that is sharp and visible. Depth of field, in photographic terms, is the distance between the nearest and farthest objects in an image that are acceptably sharp.
In this trend, every website has a strong image with a lot of depth of field. The image can be still or moving, and the image is what really draws you into the design.
What’s great about this trend is that you can see a lot of scenes and even feel like you’re a part of it. It’s a visually appealing concept that can work for a variety of purposes.
Interest Media uses a video reel that slowly zooms further out. The image is beautiful, and the text overlay is easy to read and understand. It almost feels like you are walking back on the bridge in the video.
Bloomingdales uses immersive video with plenty of depth and virtual reality features to create an immersive shopping experience. It makes you feel like you are in the store through the website and encourages shopping. It’s a fun way for the retailer to celebrate its 150th anniversary.
Arredamento Design uses photography with a wide focal range to provide interior design inspiration. Notice the crisp lines and the ease with which you engage with the image, or even imagine a room like the one in the picture. The effect used in the design, to zoom on a scroll bar, draws the user into the image even more. Depth here keeps the motion and zoom from being too much and almost allows you to see more and feel closer to things further away in the image.
There are two trends here that tend to intersect: The color red is everywhere and making a big breakthrough this fall as a dominant hue and depth, and there is a three-dimensional focus everywhere.
Both are highly usable design elements that can be easily incorporated, making them more likely to continue to feature prominently in projects.