2016年に注目したい、グラフィックデザインのトレンド9個まとめ

graphic-trend-2016-top

 

 

デザイントレンドとは、あらゆる文化やメディア、過去と現在、テクノロジー、ファッションなど、さまざまな分野から影響を受けています。つねに移り変わっていくもので、正確にいつ終わるとは決めにくいものです。

 

 

アメリカ・グラフィック・アート協会(The American Institute for Graphic Arts : AIGA)のMedeleine Morleyは、以下のように述べています。

 

トレンドは毎年出現して、煙のように消えてしまうわけではありません。その代わりに少しずつ人気が出始め、時間がたつと気づかれないまま立ち消えてしまいます。

 

今回紹介するデザイントレンドは、2015年の終わりごろから、魔法のように急に出てきたわけではありません。トレンドがピークに達するまでには時間が必要で、ここ数年でいくつものトレンドを見てきています。

 

トレンドをあまり意識しないデザイナーも、働いている分野でどのようにスタイルが変わっていくのか認識しておくことで、同じデザインの使いすぎを防いだり、トレンドにひとひねり加えて、新しいモノをつくり出すこともできるでしょう。

 

 

トレンドを正確に予想することはむずかしいですが、デザイン業界の多くのひとが、2016年に流行しそうなスタイルやアプローチ方法など、一致する考えを持っているようです。

 

 

 

詳細は以下から。

 

 

コンテンツ目次

  1. モダン・レトロスタイル
  2. マテリアル・デザイン
  3. 鮮やかで大胆な配色
  4. 幾何学模様、パターン
  5. ネガティブ・スペース
  6. 組み立て、モジュール式レイアウト
  7. 表現豊かなタイポグラフィー
  8. カスタム・イラストレーション
  9. アブストラクト、ミニマル・スタイル
  10. 参考デザイン記事まとめ

 

 

01 モダン・レトロ・スタイル “Modern” Retro Style

 

1900年代から60年代にかけて描かれた、ビンテージや古いレトロスタイルとは反対の、モダン・レトロスタイル(英: Modern Retro Style)は、1970年代から90年代に影響を受けたスタイルです。黎明期のパソコンやビデオゲーム、ピクセルアートなどを連想するとよいでしょう。おたく(英: Nerdy)文化は、新しいトレンドと言えるでしょう。

 

 

以下のデザインサンプルでは、懐かしいノスタルジックなガジェットがまとめられています。テクノロジーは、モダン・レトロとうまく調和する分野です。

 

1-1060x679

 

 

 

ミュージックストアの広告は、レトロでモダンな雰囲気をデザインに盛り込み、レコード盤と太陽系を当てはめることで見事に表現しています。

 

210-1060x662

 

 

 

80年代スタイルをはっきりと意識したステーショナリーグッズです。

 

3-1060x848WS-SUPER-COLLECTION-NOTEBOOK-JOY

 

 

 

限定モデルとしてデザインされた、「ピクセル・エディション(英: Pixel Edition)」のパッケージデザイン。1978年に登場したアーケード版ゲーム「スペースインベーダー」をモチーフにしています。

 

Screen-Shot-2016-01-15-at-2.30.14-PM-1060x1623

 

 

 

02 マテリアル・デザイン Material Design

 

マテリアル・デザインのガイドラインをGoogle社が公開したことで、デザイン業界をあっと言わせました。かれらによると、このガイドラインでは計画的な色の選択や、端から端まで幅いっぱいに表示される画像イメージ、巨大サイズのタイポグラフィー、そして鮮やかなグラフィックのために、工夫を凝らした余白スペースが特長としています。

 

6-1060x473

 

 

フラットデザインに奥行き感やドロップシャドウ、よりリアルな動きなどを加えアップデートしたことから、マテリアルデザインを「フラット 2.0(英: Flat 2.0)」とも呼ばれています。

 

 

Googleはウェブサイトやアプリ向けにこのガイドラインを作成しましたが、マテリアルデザインの基本原則はあらゆるプロジェクトに採用され始めています。

 

 

以下の参考ウェブサイトでは、鮮やかな色使いや巨大フォント、ドロップシャドウ・エフェクトなど、多くのマテリアルデザイン要素を組み合わせています。

 

Screen-Shot-2016-01-15-at-2.33.59-PM-1060x795

 

 

 

フラット 2.0スタイルで描かれた、天気予報アプリデザイン。ライティングとドロップシャドウエフェクトを導入することで、奥行き感を演出しています。

 

81-1060x1060

 

 

 

以下のウェブサイトでは、鮮やかでコントラストばっちりな配色に、カード型レイアウトのナビゲーションを採用していますが、一般的なデザインにまとめることで、より保守的でトレンドをとらえたデザインとなっています。

 

91-1060x1430

 

 

マテリアル・デザインの鮮やかな配色パレットを利用したいときは、Material Palette を参考にどうぞ。鮮やかな色合いからえらぶだけで、手早くそして簡単に、カラーパレットを作成することができます。

 

 

 

03 鮮やかで大胆な色使い Bright, Bold Colors

 

