週刊Webテク通信

2017年7月第2週号1位は、ウェブデザイナーのポートフォリオにおける最新のデザイン動向、気になるネタはスマートスピーカーの音声AI、住人の口論を自動通報。起こったかもしれない殺人事件防止に一役

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

1. The Latest Design Trends in the Portfolios of Web Designershttps://1stwebdesigner.com/design-trends-web-design-portfolio/

ウェブデザイナーのポートフォリオにおける最新のデザイン動向についてまとめています。ちょっと変わったウェブデザインのアイデアの参考になります。

  • 履歴書スタイルのポートフォリオ
  • 浮かんでいる要素
  • 実験的なカラースキーム
  • 独創的な空白とレイアウト
  • 斜めのスクロール
図1 ウェブデザイナーのポートフォリオにおける最新のデザイン動向
図1 ウェブデザイナーのポートフォリオにおける最新のデザイン動向

2. Booking.com — UX Analysis and Responsive Redesign – uxdesign.cchttps://uxdesign.cc/booking-com-ux-analysis-and-responsive-redesign-5854d616c0b8

宿泊予約サイト「Booking.com」のUXの分析と、レスポンシブへのリデザインについてのレポートです。

デザインのプロセスは以下となります。

  1. 現在のインフォメーションアーキテクチャを分析する
  2. 5人のユーザーインタビューとカードの並び替え
  3. ユーザーフローとインフォメーションアーキテクチャのリデザイン
  4. レスポンシブなワイヤーフレームとUIを作る
図2 Booking.comのリデザインのレポート
図2 Booking.comのリデザインのレポート

3. 3 Essential Design Trends, July 2017 | Webdesigner Depothttps://www.webdesignerdepot.com/2017/07/3-essential-design-trends-july-2017/

重要なウェブデザインのトレンドを3つまとめた記事です。

  1. ページの下にあるナビゲーション
  2. デザイン要素としてのボックス
  3. 縦のライン
図3 重要なウェブデザインのトレンド3つ
図3 重要なウェブデザインのトレンド3つ

4. 29 About Us Pages for Design Inspiration - SpyreStudioshttp://spyrestudios.com/29-us-pages-design-inspiration/

デザインの参考になる「About Us」ページを多数紹介しています。

ウェブサイトのトーンを決めるのに最適な場所である「About Us」ページの、いろいろなアイデアを見ることができました。

図4 デザインの参考になる「About Us」ページいろいろ
図4 デザインの参考になる「About Us」ページいろいろ

5. 20 Inspirational Examples of Minimal Web Designhttp://designwoop.com/2017/07/20-inspirational-examples-minimal-web-design/

ミニマルなウェブデザインのギャラリーです。シンプルながらデザイン性の高いサイトが多数紹介されています。

プロにより作られたミニマルなウェブデザインは、すっきり整然としていてユーザーに良い印象を与えるとのことです。

図5 ミニマルなウェブデザインのギャラリー
図5 ミニマルなウェブデザインのギャラリー

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

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

10 Design Tools You Aren’t Using (But Should Be!) | Design Shackhttps://designshack.net/articles/software/10-design-tools-you-arent-using-but-should-be/

今回は、10種類のデザインツールをまとめた記事を紹介します。⁠あなたが使っていないけれど使うべき」とタイトルに入っているので、それほどメジャーではないものが中心ということですね。

Adobe Sparkはソーシャルメディア向けのグラフィックや1ページもののウェブページ、アニメーションを使った動画を作れるウェブサービスです。無料ですが、Adobe Creative Cloudユーザーはさらに追加機能が使えます。

ほかに、フォントを探すのに便利なサービス、ストックフォトサービス、データを元にグラフを生成するサービス、ファビコンのジェネレーターなどが紹介されていました。

図6 あまり知られていない10種類のデザインツール
図6 あまり知られていない10種類のデザインツール

おすすめ記事

記事・ニュース一覧