There’s a trend brewing in website design that combines real photos and illustrations and art elements in exciting ways. It’s quirky, unique, and beautiful. Basically, a combination of visual elements that don’t seem like going together at first, but when done well, can produce a stunning aesthetic that is highly appealing and delightful. This article will provide you with tips and creative ways to develop your own design with photos and illustrations.

1. Apply Photos And Illustrations as UI Accents

You might include illustrated elements into the design all time and don’t even honestly think about it. Many user interface elements are frequently illustrated in some way. They aren’t inevitably in that hand-drawn style but have a less touchable and more “web button” look. Go one step ahead if you want to try a hand-drawn effect, or consider using a sketch as an emphasis mark. 

You can use a mix of illustrations and a hero-style video to draw users into the design; it adds a nice element of playfulness. It makes the site feel less like a sales pitch to work with the agency, and more like you would have fun together.

2. Always Illustrate First

If an illustration is your first impulse when it comes to a project, draw that outline first. After sketching out the illustrated parts you can see where the design goes before you add video or photo elements. The elaborate illustrations can be merged with a hero image; couple that with the fantastic images, and visitors would want to register to see what it is all about.

There’s another way when thinking about starting with an illustration. You can draw an astounding background image for the design. This is a fun way to get precisely what you want in the background without cleaning off the pre-made imagery.

One exciting way is to use a combo of illustrated background panels, plain white backgrounds, and black and white photo backgrounds.

3. Use Photos And Illustrations Like Typography

When you don’t have a lot of excellent imagery to play with, combine photos and illustrations in the same manner you might play with typography. Although the concept sounds unusual, it’s worth a shot. A neat illustration can emphasise a video or photo and highlight what you want users to understand.

4. Consider Illustrated Animations

Whether illustrations are hand-drawn or computer-drawn, they offer an excellent opportunity to include simple animation. From navigational tools to fun, user-engaging divots, an animated illustration can be informational, surprising and fun. However, don’t go overboard with animations. Keep them simple and practical. Every animation should have a goal for the user; it can be a link, a directional cue or a surprise that keeps them engaged.

You may not expect this approach from a serious business, like a financial planning group, investment companies, etc. But some serious businesses do opt for this style, and it has proven to be very effective. They use a blend of illustrated animation and photography elegantly. The illustrated parts of the images can make the serious stuff look a little less intimidating and help users through click paths. The illustrations also fill in color where the website falls short on other imagery. The result is a closely-knit design that is fun, engaging and easy to use.

5. Stick to Storytelling

When it comes to combining real and illustrated images, the most suitable combinations effectively tell a story. The visual must match the mood of the content and feel like part of the brand’s identity. Using this technique can work for one-off applications, but is often blended with a more complete branding strategy.

A Quick Comparison

Look at Cone Flower Creamery. The logo is illustrated. The website design uses a mostly illustrated story to establish the right mood and inspire users to learn about the brand. And, when you want to see more, there’s a photo to fill in the blanks. The design is effortless, straightforward, and focuses on the story itself, not the techniques used to create it.

On the other hand, we have Kuoz, a portfolio site, with a mix of images and illustrations. Similarly, the combination helps tell a story of who and what Kuoz is while showcasing projects. Look closely at the groupings for insight into why this design works without feeling overwhelming or cluttered. Images and illustrations are linked by similar color schemes so that every placement feels intentional and harmonious.

Conclusion

Mixing photos and illustrations is a growing trend. While the technique can look amazing, it isn’t a safe bet every time. Also, you may find it difficult to sell to a client. The question is, are you brave enough to take on this design trend? Talk to our design experts for more details.

To read more about how to use simple typography and a straightforward images in web design, Click Here