Figma
ブラウザベースの UI/UX デザイン・プロトタイピングツール。実装前の設計段階(UX/UI デザイン)を担う。「ユーザーの感情を爆発させる部分をまず作る」というプロトタイピング思想。
活かし方
- variant・auto layout・constraint を組まないと真価が出ない。
- Figma Tokens から JSON を吐き、デザイナ主導でデザイン変更 → デザインシステムによる「デザインの民主化」。Storybook との連携でコードと同期。
- コンポーネントとして忠実に実装するとファイルが重くなる、というプロトタイピングの限界も認識。
UI デザインのプラクティスは Checklist Design 等のチェックリストで補完(knowledge-organization 的な蓄積)。ナビ: _moc-tools
原典メモ（notes/Figma より統合）
デザインツール
- なんか開発の前段階(設計・UX/UIデザインをやるべきな気がしてきた)
「ユーザーの感情を爆発させる部分をまず作る」
コンポーネントとして実際に実装すると重い
- Figma × Storybook × Tokensで、デザインツールのその先へ
- figmaのFigma Tokensからjson吐けてデザイナ主導でデザイン変更できるのとてもいいな
- figmaをしっかり活かすためにはやはりvariant, auto layoutとかconstraint組まなければいけない
- デザインシステムでデザインの民主化が出来る