2021年2月第4週号 1位は、Z-indexとスタッキングコンテキストについてのビジュアルガイド、気になるネタは、ソーシャルオーディオアプリClubhouseが800万ダウンロード超え、2021年2月前半に急増

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

Z-indexとスタッキングコンテキスト（重ね合わせコンテキスト）についてのビジュアルガイドです。

入れ子の要素の場合、フォルダの階層のように重ね合わせが適用されることや、スタッキングコンテキストがどのような場合に新たに作られるかなどを細かく解説しています。

この記事の作者Ahmad Shadeedさんの記事はいつもためになるものばかりなんですが、かわいいイラストの入ったおしゃれなページなのは珍しいなと思いました。

2021年のデザイントレンドは、見た目が魅力的である以上のことをしないといけないそうです。

以下の6つの項目でまとめていました。

エシカルやダイバーシティといった最近よく聞くようになった言葉は、デザインとも無関係ではないことがわかりました。

Webページの上部に固定されているヘッダの高さが、スクロールすると狭くなる効果をCSSのみで実装しています。

position:stickyを設定した要素を入れ子にすることで、スクロールすると子要素の高さで固定されるというテクニックを使っています。

CSSトランジションを使って、ホバー時にアニメーションするボタンの作り方を解説しています。

ボタンのアニメーションは単純なのですが、タイミング関数によるイージングや、CPUとGPUのレンダリング処理のタイミングのずれを修正する方法など、細かいところまで踏み込んだ解説になっていて参考になります。

編集可能でオープンソースのアイコンセットです。1つのアイコンにアウトライン、塗りつぶし、カラーなど5つの種類があり、さらに太さや色を変更できます。

アイコンはFigmaで開くかSVGでダウンロードするかを選べ、SVGのコードをコピーすることも可能です。Figmaで開ける編集可能なアイコンセットも用意されています。

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

2020年、Chromebookは絶好調 | TechCrunch Japan
Chromebookは2020年のPC市場で10.8％のシェアだったとのこと
Clubhouseでコンデンサーマイクを使える「iRig Pre 2」登場 - ITmedia NEWS
低コストで良いマイクでClubhouseで話ができるデバイスです
「Apple TV」アプリが「Chromecast with Google TV」に降臨 - ITmedia NEWS
「⁠Apple TV+」のコンテンツを再生できるようになります

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

今回はWebサービスではなくデスクトップアプリのSVGXを紹介します。SVGを管理、編集できるMac／Windowsのアプリケーションです。

パソコン上にあるSVGファイルを検索して探し、管理できます。インラインで使うためのコードを取得できますし、背景パターンにしたコードも作れます。PNG画像として書き出す機能もあります。

オープンソースではないですが、今のところ無料で使うことができます。ページの最後にSVGアイコンのリンク集があって参考になります。

Clubhouseのアプリのダウンロード数が2月16日に810万回に達したそうです。米国でのインストール数は260万回とのことで、世界で使われていることによる800万超の数字ということですね。

勢いがある一方、急に盛り上がりすぎた日本では「飽きた」という声も目立ってきているようです。利用頻度が減っている人も多いようですが、今の段階でどうこう言うのはこの記事にもあるように時期尚早だと思います。

たしかにコロナ禍だからこそ盛り上がっている面もあるので、アフターコロナでどうなるのかは気になるところです。この記事には、Clubhouseの競合となるサービスも多数紹介されていて参考になります。