こんにちは！英検NULL級、Mizutani(@sirycity)です。受験歴なし。英単語間違えまくり。

今日はそんな英単語の難しさに定評のあるAtomic Designの話です。

Atomic Designとは

有名なデザインシステムのことです。まあ簡単に言えば以下の5種類にコンポーネントのディレクトリを分けるルールのことです。

• atoms
• molecules
• organisms
• templates
• pages

各々の概要については割愛します。解説ページいっぱいあるしな。

古い？

そしてこのAtomic Designですが2023年現在お世辞にも モダンな技術とは言えなくなってきています 。少し調べれば「Atomic Design やめた」「古い」「失敗」などの言葉が並びます。特にmoleculesとorganismsに迷うとか、organismsが肥大化するとか、そもそも英単語のチョイスの癖強すぎだろといった意見が散見されます。分かる。特に最後の。

そんな中で、Atomic Designに変わるようなデザインシステムもたくさん考案されています。このあたり。

Atomic Designをやめてディレクトリ構造を見直した話

Reactのディレクトリ構成でAtomicデザインをやめた話

アトミックデザインをやめて、ディレクトリ構造を見直す

Reactを使ったコンポーネント指向設計で、Atomic Designをやめようとしている話

Reactでアトミックデザインやめた話

それでも使う理由は知名度があるから

一方、こんな短所があり時代の波に取り残されつつあるAtomic Designを未だに僕は使い続けています。そして今後も使うでしょう。その理由、それは知名度です。

ディレクトリの切り分け方にまで言及したデザインシステムとしてAtomic Designの知名度は群を抜いています (他にあったらごめん)。有名であることはそれだけで強みだと考えています。たとえば、新しく入った開発者の学習速度とか影響するんじゃないでしょうか。あーAtomic Designっすね！で終わるのと、(効率が良かったとしても)独自、もしくはマイナーな構成だった場合にそれに慣れるコストとを比較した時に前者を取ってる感じです。最初から知ってる率が高いんですね。

余談

全然余談なんですがこのご時世にわざわざ(TypeScriptじゃなくて)JavaScriptを採用するようなプロジェクトにも同じようなことが言えると思って、JS書ける人、TS書ける人より圧倒的に多いです。もちろんそんなのを覆すレベルでTS採用のメリットが大きいのは十二分に承知なんですが、LPとか小規模サイトみたいなミスってもどうってことないプロジェクトなら2023年現在でもJSの採用は全然ありだと思います。フロントエンドエンジニアがTSに夢を見てる…って言ったら言い過ぎですが、GitHubですら未だにJSの方が圧倒的に多いですしね。知名度が過小評価されてるなって思うことはあります。

さいごに

Atomic Designからバイバイする人を結構見て、ちょっと寂しくなったので書いた記事でした。あとアナリティクスをGA4に変えたのでその検証？のためになんか書きたかったってのもある。みんなもCSS楽しもうな。以上！