80/90年代スタイルやマテリアルデザインとの相性も良いことから、鮮やかな色使いは2016年も引き続き人気となるでしょう。

 

 

1960年代を連想させる、より控えめな配色から、鮮やかで、ネオン色、高級感のある色使いへと変化しています。Pantoneの2016年春の人気カラーからも、その様子をうかがうことができます。

 

Screen-Shot-2016-01-15-at-2.39.28-PM-1060x1069

 

 

 

ネオン色に近いみどり色と、金っぽい黄色の組み合わせがとてもポップな、フランスを拠点したデザイン事務所のポスター。

 

112-1060x1590

 

 

 

以下のランディングページでは、鮮やかなパステル系グラデーションを写真に重ねています。

 

connection-fullres-1060x2212

 

 

 

ネオンカラーの配色や幾何学模様デザインから、80年代から影響受けたことがはっきりと分かる好サンプル。

 

Screen-Shot-2016-01-15-at-3.30.10-PM-1060x1354

 

 

 

04 幾何学模様 Geometric Shapes

 

幾何学模様やパターンは、トレンド1で見た80年代をモチーフとしてしています。背景デザインや、イラスト風テクニックなど、あらゆる方法で適用することができます。

 

 

同時に、ビデオゲームの3Dモデリング・テクニックをはじまりとした、「ポリゴンスタイル(英: Low Poly)」にも注目しておきましょう。でこぼこ面が特長の見た目のこのスタイルは、今後もゲームやウェブサイト、印刷媒体などに利用されていくでしょう。

 

141-1060x1792

 

 

 

ポリゴンスタイルの作成チュートリアルもたくさんありますし、このようなツールを使っても良いでしょう。または、無料ダウンロードできるポリゴン・テクスチャ素材から選んでみてはいかがでしょう。

 

 

カラフルな背景として、幾何学模様を重ねて組み合わせた名刺デザイン。

 

Screen-Shot-2016-01-15-at-2.48.28-PM-1060x745

 

 

 

以下のEメール用テンプレートでは、さまざまなサイズの六角形パターンに、写真を切り抜いて図形とマッチさせています。

 

162-1060x906

 

 

 

鮮やかな配色の三角形パターンをつかった、チョコーレート菓子のパッケージ。とても目立つ、魅力的な背景デザインが、商品の各フレイバー、味を表現しています。

 

Screen-Shot-2016-01-15-at-2.50.19-PM-1060x443

 

 

 

以下のブランディング・コンセプトでは、シンプルな三角形と長方形を組み合わせ、多才なビジュアルテーマを作成しています。

 

181-1060x795

 

 

 

05 ネガティブ・スペース Negative Space

 

ネガティブ・スペースまたはホワイト・スペースは、良いデザインにおいて重要な役割をいつも担っています。このトレンドを戦略的に利用することで、特にロゴやブランディングデザインでは、奥行き感を表現したり、デザインに2つの意味を持たせることができます。

 

 

以下は、”The Swan & Mallard(白鳥と真鴨)”というレストランのロゴデザインで、白鳥とカモ、そしてアンパサンド(&)をひとつのロゴで、クリエイティブに表現しています。

 

192-1060x1386

 

 

 

異なるテクニックとして、以下のロゴデザインでは単語を上下にずらすことで、「SHIFT」というアルファベット文字を表現しています。

 

202-1060x552

 

 

 

以下は、バイオリンの形をモチーフにしたコンサートのポスターデザインです。1,2,3という数字の形を取り入れることで、イベント名「123 Years」にもつながります。

 

Screen-Shot-2016-01-15-at-2.56.48-PM-1060x1497

 

 

 

動物愛護団体 PETAのポスターデザイン。よく眺めていると、まずリボンのような形状のスペースに、動物のかたちが見えてきます。

 

次にリボンそのものも動物のように見え、ネガティブスペースを利用することで、左から鳥、ねこ、うさぎ、ゴリラ、犬/きつね、熊の順番に並んでレイアウトされています。

 

221-1060x740

 

 

 

06 組み立て、モジュール式レイアウト Modular Layouts

 

モジュール式/カード型レイアウトは、いくつかの大手ブランドのウェブサイトや、モバイルアプリですでに採用されています。グリッドによってデザインを整理することは、特に目新しいことではありませんが、カード型に情報を整理したコンテンツが、新しいトレンドといえるでしょう。

 

 

以下のウェブレイアウトでは、カード型スタイルのグラフィックやナビゲーションメニューなど、複数の形でこのトレンドを導入しています。

 

242-1060x1121

 

 

 

しかしレイアウトは、いつも完璧に揃っている必要はありません。以下デザインは、より自由のある効果的なレイアウトの好サンプルです。

 

252-1060x795

 

 

 

こちらのウェブサイトでも、サイズの異なるグリッドを用いて、各コンテンツを表示しています。

 

262-1060x2015

 

 

 

07 表現豊かなタイポグラフィー Dramatic Typograhpy

 

