週刊Webテク通信

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

この記事を読むのに必要な時間:およそ 2 分

ネットで見かけた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 無料のストックフォトを探せるサービス

今週の気になるWebネタ

Googleが出資!プリンターの写真を撮るだけでスマホと接続するアプリ,米国で開発中 | Techable(テッカブル)http://techable.jp/archives/36049

スマートフォンで写真を撮るだけで,プリンタやその他のデバイスに接続できる技術が開発中とのことで,なかなか興味深いです。プリンタやプロジェクターに簡単に接続できるというデモ動画が公開されています。

画像分析技術と位置情報とで判断しているようです。いろんなデバイスがネットにつながるようになると,この技術がとても活きてくるでしょう。まずは,コンビニのマルチコピー機によるプリントアウトに採用されると便利だと思います。

動画の最後に紹介されていた,プレゼンスライドの画面をスマホのカメラで撮ると,すぐにスライドのファイルをダウンロードできるというのがとても便利そうです。プレゼンの最中にダウンロードされると,来場者がみんなスマホでスライドの先を見始めて,プレゼンに集中してくれないという弊害がありそうですが…。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/

コメント

コメントの記入