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

1. Inclusive Designhttps://www.nngroup.com/articles/inclusive-design/

最近目にすることの増えた，インクルーシブデザインについて解説した記事です。インクルーシブデザインは，あらゆるバックグラウンド・能力の人々が理解して使える製品を作るための方法論です。アクセシビリティ，年齢，文化，経済状況，教育，性別，地理的位置，言語，人種などに配慮します。

インクルーシブデザインの例として，以下の項目で解説していました。

• 年配ユーザーのための文字の視認性とダークモード
• グローバールなユーザーのための名字の入力
• さまざまな人口統計学的識別子（人種，性別，性的指向など）
• 包括的ファセット（Facet／****一面，側面）
• 多様なイラスト

2. How to help bridge the gap between UX design and code | by Karine Sabatier | Feb, 2022 | UX Collectivehttps://uxdesign.cc/how-to-help-bridge-the-gap-between-ux-design-and-code-1b4442604bd9

UXデザインとコードの間のギャップを埋める方法を紹介しています。デザイナーとコーダーの橋渡しをFigmaを使ってうまく行うためのヒントです。

• 全てに名前を付ける。早く名前を付けて頻繁に変更する
• ページにも名前を付ける
• コンポーネントに名前を付ける
• バージョン管理を使う
• ライブラリを使う（Figmaのチームプランで）
• クリーンな状態を保つ
• コードからのリバースデザイン
• 毎週のUXミーティングを計画する

3. 10 Design Trends to Watch Out for in 2022https://qodeinteractive.com/magazine/design-trends-to-watch-out-for/

2022年に注目すべきデザイントレンドを10個まとめています。

• セリフディスプレイフォント
• クロムとリキッドメタル
• プラスチック，流体，成形品
• ヒーロー動画
• 3Dグラフィックス
• 大胆な色と組合せ
• ボーダーとグリッド
• 動的タイポグラフィ
• 独創的なポインター
• スクロール効果

4. How to Use Hand-Drawn Elements in Web Design | Webdesigner Depot Webdesigner Depot » Blog Archivehttps://www.webdesignerdepot.com/2022/02/how-to-use-hand-drawn-elements-in-web-design/

手書きの要素をWebデザインで使用する利点とヒントを紹介しています。

利点としては以下の3つが挙げられていました。

• 記憶に残りやすい
• ブランドの個性を表せる
• 差別化できる

5. 12 Incredible YouTube Channels That Improve Your Design Skillshttps://vector.cx/12-incredible-youtube-channels-that-improve-your-design/

デザインスキルの向上に役立つ12のYouTubeチャンネルをまとめた記事です。

PhotoshopやAdobe XD，Figmaなどのグラフィックツールのテクニックや，モーショングラフィックス，3Dグラフィックス，iPadでのイラスト作成を学べる動画など盛りだくさんです。

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

• まるでレトロゲーム 粗いドット絵画像の素材サイト，元任天堂のデザイナーが公開 無料で商用利用も可能 - ITmedia NEWS
  「⁠前田デザイン室」によるドット絵素材サイトが公開されました
• 人気ワードパズルゲーム「Wordle」をニューヨーク・タイムズが買収 | TechCrunch Japan
  「⁠7桁ドル（数億円）前半」の非公開の価格で買収とのことです
• PCとWebカメラだけでVTuberになれる無料システム AIを使った骨格推定で身体や指の動きをリアルタイム反映 - ITmedia NEWS
  Webカメラの映像をもとに，顔の動きやまばたき，腕／指の動きを3Dのアバターにリアルタイム反映できます

先週の気になるツール／サービス

Reaktr | Generate audio-reactive video on browser.https://reaktr.vercel.app/

Reaktrは音声ファイルを元に動画を作るサービスです。オリジナルの楽曲やポッドキャストをYouTubeにアップするための動画作りに役立ちそうです。

音声ファイルと背景用の画像か動画をアップロードします。音声の波形に合わせて変化するグラフィックは2種類から選べ，色をカスタマイズできます。タイトルと作者をテキストで入れられて，フォントやサイズを調整可能です。

背景用に画像や動画を無料で入手できる素材サイトPixabayへのリンクもあって親切です。全て英語ですが，日本人が個人で開発しているようです。