モデリングとOOUIとFigmaとCSSとコンポーネント設計
#フロントエンド #CSS #コンポーネントツリー
from モデリング
システムの振る舞いを設計する際はコトに着眼する
ドメインイベントとEvent Sourcingは永続化の設計判断を遅らせることができる
---
#メンタルモデル
ソフトウェア開発を加速させるエンジニアとデザイナーの関係性
UIデザイナーのスキルとOOUI観点の構造設計
モデルベースUIデザイン
FigmaでUI仕様設計
---
実装とメンタルモデルを一致させたいのはFigmaではなくOOUIの元となるモデルである
情報設計、概念モデルが大事
情報設計は人間を変える
安定依存の原則(SDP)
この文脈でのモデルとは、ICONIXなどの成果物としてのUMLやワイヤーフレームレベルの話
決断を遅らせる
表層は後から決める
Figmaは仕様を定義するツールなのか？
Figmaを堅牢化する運用コストは見合わない
Figmaのコンポーネントは、合意形成のためのものと割り切る
開発目線で欲しいもの
UXの5段階モデルの表層と骨格レベルの単位やレイアウト, スペーシングの概念
デザイントークン
The five UI states
Interaction State Layer
デバイスごとの差分や伸び縮み
厳格なデザインシステムを運用するならばデザインエンジニアというロールを配置する
お互いに寄り添って妥協できる落とし所を見つける
構造やコンポーネントツリーは実装者へ委譲したい場合も
開発組織は全体的にデザイン思考を早く回したい
しかし本質は目に見えないところにもある
ユーザーインタフェースにおける問題提訴と問題空間と問題解決
→オブジェクティブなデザイン
関連
/mrsekut-p/最初からCSSでデザインを作る
CSSぐらいてめぇが書けよ海溝
CSS設計における、すべてがコンポーネントであるという誤謬
#完璧主義を捨て去る