週刊Webテク通信

2022年4月第2週号 1位は，愛すべきUXの7つの実践的な原則，気になるネタは，Amazonプライム・ビデオ，日本だとApple TVより407倍人気 Appleが分析結果を公開

Webテク, Webデザイン, Web広告, UX, Webアニメーション, グラデーション, Apple, サードパーティーアプリ

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

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

1. 7 practical principles of lovable UX: learn from Readymaghttps://www.awwwards.com/7-practical-principles-of-lovable-ux-learn-from-readymag.html

愛すべきUXの実践的な原則を7つまとめた記事です。

  1. インターフェイスはコミュニケーション
  2. インターフェイスはわかりやすくなければならない
  3. インターフェイスは習慣的であるべき
  4. インターフェイスは信頼できるものでなければならない
  5. エントロピー（乱雑さ，無秩序さ）はインターフェイスの大敵
  6. デザインツールのインターフェイスは見た目が美しいとともに便利でなければならない
  7. 最良のインターフェイスはインターフェイスがないこと

ReadymagというノーコードWebデザインツールのインターフェイスの背後にある原則について，実例を元に解説していました。

図1　愛すべきUXの7つの実践的な原則

図1　愛すべきUXの7つの実践的な原則

2. Motion in UX Design: 6 Effective Types of Web Animationhttps://blog.tubikstudio.com/web-animation/

効果的なWebアニメーションの6つのタイプを豊富なサンプルとともに紹介しています。

  1. ヒーローアニメーション
  2. 読み込み中のアニメーション
  3. アクセントのためのアニメーション
  4. インタラクティブ性のあるアニメーション
  5. ホバー効果のアニメーション
  6. 特殊効果のための動き

図2　効果的なWebアニメーションの6つのタイプ

図2　効果的なWebアニメーションの6つのタイプ

3. 20 Best New Sites, April 2022 | Webdesigner Depot Webdesigner Depot » Blog Archivehttps://www.webdesignerdepot.com/2022/04/20-best-new-sites-april-2022/

最近リリースされた優れたデザインのサイトを紹介した記事です。3Dが使われているものが多いように感じました。

Garden Eightのサイトはロゴがカタカナだと気づいてよく見てみると，右上の「JA」のリンクで日本語に切り替えられました。東京とコペンハーゲン（デンマーク）にオフィスがあるデザインスタジオです。

図3　最近リリースされた優れたデザインのサイトいろいろ

図3　最近リリースされた優れたデザインのサイトいろいろ

4. Gradients | Components AIhttps://components.ai/gradient/

複雑なグラデーションが作れるジェネレーターです。コントロールできる項目が多くて複雑なので，まずはランダムに生成してから気に入ったものを調整する使い方が良さそうです。

できたグラデーションはCSSコードをコピーでき，JavaScriptやReact用のコードにも切り替えられます。

図4　複雑なグラデーションが作れるジェネレーター

図4　複雑なグラデーションが作れるジェネレーター

5. 10 excellent design blogs to follow for endless inspiration | Dribbble Design Bloghttps://dribbble.com/stories/2022/04/05/10-excellent-design-blogs-to-follow-for-endless-inspiration

おすすめのデザイン系ブログを10個紹介しています。テクニカルな内容ではなく，デザインのインスピレーションを得られる内容が中心のものです。

TikTokでフォローすべきデザイナーをまとめた記事へのリンクもあります。

図5　おすすめのデザイン系ブログを10個紹介

図5　おすすめのデザイン系ブログを10個紹介

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

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

kCaps - design keyboard shortcutshttps://kcaps.app/

KeyCapsはキーボードショートカットの画像を簡単に作れるサービスです。操作説明のマニュアルやチュートリアル動画にキー操作の画像が欲しいときに便利そうです。

実際にそのショートカットを入力するか「cmd + c」のようにテキストで入力すると，7種類から選べるキーボードのデザインで画像が生成されます。「⁠+」は表示／非表示を切り替えられ，Macのコマンドキーなどのシンボルも表示できます。

画像はPNGかJPEGでダウンロードでき，PNGの場合は背景が透過しています。今後もアップデートしていく予定とのことですが，シンプルで操作性が良いところは継続して欲しいと思いました。

図6　キーボードショートカットの画像を簡単に作れるサービス

図6　キーボードショートカットの画像を簡単に作れるサービス

今週の気になるWebネタ

Amazonプライム・ビデオ，日本だとApple TVより407倍人気 Appleが分析結果を公開 - ITmedia NEWShttps://www.itmedia.co.jp/news/articles/2204/11/news138.html

AppleがApp Storeでサードパーティアプリが成功していることを報告するレポートを発表しています。各ジャンルにおいてAppleのアプリよりサードパーティのアプリの方がより多く使われている調査結果が出たとのことです。

例えば，AppleのMusicアプリよりSpotifyの方がアメリカでは1.6倍，日本では0.4倍人気だそうです。日本ではApple TVアプリの407倍Amazon Prime Videoが人気があるなど面白い調査結果が見られます。

サードパーティアプリの方が使われてることをAppleがPRしてるのは，自分たちが独占してるわけじゃなくApp Storeのエコシステムがちゃんと富や機会を分配してることをアピールする必要があるからなんでしょうか。海外のメジャーなアプリも知ることもできる興味深いレポートでした。

Webテク, Webデザイン, Web広告, UX, Webアニメーション, グラデーション, Apple, サードパーティーアプリ

著者プロフィール

アシカガコウジ

フリーのWebデザイナー＆ライター。ポッドキャスト「アシカガCAST」でデジタル活用のヒントを発信中。シャープMZ-80Bからのパソコンユーザーで，Macintosh IIciからのMacユーザーでApple好き。Webテク情報やツール（ソフトウェア）の案内，デジタル活用情報をまとめた「アシカガノオト」をNotionで公開しています。

http://bit.ly/ashikaganote