2019年4月第3週号 1位は、アイコンフォントとSVGアイコンの比較とSVGアイコンの使い方、気になるネタは、サムスン、「Galaxy A80」発表--回転するカメラ、ノッチなし

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

アイコンフォントとSVGアイコンの比較を中心に、SVGアイコンについてまとめた記事です。

以下は、アイコンフォントとSVGアイコンを比較した項目と結果です。

アイコンをSVGに変換してウェブページに配置する方法についても、丁寧に解説しています。

CSSを使ってSVGをアニメーションさせる方法を、サンプルを使って紹介しています。

サンプルはCodePenから埋め込まれており、実際の動作を見たりコードの確認もできます。

コーディング不要でウェブページをデザインできるWebflowを1年間使っての、気に入っている機能やできることなどを解説した記事です。

CSSで画像の一部をクリッピングしてぼかす方法を解説しています。

写真の上に色の帯を置いてその上に文字を入れるときに、帯を半透明にしてその下の写真がぼけている、すりガラス効果のようなものを実装しています。

マウスの動きをJavaScriptでシミュレーションする方法を紹介しています。マウスの動きに合わせたインタクラクションを、操作せずにデモするために作ったとのこと。

マウスの軌跡に沿ってランダムな色と形の丸が現れるスクリプトを、マウス操作なしで動作させる例などを掲載しています。

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

企業向け「Google+」が「Currents」に改称 - CNET Japan
結局、Google+という名前はなくなってしまいました
「G Suite⁠」⁠、Googleアシスタント対応や動画チャットのキャプション、Office編集などの新機能 - ITmedia NEWS
Office文書をフォーマットそのままで編集・保存できる機能は、G Suiteだけでなく一般ユーザーも使えるとのこと
LINE LIVEに「スクリーン配信」機能--ゲーム実況などが容易に - CNET Japan
配信中に映りこまないように通知部分をぼかす機能もあるそうです

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

Designer Bio Generatorはデザイナーのプロフィール／経歴を自動生成するサービスです。Twitterやブログのプロフィール欄に使う目的とのことですが、役に立つというよりジョークの意味合いが強いんだと思います。

ボタンを押すだけでプロフィールがランダムに表示されます。「⁠バイク乗り、レコード好き、国際的なスイススタイルの実践者、そしてフロンエンドデベロッパー」のようなパターンが決まっていて、デザイナーのプロフィール「あるある」みたいなものなんでしょう。

SNSのプロフィール欄の文章を考えるのはなかなかむずかしいので、日本語版のこういうサービスがあったら、面白がりつつも参考になると思います。このサービスの文面を翻訳するだけでも、かっこいい、苦笑されそうなプロフィールが作れそうです。

サムスンの「Galaxy A80」は、1つのカメラを回転させてイン／アウト両方に使えるスマートフォン。自撮りとして使うときにはカメラ部分が上にスライドするため、ノッチ（切り欠き）なしの全面スクリーンです。

スライドさせるとインカメラが出てくるのはXiaomiの「Mi Mix 3」などであったのですが、1つのカメラユニットがくるっと180度回転するアイデアは面白いです。カメラを1つにまとめる分、コストやサイズ面でのメリットもあるでしょう。

センサーがディスプレー内に埋め込まれていて、全面ディスプレーでも指紋認証が使えるところもいいですね。日本では花粉症シーズンにはマスクをして顔認証できないという人も多いので、iPhoneも全面ディスプレイ＆指紋認証＆ノッチなしを実現して欲しいと思います。