Duotone makes use of two colours, creating a rich tonal reproduction of an image through the superimposition of one contrasting colour halftone over another colour halftone. It is a recent graphic design trend with a climax in recent years that creates distinct effects invoking emotional responses in an extensive range of design applications.

WHAT IS A DUOTONE IMAGE

Simply speaking, it is an image made of two colours. You might have seen it in the advertisements of Spotify 2015. It is modern, but the technique has a long history in graphic design.

Spotfy ad 2015
Spotify ad 2015

 Depending on the colours used, it produces either a subtle or glowing, elusive or shouting effect. But it is a classic look, perfect for traditional brands, appealing to their strength, durability and accuracy. The effects vary immensely, but the resulting image is intensely coloured with opposing or distinct colour combinations.

It has become a popular style amongst agencies and brands that use it to incorporate and highlight their brands. This technique works impeccably either in print or on the website to connect with the target audience in a cheerful and interactive design.

Duotone works well with any kind of photo, but you get better results in photos with lots of contrast and a solid background to define the perfect base colour. 

HOW TO CREATE THE DUOTONE EFFECT

Adobe Photoshop lets you create any kind of full-colour image into a duotone. The Gradient Map permits you to choose your desired hue and adjust each one according to what you need, balancing the gradient until you are happy with the image’s appearance. Morgan Smith, from Layout, goes through the details on how to create a duotone image in Photoshop for the 2019 Web Design Trends course. One requirement I would encourage is to create a duplicate copy of the photo you will design so you edit the duplicate and not the original. Keep your originals safe. The original photo is unedited and untouched. If you edit it, you will do it permanently and you have no choice to go back to it if you mess it up. (It happens!) Also, saving the original reassures your audience you took the photo or that the photographer will be correctly attributed. 

puppy dog poster in duotone
Duotone effect using Gradient Map

DUOTONE TRENDS   

Bob Dylan poster
Bob Dylan psychedelic effect poster
by Michael Todd Williamson

 Duotone has seen a revival in the last years as a state of aesthetical audaciousness. As mentioned before, Spotify was the first one to bring duotone back into the market. Yet actually, the revival was already in its way with the re-toning of images and photo filters we had been using for decades.

In the nineteenth century we had the sepia photograph using various shades of brown colouring used as a preservative and to warm up the images. We still use the sepia tones to give photos a vintage appearance. Later on, we used duotone as a cost-cutting method. Instead of using the four tones of the CMYK range, the duotone used only two, allowing bigger quantity and cheaper printing.

DIFFERENT KINDS OF DUOTONE

There is an abundant variety of ways to use duotone nowadays. The technique has improved enormously and Photoshop offers many methods to do real duotone and InDesign allows you to make fake duotone that produces beautiful results. Not all fake is bad. It does depend on your reasons. See the examples below and compare the results.

Fake duotone effect
Left to right: grayscale, duotone, and fake duotone by Glenna Collett

THE MOST USED DUOTONE EFFECTS:

The Background Image

The background creates a vivid impact on the header and allows buttons or images to come up more than they would with brighter colours in the background. Use it in logos and brand identity design mockups for a significant presence.

Spotyfy duotone poster
A brightly coloured overlay on top of a background image (Spotify)

The Focal Point

With the duotone technique used in the background, you create a great focal point of the main colourful foreground image. Switch the background colours in the background photo to grayscale, the front image becomes more prominent than it would be towards a colourful background. Make the duotone effect the main feature of your design in posters and book covers as a suggestive image.

duotone poster
By subsiststudios from https://99designs.com.au/blog/trends/duotone-design/

Stripping or Splitting Methods

Pitch or angle a slice of duotone colour over your grayscale image to produce a different impact in the colourization of your image, besides making it a perspective for the eyes to follow. Use it in business designs such as brochures for a modern, non-conformist and innovative touch to your designs.

Or you may split tones in your images to make your photos stand out, working, for example, background separated from foreground or using slip-tone effects side-by-side with a gradient map.

photo of business office in duotone
Turquoise-blue against the sepia colour of the original, in different shadows and highlights, show split-toning effects
three faces in duotone effect
A perspective for the eyes to follow in stripped duotone

CHOOSE YOUR COLOURS AND TONES CAREFULLY

Use your basic colour theory to choose your colours. Most times, we get better effects with two complementary colours where high contrast is highlighted. Using the Gradient Map layer you will map colours to an image according to the image’s luminescence values. Adjust how the colours display over your photo and play with them until you find the intensity you want for the photo.

Duotones are a striking design method where you deal with the best kinds of contradiction on colours and tones to add impacting visual appeal and strengthen to contrasts to transmit the message you have for your image.  

WANT A DESIGNER TO CREATE YOUR DUOTONE TODAY?

Sources:
https://en.wikipedia.org/wiki/Duotone
https://24slides.com/presentbetter/graphic-design-trend-duotone/ https://create.adobe.com/2017/10/31/make_it_in_a_minute_duotone_effect_in_photoshop.html
https://getflywheel.com/layout/create-duotone-photoshop-how-to/#gradient
https://99designs.com.au/blog/trends/duotone-design/
https://www.bookdesignmadesimple.com/2-color-printing/
https://speckyboy.com/duo-toned-color-schemes-web-design/
https://econsultancy.com/23-examples-of-duotones-and-colour-filters-in-web-design/

Print and share this article friendly; you are free to use and reproduce it, just please attribute the Moss51 Art & Design as the original author, and link back to this post!

Print Friendly, PDF & Email
Cidinha Moss