Figma for デザインシステム デザインを中心としたプロダクト開発の仕組み作り(沢田 俊介)|翔泳社の本
  1. ホーム >
  2. 書籍 >
  3. Figma for デザインシステム デザインを中心としたプロダクト開発の仕組み作り

Figma for デザインシステム デザインを中心としたプロダクト開発の仕組み作り 新刊


形式:
書籍
発売日:
ISBN:
9784798181493
定価:
3,080(本体2,800円+税10%)
仕様:
B5変・280ページ
カテゴリ:
パソコンソフト
キーワード:
#OS・アプリケーション,#ビジネスIT,#グラフィックソフト・ツール,#Web・アプリ開発
紙の書籍

UIデザイナーとして一歩先に行くために

本書はFigmaを使ったデザインシステムの構築方法が学べるチュートリアルです。「デザインシステムとは何か」から始まり、実践を通して「どのように作るのか」を学べます。具体的な作例を用いて段階的に構築していくので、「デザインシステムに興味があるけど何から始めてよいかわからない」といった方や、Figmaの初歩的な操作方法を理解している方のステップアップとしても最適です。「デザインシステムはまだ必要ない」という方でも、本書で解説する機能を使いこなせば、既存のデザインプロセスを改善できるはずです。

●本書の目的
1.プロダクト開発全体を効率化し、エンドユーザーへの価値提供に集中する大規模なプロダクトで素早く改善サイクルを回す
2.デザインの一貫性、拡張性、保守性を向上させる
3.開発チームのコラボレーションを強化する

〈こんな人のための本です〉
・Webデザイナー
・UI/UXデザイナー
・サービスやプロダクトの開発者

〈目次〉
Chapter 1:デザインシステムを知る
Chapter 2:プロフェッショナルなFigma
Chapter 3:デザインシステムをはじめる
Chapter 4:デザイントークン
Chapter 5:タイポグラフィ
Chapter 6:デザインシステムの拡充
Chapter 7:パターンライブラリ
Chapter 8:実装コードとの連携

画像01

Chapter 1:デザインシステムを知る
1-1. デザインシステムとは
1-2. デザインシステムとFigma
1-3. デザインシステムの始め方
Chapter 2:プロフェッショナルなFigma
2-1. 学習の準備
2-2. オートレイアウト
2-3. コンポーネント
2-4. バリアブル
2-5. 開発モード
Chapter 3:デザインシステムをはじめる
3-1. ファイル構成
3-2. チームライブラリ
3-3. カラーパレット
3-4. アクセシビリティ
Chapter 4:デザイントークン
4-1. デザイントークンを定義する
4-2. セマンティックカラー
4-3. デザイントークンを使う
4-4. モードの切り替え
Chapter 5:タイポグラフィ
5-1. 書体とスケール
5-2. 行間と文字間隔
5-3. タイポグラフィのデザイントークン
Chapter 6:デザインシステムの拡充
6-1: イコノグラフィ
6-2: エレベーション
6-3. そのほかのスタイル
6-4. ルールを適用する
Chapter 7:パターンライブラリ
7-1. レイアウトのルール
7-2. 画面サイズ別のレイアウト
7-3. コンポーネント
7-4: ドキュメント
Chapter 8:実装コードとの連携
8-1. デザイントークンの連携
8-2. Storybook

本書は付属データの提供はございません。

お問い合わせ

内容についてのお問い合わせは、正誤表、追加情報をご確認後に、お送りいただくようお願いいたします。

正誤表、追加情報に掲載されていない書籍内容へのお問い合わせや
その他書籍に関するお問い合わせは、書籍のお問い合わせフォームからお送りください。

利用許諾に関するお問い合わせ

本書の書影(表紙画像)をご利用になりたい場合は書影許諾申請フォームから申請をお願いいたします。
書影(表紙画像)以外のご利用については、こちらからお問い合わせください。

  • サポートページのご案内

    本書のサンプルファイルや正誤情報は以下のサポートページをご覧ください。
    https://ds.figbook.jp/
正誤表の登録はありません。