Figma for デザインシステム ＜UIデザイナーとして一歩先に行くためのマスター講座＞

デザインシステムとは「デザインを中心としたプロダクト開発の仕組み作り」のことで、エンドユーザーに一貫した体験を効率的に提供することを目的としています。

デザインシステムを構築するためには、Figmaの高度な機能を使いこなす必要があります。コンポーネントやスタイル、デザイントークン、バリアント、バリアブル（変数）などは、従来のデザインツールには存在しなかった概念であり、プログラミングの考え方を色濃く反映しています。

デザイナーは、これらの機能を理解し適切に使用することで、コンポーネントやコードとの連携方法を設計できます。Figmaは、デザイナーがレイアウトやインタラクションなどの視覚的な領域から飛び出し、エンジニアとのコラボレーションを強化する後押しをしてくれます。

この講座では「デザインシステムには興味があるけど何から始めてよいか分からない」といった方の参考になるように、具体的な作例を用いて段階的に解説を進めます。Figmaの初歩的な操作方法を理解されている方のステップアップとしても最適な内容です。「デザインシステムはまだ必要ない」という方でも、そのコンセプトを理解し、この講座で解説する機能を習得すれば、既存のデザインプロセスを改善できるはずです。高度化したFigmaへの理解を深めることで、プロダクト開発を加速させましょう！

尚、この講座は拙著『Figma for デザインシステム デザインを中心としたプロダクト開発の仕組み作り』（翔泳社）をもとに構成しています。紙面では伝わりにくい操作方法も動画で丁寧に解説しています。