Amazon iconAmazonで購入Mouse Cursor IconMouse Cursor IconMouse Cursor Icon
表紙

Figma for デザインシステ デザインを中心としたプロダクト開発の仕組み作り
[翔泳社]

公式サポートサイト

サンプルファイルや掲載リンクの一覧をご確認いただけます。
本書に関する質問はTwitter icon@shunwitterまでご連絡ください。

前のUIに戻る

UIが変更されます

2024年後半にFigmaのUIが大幅に変更されます(待機リストに登録した方は、それよりも早い時期に更新されます)。
本書の解説に沿ってスムーズに学習を進めるには、画面右下の[?]をクリックし、[以前のUIに戻る]を選択してください。
Figmaの機能は維持されるので、本書で学習した内容は、新しいUIでもそのまま活用できます。

Chapter 1

デザインシステムを知る

Chapter 2

プロフェッショナルなFigma

P87に掲載の「数字の適用範囲」は、同じパネル内の[スコープの設定]タブに移動しました。

スコープの設定
Chapter 3

デザインシステムをはじめる

サンプルファイル

以下のリンクからサンプルファイルにアクセスできます。作例ファイルとは利用方法が異なるので注意してください。 サンプルファイルに初めてアクセスした際には、ツールチップが表示されます。[編集を依頼]を押さずに[了解]をクリックしてください。

サンプルファイルの使い方 1

ファイル名の隣にある小さなアイコンをクリックし、[ドラフトに複製]を実行すると、ご自身の環境にコピーが作成されます。複製されたファイルを任意のプロジェクトに移動してご利用ください。「Chapter 3」以後のサンプルファイルも同じ方法でご利用頂けます。

サンプルファイルの使い方 2
Chapter 5

タイポグラフィ

P178、アクセシビリティに関する内容に誤りがありました。

  • 誤:アクセシビリティのガイドライン(WCAG 2.1)では、文字間隔をフォントサイズの0.12%以上にすることをレベルAAの達成基準としていますが、
  • 正:アクセシビリティのガイドライン(WCAG 2.1)では、文字間隔をフォントサイズの0.12倍以上にすることをレベルAAの達成基準としていますが、
内容の誤り

その他