2022年1月第4週号　1位は，Figmaのあまり知られていないテクニック集，気になるネタは，Twitter Blue利用者はNFTをプロフィール写真として使用可能に

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

1. A few lesser-known Figma tips. At Medium, our design team’s tool of… | by Greg Dougherty | Jan, 2022 | Medium.design

https://medium.design/a-few-lesser-known-figma-tips-29db4a731926

Figmaのあまり知られていないテクニックを紹介した記事です。

  1. SVGをブラウザからコピーしてFigmaにペーストする
  2. 色の名前を入力してHEX値に変換する
  3. テキストを囲むバウンディングボックスをダブルクリックすると、「Auto Width（自動幅）」に折り返しが変わる
  4. エレメントを選んでShift＋Xで線と塗りの色が入れ替わる
  5. オブジェクトをドラッグしているときにスペースバーを押しっぱなしにするとオートレイアウトは無視される

図1　Figmaのあまり知られていないテクニック集

medium.design_a-few-lesser-known-figma-tips-29db4a731926(Webテク通信).png

2. Badge UI design exploration — Tips & tricks, usability, and use cases review

https://setproduct.com/blog/badge-ui-design

バッジUIのテクニックや使用例などを解説した記事です。バッジはステータスや通知、イベントを示す小さなUIで、フォロワー数や未読メッセージの数や通知のあるなしなどを伝えるために使われます。

バッジのデザイン上の工夫や、目的別の使われ方などを詳しく説明しています。

図2　バッジUIのテクニックや使用例

setproduct.com_blog_badge-ui-design(Webテク通信).png