読者です 読者をやめる 読者になる 読者になる

I AM HARRY

WEB、英語、ライフハックや日々のニュースを発信していくWEBブログ

海外最新webデザイントレンド参考まとめ(2016年8月)

WEB Webトレンド

f:id:harry_jpn:20160912190813j:plain

前回ご紹介した海外最新webデザインですが、新たにwebデザインのレシピとなるようなトレンドが発信されていますので、参考としてご紹介したいと思います。

 

 前回ご紹介した記事はこちら

www.iamharry.net

 

1. レイヤーを多く使用したデザイン

新しい技術によってWeb上では、2Dから3Dのデザインへと進化しつつあります。スクリーン上で、まるで手で掴めるような新しい感覚を生み出すことでより表現の幅が広がります。ここでは、レイヤーのデザイン方法についてのTipsをご紹介します。

  • 影やアニメーションを平面上で複数使用する。
  • 要素を交差させる。
  • ラスタースクロール機能を使用する。
  • 幾何学的形状、アニメーションとカラーバリエーションを使用する。
  • 画面の背景やエッジを越えてレイヤーを作成する。
  • 画像はテクスチャや背景の上に重ねてもOK。

 

参考デザイン

http://netdna.webdesignerdepot.com/uploads/2016/08/olle.jpg

http://ollestudio.com/

 

http://netdna.webdesignerdepot.com/uploads/2016/08/delete.jpg

http://www.deleteagency.com/

 

http://netdna.webdesignerdepot.com/uploads/2016/08/yarn.jpg

Yarn App

 

2. ダークカラースキームを使用したデザイン

ここ最近は、ダークカラーを使用したミニマルなデザインが増えているようです。トレンドとしては、よりダークなカラーにシフトしているといってよいでしょう。

大胆な白タイポグラフィ、明るい色で、コール・トゥ・アクションや重要な情報には適度をアクセントを加えてみましょう。

ダークカラースキームは、いつもブラックという単調なものではなく、時には、赤から緑やブルーなどの色相へ多様することもできます。最も一般的ですが、様々な色の組み合わせから作られるリッチブラックを選択することが重要です。

ダークカラースキームを用いる場合は、適切なコントラストをつけて見やすくしましょう。白は、明るさや彩度をつけるときに活用していきましょう。サイズにコントラストつけることも考えてみましょう。読みやすくするために、テキストのサイズも調整してみましょう。

 

参考デザイン

http://netdna.webdesignerdepot.com/uploads/2016/08/ambassador.jpg

Ambassador Watches - Incomparable Timepieces

 

 

http://netdna.webdesignerdepot.com/uploads/2016/08/convoy.jpg

Convoy Interactive - Agency for digital design solutions

 

http://netdna.webdesignerdepot.com/uploads/2016/08/coats.jpg

Coats Speciality

 

3. グラデーションを使用したデザイン

フラットデザインの対極として、グラーデーション技術が用いられていますが、フラットデザインに物足りなさを感じるときに、グラデーションを使用します。新しい傾向としては、テクスチャとして使用されていないことです。あくまで、コンテンツを強調させるために明るい色のグラデーションを使用しています。大胆さを表現したいときに、フルスクリーンのグラデーションオーバーレイから背景に使用するといったテクニックです。

  • 大胆な表現をするためにグラデーションを使用する。
  • 写真に引きつけるためにツートンやオーバーレイを使用する。
  • ボタンをクリックさせるためのグラデーションを使用する。
  • アイコンのグラデーションはNG!
  • コンテンツを目立たせないこと。
  • グラデーションがコンテンツとマッチしているか確認する。
  • 読みやすさを重視して、色の組み合わせやコントラストに注意すること。複数のサイズのデバイスで読みやすさをテストすること。

参考デザイン 

http://netdna.webdesignerdepot.com/uploads/2016/08/wpcrew.jpg

WordPress Support and Maintenance Services by WPCrew

 

http://netdna.webdesignerdepot.com/uploads/2016/08/victor.jpg

Victor Fernandez Windsurf - Pro Rider PWA World Tour

 

http://netdna.webdesignerdepot.com/uploads/2016/08/interactive.jpg

Interactive Sites, a Full-Service Hospitality Digital Marketing Agency

 

まとめ

海外最新webデザイントレンド参考まとめはいかがでしょうか?レイヤーの使い方、ブラックのミニマルデザイン、グラデーションを使用したデザインが、今、海外のwebデザイントレンドとして注目されています。

一番重要なことは、webサイトのコンテンツとマッチしているか、サイトのユーザビリティを意識しているか、ということなので、一度、デザインする前に確認してみましょう。

reference: Essential design trends, August 2016 | Webdesigner Depot

 

最新Webデザインスキルを身につけるには

f:id:harry_jpn:20160912190859p:plain

 Codecampはマンツーマンでプロの最新webデザインレッスンを受けることができます。まだwebデザインはできるけど自信がない、一線で活躍しているプロからマンツーマンでレッスンを受けたいという方はCodecampがオススメです。

【CodeCamp】資料請求はこちら

【CodeCamp】体験レッスンはこちら

 

 

現在、読者の方募集中です!気に入って頂けた方は下のボタンをポチっとお願い致します。

WEBで海外と日本のノマド生活を!興味のある方は要チェック!

にほんブログ村 ライフスタイルブログ ノマドワーカーへにほんブログ村 海外生活ブログ 海外滞在・海外プチ滞在へにほんブログ村 ネットブログ ネット広告・ネットマーケティングへ

Copyright© I AM HARRY All Rights Reserved.