デザインやアートにおいて、デュオトーン(Duo Tone)はかなり昔から使われている手法ですが、ウェブデザインでは最近まであまり見かけませんでした。日本に上陸も噂されている音楽配信サービスSpotifyが、Web業界でのデュオトーントレンドの発端と言われていたりしますが、世界を中心に流行の兆しを見せています。
デュオトーンとは
デュオトーンは、2つの色合いををミックスさせた表現のことで、オリジナルカラーと、もう一方は黒かもしくはシェードカラーがよく用いられます。デュオトーンをデザインに取り入れることで、表現したいイメージを強調したり、美しく、力強い表現ができます。元々は印刷の手法として用いられてきましたが、Photoshopでも簡単に出来るようになってきました。
デュオトーンを使用した製作例
実際にデュオトーンを使用した例を見ていただきましょう。
Year in Music by Spotify
https://yearinmusic.spotify.com/en-GB
残念ながら本家Spotifyは日本からご覧いただくことはできませんが、2015年にリリースされたアーティストや楽曲を特集したウェブサイト。
絶妙なデュオトーンにエフェクトもマッチ。手始めに色選びを真似てみてもいいかも入れません。
Triple 9
http://outmonsterthemonster.com/
クライム・アクション映画「トリプル9」の英語版ウェブサイト。
赤と黒のデュオトーンで構成されており、暴力性や残忍性をうまく表現しています。
Fjord Trends
http://trends.fjordnet.com/?watch-it-listens
デザインとイノベーションのコンサルティングを手掛けるFjordの特設サイト。
コンテンツに応じて異なったカラーのデュオトーンを用いています。色の近い方は謙虚で柔らかく、落ち着いたイメージ。
Holm Marcher & Co
http://holmmarcher.dk/en/
デンマークのマーケティング会社のウェブサイト。
こちらのサイトは、デュオトーンによって真面目さやビジネス的な印象を与えています。
jonkopingssodra
http://jonkopingssodra.se/
スウェーデンのサッカーチームのウェブサイト。チームカラーであるグリーンとイエローのデュオトーンをメインビジュアルに用ています。相性のいいカラーで、健全なイメージが効果的に強調されています。
最後に
ご覧いただいた例のように、ウェブサイトにうまく取り入れることによって、与えたい印象を強調した表現が可能な一方、不自然になるリスキーな反面もあります。使いどころはとても難しいですが、皆さんもデザインに取り入れてみてはいかがでしょうか。