週刊Webテク通信

2021年3月第3週号 1位は,新しいWebデザインのトレンド「オーロラUI」,気になるネタは,Appleが初代HomePodの販売を終了,好評のminiに注力

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

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

1. Aurora UI — new visual trend for 2021 | by Michal Malewicz | Mar, 2021 | UX Collectivehttps://uxdesign.cc/aurora-ui-new-visual-trend-for-2021-c763a7daa7e2

新しいWebデザインのトレンドとしてオーロラUIを紹介しています。ぼかしと自然なグラデーションがオーロラと似ているのでオーロラUIと呼ぶようです。

ボタンなど機能するものには最小限のデザインでわかりやすくして,背景にぼかしなどの装飾を与えることを提案しています。

図1 新しいWebデザインのトレンド「オーロラUI」の解説

図1 新しいWebデザインのトレンド「オーロラUI」の解説

2. Why I Don't Like Tailwind CSS | Aleksandr Hovhannisyanhttps://www.aleksandrhovhannisyan.com/blog/why-i-dont-like-tailwind-css/

Tailwind CSSをなぜ好きではないかを説明した記事です。1月に書いた記事に最近補足を加えています。補足部分にはTailwind CSSの擁護をするような内容も含まれていますね。

Tailwind CSSではなく何を使うべきかとして,この記事の作者がオススメするstyled-jsxというCSS-in JSライブラリを紹介していました。

最後に書かれている,Tailwind CSSはプロトタイプやデモを非常に迅速に作成するのには役立つけど,長期的なメンテナンスや新しい開発者に引き継ぐには向いてないという結論にはとても納得がいきます。

図2 Tailwind CSSをなぜ好きではないか

図2 Tailwind CSSをなぜ好きではないか

3. Why Does a Design Look Good?https://www.nngroup.com/articles/why-does-design-look-good/

なぜデザインが良く見えるのかを解説しています。

  1. タイポグラフィと余白
  2. 階層構造と色
  3. 一貫性

図3 なぜデザインが良く見えるのか

図3 なぜデザインが良く見えるのか

4. Clone Wars - Open source clones of popular siteshttps://gourav.io/clone-wars

GitHubで公開されている,有名サイトのクローンをまとめた記事です。

Amazon,Apple Music,Clubhouse,Facebook,Gmail,Instagram,NetflixなどをHTML+CSS+JSで再現したコードを入手できます。

図4 有名サイトのクローンいろいろ

図4 有名サイトのクローンいろいろ

5. Generate unique SVG design assets | Haikeihttps://haikei.app/

背景画像やパターン画像を作るジェネレーターで,SVGかPNGでダウンロードできます。

波のような形,泡のような形,円や星型などを配置して,色や大きさをカスタマイズできます。

図5 背景画像やパターン画像のSVGジェネレーター

図5 背景画像やパターン画像のSVGジェネレーター

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

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

Tally formshttps://tally.so/

TallyはNotionのようなインターフェイスでフォームを作れるサービスです。シンプルで見た目の洗練されたフォームを簡単に作ることができます。Notionと同様にヘッダ画像やアイコン/ロゴをページの先頭に入れられます。

Notionのようにブロック単位でテキストやフォームの要素を追加していき,あとからドラッグで順番を入れ替えるなど編集も簡単です。ファイルのアップロード,条件分岐,カスタムの完了ページなどもできて,Googleスプレッドシートなどとの連携機能もあります。

サービスのUIもそうですが,サイトにもNotionの影響が感じられます。作ったフォームは「WebサイトかNotionに埋め込める」と記述してあり,やはりNotionを意識しているんだと納得しました。

図6 Notionのようなインターフェイスでフォームを作れるサービス

図6 Notionのようなインターフェイスでフォームを作れるサービス

今週の気になるWebネタ

Appleが初代HomePodの販売を終了,好評のminiに注力 | TechCrunch Japanhttps://jp.techcrunch.com/2021/03/13/2021-03-12-apple-discontinues-original-homepod-will-focus-on-mini/

Appleが2018年に発売したスマートスピーカーHomePodの製造を終了するそうです。今後は2020年発売のHomePod miniに注力するとのこと。

初代HomePodは在庫がなくなり次第終了とのことで,値段は高いですが大きくて音の良いHomePodを手に入れるのはラストチャンスとなりますね。HomePod miniでも十分大きく良い音が出るそうですが。

スマートスピーカーは各部屋に置くなど複数買う人も多いようなので,小さなサイズでお手頃な価格の方が良いというのはうなずけます。名称的に「mini」と付いているものだけが残るのも変なので,いずれこのminiは名前から外れるのでしょう。

著者プロフィール

アシカガコウジ

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

http://bit.ly/ashikaganote