週刊Webテク通信

2016年2月第1週号1位は、2016年のWebデザインのトレンド16個、気になるネタは、Googleが出資!プリンターの写真を撮るだけでスマホと接続するアプリ、米国で開発中

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2016年1月25日~1月31日の間に見つけた記事のベスト5です。

1. 16 Web Design Trends For 2016 | Marvellous Digital Agencyhttps://wearemarvellous.com/16-web-design-trends-for-2016/

2016年のWebデザインのトレンドを16個まとめた記事です。

  1. グラデーションの再来
  2. グリッドレイアウトのいろいろな利用法
  3. インフォグラフィックス人気の急落
  4. プリローダーの終焉
  5. フラットデザイン
  6. カードレイアウト
  7. 部分的なローディング
  8. スクロールに合わせたアニメーション
  9. よりスクロールが利用される
  10. インタラクティブなストーリーテリング
  11. 写真よりイラスト
  12. シンプルなタイポグラフィ
  13. レスポンシブデザイン
  14. リッチで自然なアニメーション
  15. マテリアルデザイン
  16. ハンバーガーメニューは屈辱を受ける

インフォグラフィックスはスマホでは見にくいんじゃないかと思っていましたが、海外のトレンドでも人気が落ちてきているようです。

図1 2016年のWebデザインのトレンド16個
図1 2016年のWebデザインのトレンド16個

2. The 9 Graphic Design Trends You Need to Be Aware of In 2016 – Design Schoolhttps://designschool.canva.com/blog/design-trends-2016/

2016年に知っておくべきグラフィックデザインのトレンドを9つ紹介しています。

  1. 近代的なレトロスタイル
  2. マテリアルデザイン
  3. 明るく明瞭な色
  4. 幾何学的な図形
  5. ネガティブスペース
  6. モジュール方式のレイアウト
  7. 印象的なタイポグラフィ
  8. カスタムメードのイラスト
  9. 抽象的、最小限のスタイル

ローポリゴンなどとも言われていた、幾何学的な図形の人気は根強いようです。

図2 2016年に知っておくべきグラフィックデザインのトレンド9個
図2 2016年に知っておくべきグラフィックデザインのトレンド9個

3. UI Animation Trends 2016http://spyrestudios.com/ui-animation-trends-2016/

ユーザーインターフェイスに使われる、アニメーションのトレンドをまとめています。

それぞれの動きがアニメーションGIFで紹介されていて、わかりやすいです。

図3 ユーザーインターフェイスに使われるアニメーションのトレンド
図3 ユーザーインターフェイスに使われるアニメーションのトレンド

4. 45 Tips On How To Make About Us Pages More Engaginghttp://line25.com/articles/tips-on-how-to-make-about-us-pages-more-engaging

About Usページ(日本語だと「このサイトについて」⁠お問い合わせページ」など)を、より魅力的にするヒントを紹介した記事です。

実例をもとに解説するスタイルで、大量のサイトが掲載されていました。

図4 About Usページをより魅力的にするヒント
図4 About Usページをより魅力的にするヒント

5. 14 Best Resources For Learning CSS3 | SmashingApps.comhttp://www.smashingapps.com/2016/01/25/14-best-resources-for-learning-css3.html

CSS3のテクニックを学べる情報源へのリンクをまとめています。

最近の技術的なトレンドを踏まえたツールチップやスライドショー、全画面ビデオなどのテクニックが掲載されていました。

図5 CSS3のテクニックを学べる情報源へのリンク集
図5 CSS3のテクニックを学べる情報源へのリンク集

そのほか、最近の記事の中から、気になるニュース記事を紹介します。

先週の気になるWebサービス

Visual Hunthttps://visualhunt.com/

Visual Huntは、ハイクオリティで無料のストックフォトを集めたWebサービスです。キーワード検索したり、カテゴリや色で探すことができます。

クリエイティブ・コモンズ・ライセンスの写真を掲載しており、作者のクレジット入りの埋め込みコードも生成してくれますが、コードにはしっかりVisual Huntのクレジットも入れてあります。作者名掲載不要の画像にVisual Huntのクレジットだけが入るのは、Visual Huntの著作物みたいに見えてまぎらわしいですね。

写真を探し、必要なサイズを選び、ダウンロードするか埋め込みするかを選び、ライセンスを確認する、というステップがわかりやすくレイアウトされており、デザイン性と使い勝手で同様の他のサービスと差を付けているように感じます。

図6 無料のストックフォトを探せるサービス
図6 無料のストックフォトを探せるサービス

おすすめ記事

記事・ニュース一覧