週刊Webテク通信

2021年1月第5週号 1位は，自分にはTailwind CSSが向かない理由，気になるネタは，反Facebookの「MeWe」が急成長--広告なし，プライバシー重視のSNS

Webテク, Webデザイン, Web広告, CSS, UI, SNS

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

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

1. Why Tailwind Isn't for Me - DEV Communityhttps://dev.to/jaredcwhite/why-tailwind-isn-t-for-me-5c90

Tailwind CSSが自分には向かないという人による，問題点の指摘です。

  1. 醜いHTMLを作り上げる
  2. @applyでの記述方法は互換性がなく標準的じゃない
  3. 標準技術のCSSカスタムプロパティに置き換えることができる
  4. Webコンポーネントが存在しない
  5. divやspanタグを使うことを推奨している

これを踏まえた上で，Tailwind CSSの作者による「CSS Utility Classes and "Separation of Concerns"」の日本語訳「翻訳：CSSユーティリティクラスと「関心の分離」（⁠いかにしてユーティリティファーストにたどり着いたか⁠）⁠ - yuhei blog」もぜひ読んで欲しいです。

なぜユーティリティファーストのCSSに行き着いたのか，単なるインラインでのスタイルの記述との違いなどを解説していて，Tailwind CSSの設計思想に触れることができます。

図1　自分にはTailwind CSSが向かない理由

図1　自分にはTailwind CSSが向かない理由

2. 7 Inspiring Graphic Design Trends for 2021 | Vectornator Bloghttps://www.vectornator.io/blog/graphic-design-trends-2021

グラフィックデザインのトレンドをまとめています。

  1. レトロフューチャリズム
  2. グラスモーフィズム
  3. 手描きイラスト
  4. 白黒デザイン
  5. 自然からのインスピレーション
  6. 手触り感のあるデザイン
  7. つながりを作るデザイン

図2　グラフィックデザインのトレンド7つ

図2　グラフィックデザインのトレンド7つ

3. UI Design Trends for 2021 | Boxmode Bloghttps://blog.boxmode.com/ui-design-trends-for-2021/

2021年のUIデザインのトレンドについての長い記事です。モバイルによるインターネットユーザーが増加しているインド，ナイジェリア，コンゴでのUIデザインの傾向など，興味深い切り口で解説しています。

インドでは紫色とピンクが流行しており，オレンジ色と緑がそれに続くそうです。また，ナイジェリアのUIではカリカチュア（風刺画）がよく使われているとのことでした。

図3　2021年のUIデザインのトレンド

図3　2021年のUIデザインのトレンド

4. Amazing Free UI Illustrations and How to Use Themhttps://designerup.co/blog/amazing-free-illustration-resources-and-how-to-use-them-in-ui-design/

イラスト素材の配布サイトを多数まとめています。この手のサイトはかなりチェックしているつもりでしたが，知らないところがたくさんありました。

イラスト素材に一手間加えてオリジナリティを出す方法も参考になります。

図4　イラスト素材の配布サイトいろいろ

図4　イラスト素材の配布サイトいろいろ

5. Vector Pattern Generator | VISIWIGhttps://www.visiwig.com/patterns/

ベクターベースのパターンジェネレーターです。サイズや色，角度などをカスタマイズできます。某人気漫画でおなじみの市松模様も作れますね。

SVGかCSSとしてコピーしたり，SVGファイルとしてダウンロードできます。

図5　ベクターベースのパターンジェネレーター

図5　ベクターベースのパターンジェネレーター

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

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

Shuffle — An online editor for busy developershttps://shuffle.dev/

Shuffleはコンポーネントのブロックを積み上げていくスタイルのWebページビルダーです。Bootstrap，Tailwind CSS，Bulma CSS，Material-UIに対応しています。

ビルダーだけでサイトを完成させるのではなく，自分でカスタマイズできる人が素早くベースを作るためのものです。そのために，いろいろなCSSフレームワークに対応しているんですね。

有料サブスクリプションで，月額制の場合は月24ドルです。サイト制作の最初にだけ使うんだったらひと月で十分でしょうし，24ドルでCSSフレームワークでのコーディング済みのプロトタイプを作れると考えると，かなりコスパがいいと思います。

図6　各種CSSフレームワークに対応したWebページビルダー

図6　各種CSSフレームワークに対応したWebページビルダー

今週の気になるWebネタ

反Facebookの「MeWe」が急成長--広告なし，プライバシー重視のSNS - CNET Japanhttps://japan.cnet.com/article/35165334/

Facebookに対抗するプライバシー重視のSNS「MeWe」のユーザー数が急増しています。20の言語に翻訳されており，米国以外のユーザーも多く香港では最も人気の高いソーシャルアプリとなっているそうです。

日本でも最近MeWeについての話題を目にすることが増えてきました。マストドンのように一時的なブームのあと定着しないパターンも考えられますが，ともかく新しい物好きの人がどんどんアカウントを作っているように感じます。

また，音声SNSのClubhouseも最近日本でも話題にする人が増えてきました。TwitterはClubhouseに対抗したSpacesを開発していますし，Discordも音声SNSと考えると，日本でも音声SNSが盛り上がりつつあるのかもしれませんね。

Webテク, Webデザイン, Web広告, CSS, UI, SNS

著者プロフィール

アシカガコウジ

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

http://bit.ly/ashikaganote