「1つのボタンの色を変えるのに、なぜ十数個のファイルを開かなければならないのですか？」

デザインシステムがなければ、チームの一日はこうやって始まります。

このコースでは、最初から最後までその繰り返しを断ち切る方法を一緒に作っていきます。

こんにちは、私はシステムを使って時間を短縮しているデザイナーの一人です。

限りある資源システムやスピードをためらわずに変える力を体感してきました。

これにより、政府のプロジェクトは13億9000万ウォン、30億投資を集めるという成果を上げました。

専門知識はレッド・ドット・アイデア・アワードで表彰されました。

最初から最後まで一緒にデザインシステムを構築しましょう！

「なぜ同じ修正が繰り返されるの？」

それが私のデザインシステム構築の旅の始まりでした。

スタートアップで滞りなく最初のデザインシステムを作った自分の姿は、今でもはっきりとわかっています。やるべきことはたくさんありましたが、どこから始めたらいいのかわからなかったので圧倒されました。私も試行錯誤しながら少しずつ学び、ついにFigma VariablesとToken Studioを使ってチーム全体の生産性を最大化できる設計システムを完成させました。これにより、「メンテナンス時間を 40% 削減」した結果を自分の目で見ることができました。

この授業では、その過程をそのまま解いていきます。

このコースでは、デザイントークンの概念、3段階の構造（プリミティブ→セマンティック→コンポーネント）、1-Clickでダークライトテーマを変数で切り替える方法、Token Studioを使用してJSONを開発者に提供する方法、および1つのフローでバージョンを管理するための実用的なワークフローを完成させます。

こんな人におすすめ

毎日Figmaを使っているが自分でデザインシステムを作ったことがない、Token StudioやVariablesについて聞いたことがあるがどこから始めたらいいのかわからないデザイナー、開発者との引き継ぎにいつも不安を感じている人、スタートアップや中小企業で初めてデザインシステムを単独で採用しなければならない実践的なデザイナーであれば、このコースは最初の一歩となるでしょう。

終了後

✔️ パレット、タイポグラフィ、スペースなどのさまざまなデザイン値をトークンで管理

✔️ ワンクリックで暗いテーマと明るいテーマを切り替える

✔️ JSON とコード仕様を開発者に提供

✔️ トークンスタジオ→GitHub統合で実際のバージョン管理ワークフローを完成させよう

デザインシステムはもはや大企業だけのものではありません。

また、初めてのクリエイターでも完了できるように、クリックの順序も表示されます。

一緒に作りましょう。

悩みを分かち合い、共に成長していく皆さんを心から応援します 🚀

Figma Variables x トークンスタジオで構築されたデザインシステム

Figma Variables x トークンスタジオで構築されたデザインシステム