2021年4月第2週号 1位は、コンポーネントをまとめたギャラリーサイト、気になるネタは、DiscordがClubhouseのような音声イベント用チャンネルの提供を開始

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

Webデザインで使われるコンポーネントをまとめたギャラリーサイトです。いろいろなフレームワークやデザインシステム、スタイルガイドなどのコンポーネントをカテゴリーにわけています。

プレビュー画像などはなく名前で並んでいるだけなので、各リンク先を見るまでどういうデザインかわからないのがちょっと残念です。

デザインシステムの一覧表示もできるので、そのリストから気に入りそうなものを探すのもいいと思います。

一般的なレイアウト8つをCSSグリッドでコーディングした例をまとめています。

SVGのクリップパスで画像を切り抜くことで、ポップアップする効果を実現する方法を紹介した記事です。丸く切り抜かれた画像を背景に、人物が飛び出すアニメーションでインパクトがあります。

レスポンシブへの対応やSEOとアクセシビリティへの配慮など、細かいところまで考えられています。

インタラクティブなマップが使われたWebデザインのギャラリーです。

マップ内を自由に移動できる、ゲーム的なUIの凝ったサイトを多数紹介しています。

VS Codeのテーマを簡単に作れるサービスです。

色を指定していくだけなので確かに簡単なのですが、変更できる箇所が多すぎて大変です。人が作ったテーマを元に変更を加えることもできて、その方が手軽にテーマを作れそうです。

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

アップルが英語圏のSiriに2つの新たな声を追加、「⁠女性」の声のデフォルト設定は廃止に | TechCrunch Japan
「⁠初期状態で女性の声に設定されていることが、数年前から性差別的偏向として議論の的になっていた」ってシリませんでした
朝日新聞社、長文を要約するAPIを無償公開 500字→200字に圧縮、重要事項の自動抽出も - ITmedia NEWS
「⁠過去30年分の記事データなどを学習させた」とのこと。無料での公開はありがたいです
iOS用ドキュメント作成アプリCraftが約8.8億円調達、ブラウザベースエディターも提供予定 | TechCrunch Japan
まずモバイルアプリ＆デスクトップアプリがあって、そのあとWebアプリ化という流れは最近では珍しいかもしれません

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

CSSフィルターとSVGフィルターを同時に適用できるジェネレーターです。

画像のURLを指定するかアップロードすることで、その画像に対してフィルターをかけたイメージを見られます。各パラメーターはスライダーで調整できるので操作感が良いです。

CSSとHTMLはリアルタイムに生成されてコピーできます。また、このジェネレーターでフィルターをかけた状態をCode Penに引き継いで、さらに編集できるようにもなっていました。

Discordの新機能Stage Channels（ステージチャンネル）で、Clubhouseのようにスピーカーとオーディエンスを分けてのボイスチャットルームが作れるようになりました。まさにステージと観客といった見た目になっています。

Clubhouseと同様に、オーディエンスが手を上げてスピーカーになる機能もあるようです。TwitterのSpaces、DiscordのStage Channelsと続けざまに真似されたClubhouseのUIですが、ひとつのジャンルを確立したとも言えるでしょう。

最近、いつの間にかPinterestにもストーリー風機能が付いていて驚いたんですが、良いものはどんどん取り入れる方がユーザーの満足度も高いのかもしれません。良いもの、受けているものは、どんどんいろんなサービスに真似される状況はしばらく続きそうです。