このトレンドでは、文字は読むためだけではなく、意思表示(英: make a statement)につながります。巨大で大胆なフォント書体は、注目の的となるでしょう。サイズだけでなく、色や質感、配置などによっても表現できます。

 

 

以下はイキイキとしたスタイルが特長の書体デザインです。雑誌の表紙カバーとして、ひとつずつ手作り、撮影されています。

 

Screen-Shot-2016-01-15-at-3.09.30-PM-1060x710

Screen-Shot-2016-01-15-at-3.09.52-PM-1060x676

 

 

 

より控えめなスタイルですが、タイポグラフィーのみで作成されたデザインも、スタイルやサイズを組み合わせることで、魅力的なレイアウトに仕上げることができます。

 

291-1060x1325

 

 

 

よりミニマルなアプローチとして以下デザインは、巨大な筆記体フォントとグラデーションの配色が特長です。

Screen-Shot-2016-01-15-at-3.12.05-PM-1060x798

 

 

 

08 カスタム・イラストレーション Custom Illustration

 

これまで利用されているストックフォトに変わって、独自にカスタマイズされた写真やイラストが増えてくるでしょう。

 

 

ブランディングにおいては、より個性や関連性のある画像を取り入れた、デザインを重視した、デザイン主体の考え方が、今後も増えていくでしょう。以下のウェブサイトでは、2016年に新年に合わせて、サイトのヘッダーデザインをカスタマイズされたイラストに切り替えました。

 

321-1060x795

 

 

 

利用ユーザーも多い Dropboxでも、よりフレンドリーでカジュアルな手描きスケッチを取り入れることで、個性的なアプローチを実現しています。

 

33-1060x1520

 

 

 

以下、お茶のパッケージデザインでは、美しい水彩ペイントを採用することで、より伝統的、トラディショナルなスタイルに仕上げています。

Screen-Shot-2016-01-15-at-3.16.48-PM-1060x566

Screen-Shot-2016-01-15-at-3.16.58-PM-1060x564

 

 

 

09 アブストラクト、ミニマル・スタイル Abstract, Minimalistic Style

 

1980年代の派手な配色とは対称的に、このトレンドはミニマルスタイルや、モノを認識しやすい形に分解された、シンプルデザインが特長です。

 

以下の音楽スクールのポスターデザインでは、曲譜をいくつかの図形を組み合わせた、ユニークな方法を採用しています。

 

361-1060x2116

 

 

 

鮮やかな色使いが特長のCDアルバム用カバーデザインですが、ミニマルな文字スタイルを利用し、背景のぼかしエフェクトと溶け込んでいます。

 

Screen-Shot-2016-01-15-at-3.20.00-PM-1060x797

 

 

 

さいごは幾何学模様と、鮮やかな色使いを組み合わせ、たっぷりの余白スペースを確保した、ランダムなデザインレイアウト。

Screen-Shot-2016-01-15-at-3.21.57-PM-1060x1127

39-1060x474

 

 

ミニマルスタイルのデザインプロジェクトをはじめるときは、エレガントでスタイリッシュなフリーフォント45個まとめも一緒に参考にどうぞ。

 

 

 

さいごに。

 

これまで紹介したトレンドを、流行のためだけに利用するのは、あまり良いアイデアとは言えません。トレンドを取り入れるときは、あなた自身のプロジェクトとオーディエンスに当てはまるか確認するようにしましょう。では、デザインを楽しんで!

 

 

 

関連する参考エントリーまとめ

 

どのトレンドもうまくデザインに適用する必要あります。関連するデザインの基本や、テクニックも一緒に確認してみてはいかがでしょう。

color-tool2015-top

 

 

マテリアルデザインの基本原則について:

参考 光と影を使った、デザイナーが実践したい10個の有効デザインテクニックまとめ

参考 マテリアルデザインを手軽に!CSS/HTML/JSコンポーネント「Material Design Lite」の使い方まとめ

参考 Googleマテリアル・デザインをはじめよう!参考にしたい無料素材やアイデアまとめ

参考 フラットデザインとマテリアルデザインって同じ?違いを検証してみました

 

ネガティブスペースについて:

参考 目の錯覚を利用しよう!ネガティブスペースの実践テクニック&参考例50個まとめ

 

グリッドレイアウトについて:

参考 グリッドって万能!デザインがグンと良くなる15の理由まとめ

参考 最新Webトレンド「カード型デザイン」を取り入れるべき、効果的な4つの理由

 

配色について

参考 色彩トーンをつかった、配色えらびの基本テクニックまとめ

参考 魅力的なブランドカラーを実現する!参考にしたいデザインガイド11個まとめ

参考 配色完全ガイド!カテゴリー別見本100個とカラーパレットの使い方まとめ

参考 もう配色デザインには迷わない!すごい無料カラーツール13個まとめ

 

参考 ずっと使える、デザインの基本をまとめました。

参考 2016年に流行しそうな、注目Webデザイントレンド11個を大予想

 

 

参照元リンク : The 9 Graphic Design Trends You Need to Be Aware of In 2016 – Canva Design School