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

1. What is a Design System, Why It is Important and What to Include - Designmodohttps://designmodo.com/design-system/

デザインシステムとは何か，なぜ重要で何を含めるべきか，について解説した記事です。

以下のそれぞれの項目について，実例となるデザインガイドラインなどのリンクとキャプチャ画像を掲載しています。

• グリッド
• 間隔
• エラーと検証
• コード化されたコンポーネント
• 命名規則
• アイコン
• タイポグラフィ
• アクセシビリティ
• 口調と声
• ロゴと色
• 揃え
• 共通のUI要素
• ジェスチャー
• 動き

2. A UX/UI Case Study: Designing a Text-To-Speech App From The Ground Uphttps://blog.prototypr.io/a-ux-ui-case-study-designing-a-text-to-speech-app-from-the-ground-up-1fc95bd04a2b

UX/UIデザインのケーススタディとして，1つのアプリを制作する流れを紹介しています。

ユーザー調査や競合の分析から，サイトマップ，ユーザーフロー，スケッチ＆ワイヤーフレームと初期の段階から順を追って具体的な内容を解説していて，とても参考になりそうです。

その後，プロトタイプ，ユーザビリティテスト，ビジュアルデザインと，ユーザー中心のデザインプロセスを一貫して行う様子が，実際のビジュアルとともにまとめられています。

3. UX Hacking Usability with Psychological Principles | The JotForm Bloghttps://www.jotform.com/blog/ux-hacking-usability/

ユーザビリティの向上について，心理学の法則を切り口としてまとめた記事です。

フォーム作成の新サービスJotForm Cardを開発するにあたり，シンプル・即時・美的の3つの重要なポイントに行き着いたとのことです。その3点について，心理学的な裏付けを基に細かく解説しています。

4. 10 years of the App Store: The design evolution of the earliest apps | 9to5Machttps://9to5mac.com/2018/07/10/app-store-10-years-design-evolution/

App Storeが10周年ということで，10年前から存在するアプリのデザインの変化をまとめた記事です。

iTunes Remote，Facebook，Things，OmniFocus，Evernote，eBay，Twitterrific，Instapaper，PCalc，Yelpの10個のアプリのアイコンデザイン，画面デザインの変遷は，時代を感じさせられます。

5. 20 Best New Portfolios, July 2018 | Webdesigner Depothttps://www.webdesignerdepot.com/2018/07/20-best-new-portfolios-july-2018/

ポートフォリオサイトのデザインギャラリーです。ミニマルなデザインのものが目立ちます。

各サイトには簡単な解説と，何のプラットフォームで作られているか（WordPressが多い）も紹介しています。

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

• App Storeの10年間で最もダウンロードされたアプリは？ App Annieのレポート - ITmedia Mobile
  2017年はトップ10の半数近くが中国に本拠を置く企業が占め，2018年5月末の時点では中国企業による「Tik Tok」が世界のダウンロード数1位とのことでした
• Twitter，フォロワー数からロックアカウントを除外へ - CNET Japan
  なぜかテレビのニュースでも報道されるなど話題になっていましたね
• Googleの入力アプリ「Gboard⁠」⁠，モールス符号入力が可能に - ITmedia Mobile
  ジョーク的な機能かと思ったら，身体が不自由な人にとって使いやすい入力方法とのことです

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

25+ Real-Life Tools for Web Designers and Developers | Design Shackhttps://designshack.net/articles/inspiration/25-real-life-tools-for-web-designers-and-developers/

今回は，ウェブデザイナーや開発者に役立つ様々なサービスをまとめた記事を紹介します。ウェブサイトビルダーやデザイン素材，WordPressのテーマなど，楽して作る系のものが多いようです。

uSocialはSNSボタンを簡単に設置できるサービスです。ページごとに入れる「いいねボタン」やSNSアカウントのフォローボタンなどを作成でき，デザインのカスタマイズ性も結構あります。

Notismはデザインフィードバックのサービスで，画像の任意の箇所にコメントを付けるなどの機能があります。動画にも任意の場所にコメントを付けられ，確かにこれからは動画の校正も重要になるはずだと納得しました。