CSS設計における、すべてがコンポーネントであるという誤謬

後日追記: WEB+DB PRESS Vol.133でさらに詳しく書いた。 BEMによってもたらされた、コンポーネントベースのアプローチでは、「ページはコンポーネントの集合によって表現されるべきであり、ページに含まれるのはすべてがコンポーネントである」と考える。しかしこれまでCSSを書いてきた経験から、これではデザイン意図をまともに表現することができないと感じ始めた。なぜなら、普通デザイナーはページのすべてがコンポーネントであるとは考えないからだ。 もちろんページの構成要素のなかには、明らかにそれが「コンポーネント」であると意識して作られたものもある。ただしそれは一部であり、全部ではない。「コンポーネントもあれば、コンポーネントではないものもある」という感覚のほうが普通なのだ。 典型的なUIライブラリにある、「ザ・コンポーネント」みたいなものだけではページは完成しない。例として、一貫してB

[ustam]

コンポーネント思考になれないデザイナーはプロのデザイナーとは言えないのでお引き取り願いたいのだが、デザイナー不足の昨今そうも言ってられないんだよなあ。せめて学習してほしい。

[take-it]

制作上の問題だけじゃなくて、「偶然似ているだけなので共通化できないパターン」がユーザーの行動にとって意味があるのか、ビジネスとして利益になるのか、みたいなとこもぶっこんでいきたい。

[sabro]

UIはプログラムの中で一番人間に近い部分なのできっちり構造化するより全体の印象みたいな感覚的なところが重要になるというのは分かる。バックエンドにいくほど構造的、フロントエンドにいくほど柔軟であるべき

[neet_modi_ki]

具体例がないとなんとも言えないが…微妙に違うパターンなどは、本来コンポーネントのバリエーションとして取り扱うべきなのでは？デザイナーの意図も気になる（あらかじめ相互の認識合わせがあれば防げる問題？）

[i5s4y]

こういうので苦しみ続けると、Tailwindの偉大さが分かる

[yarumato]

“デザイナーにとって「コンポーネントもあれば、コンポーネントではないものもある」という感覚が普通。条件分岐が複雑になり割に合わない膨大な数のコンポーネントができあがる。必要を超えた構造化は害になる。”

[kagehiens]

確かにCSSの基本思想はそういうところあるよな……それに忠実に構造化されたものを作ろうとしても実際上の要求を入れ込んでいこうとすると、弊害の方を強く感じるようになってしまうというか。

[fujii_yuji]

"必要を超えた構造化は害になる。"って考え方は僕も好きだな。もちろん必要な範囲ならそれは良いものだとして。

[knjname]

じゃけんtailwind方面に進化しましょうねー

[rryu]

ビジュアルデザインする人もコンポーネント化を意識していないと無理が出てくるというだけな気がする。他ページとの整合性を取らず一枚の絵として作ると細部がなにげにちょっとだけ違うものが出来がちである。

[kiririmode]

デザイナーとエンジニアのインピーダンスアンマッチ

[strawberryhunter]

コンポーネントというか、BEMは要素間の依存関係を無くすための方法論なので、コンポーネントを分割する時に困る状況というのは何かが間違っているんだろう。SassやCSS Variablesのようなものも活用してはいかがだろうか。

[uehaj]

これがtailwindが流行る理由だと思う。

[AmaiSaeta]

「コンポーネントに無理解なデザイナーが悪い」と評すると、誰も得しない。デザイナー視点では「コンポーネント」なんて無くて良い訳だから。 | しかし、その結論がユーティリティファーストというのは納得しかねる。

[xlc]

こういうのって具体例で話をしないとポエムになっちゃうよな。

[mayumayu_nimolove]

一人でやった方がいいとか思っちゃうほどめんどくさいのはなんとかしなければならない

[manaten]

“一貫した印象を与えるために、意図的に共有している要素"　こういうのは表現可能なら定数やmixinて表現できると良さそうではある…

[Rishatang]

「ページに含まれるのはすべてがコンポーネントである」みたいな考えの人自分は見たことなかったんだけど、自分の周りにいないだけで結構いるのかな。明らかなコンポーネント以外は特にコンポーネント化してなかった

[wait0000]

ユーザ体験が一番良いデザインが丸だとして、コンポーネント指向が四角、これだけだと丸を埋め立てるのは無駄が多くて大変だけど、状況に応じて三角や五角を使えたらもっと丸に近づけやすいよね、という話と理解した

[kvx]

コンポーネントの考えがない人は構造化、アクセシビリティも弱い。

[for-my-internet-demo]

メディアならわからなくもない。webアプリで説明不能なものそうそう思いつかないが

[onesplat]

アプリケーションとグラフィックの違いな気がする。グラフィック部分にコンポーネント指向の設計がフィットしないのは理解できる。グラフィック部分を大きなコンポーネントとして隠蔽してしまうのが良いだろう。

[tomono-blog]

まず、そんなに意識してるデザイナーはいないし、ページをコンポーネントにこだわって閲覧してる客もいない…ただ、cssを全く見ない触らないデザイナーは論外だ。

[tinsep19]

ページ内ではもちろんコンポーネントだけど、違うページ感では共有しにくいって話かな？perspective(見方)が違うのであれば、違うコンポーネントでしょ。そういうものだと思うわ

[chiroruxx]

この話だともっとデザイナーと対話しようという話に落ち着くんだけどある程度はコンポーネント指向であるということをデザイナーも理解する必要がありそうよなとは思った。

[otchy210]

場合による。システム寄りの構造化されたアプリであれば、デザイナもコンポーネント指向でデザインすべきだし、デザイン寄りのビジュアル重視のサイトであれば、デザイナはコンポーネントの縛りから自由であるべき。

[fai_fx]

コンポーネント・ベースで作成して、個別のページ内でユーティリティ的なカスタマイズを加えるのが楽。なぜなら、デザインの本質はバランスであり、ページ毎に個別に調整し尽くさなければ完成に至らないからだ。

[ryer]

機能に振るかアートに振るか、ってことかな？

[turanukimaru]

例えば新聞の一面は非コンポーネント。記事の構造が一定ではなく隙間なく詰め込まれてる。コンポーネント化すると画面が単調になり隙間ができる。この手のデザイナはタグを閉じる事すら嫌がるので技術屋としては困る

[ledsun]

“CSS設計上のコンポーネントの多くが、デザイナーの頭のなかにあるイメージと非対称的な構造になっている。エンジニアの頭の中にしかない、元のデザインを独自に解釈した「別物」を作り出してしまっている。”

[securecat]

ずっとコンテンツを追加していくとコンポーネント分解や破壊が起きるのは自明。で、デザインは過去産物をラスタライズしちゃえば済むんだけど、実装はすべてナマモノなので変更で生ずる工数が計り知れないんだよな。