目次

表紙
本書について
はじめに
目次
本書の読み方
サンプルファイルについて
本書の構成
Chapter 1 Figmaの基本操作
Lesson 1 フレーム・プラグイン
Lesson 2 オートレイアウト
Lesson 3 スタイル
Lesson 4 コンポーネント
Lesson 5 コンポーネントプロパティ・バリアント
Lesson 6 バリアブル
Lesson 7 プロトタイプ
Chapter 2 Stockpile UIの土台となる「ファウンデーション」
Lesson 1 本書で作るUIキット「Stockpile UI」
Lesson 2 ファウンデーション
Lesson 3 命名規則
Lesson 4 タイポグラフィ
Lesson 5 カラー
Lesson 6 余白
Lesson 7 線
Lesson 8 角丸
Lesson 9 影
Lesson 10 アイコン
Chapter 3 アプリやWebページの部品となる「コンポーネント」
Lesson 1 ボタン
Lesson 2 フォーム
Lesson 3 トグル
Lesson 4 ラジオボタン
Lesson 5 ドロップダウンメニュー
Lesson 6 チェックボックス
Lesson 7 セグメンテッドコントローラー
Lesson 8 ハンバーガーナビゲーション
Lesson 9 ヘッダー
Lesson 10 タブ
Lesson 11 ナビゲーションバー
Lesson 12 パンくずリスト
Lesson 13 アコーディオン
Lesson 14 リスト
Lesson 15 カード
Lesson 16 テーブル
Lesson 17 アラート
Lesson 18 プログレスバー
Lesson 19 スピナー
Lesson 20 ツールチップ
Lesson 21 モーダル
Chapter 4 オリジナルアプリを作る準備
Lesson 1 アプリを作る流れ
Lesson 2 オリジナルアプリについて
Lesson 3 ファウンデーション
Lesson 4 コンポーネント①
Lesson 5 コンポーネント②
Chapter 5 オリジナルアプリを作る
Lesson 1 ログイン
Lesson 2 パスワード再発行
Lesson 3 マイページ
Lesson 4 会員情報
Lesson 5 ピザ一覧
Lesson 6 ピザ詳細
Lesson 7 カート
Lesson 8 モーダル
Lesson 9 お知らせ一覧
Lesson 10 エラー
Chapter 6 デザインシステムについて知る
Lesson 1 デザインシステムについて
Lesson 2 作る目的をまとめよう
Lesson 3 どのようなものを作るか方針を立てよう
Lesson 4 作るものをリストアップしよう
Lesson 5 デザインシステムを作るときに意識すること
Lesson 6 作ったデザインシステムを運用してみよう
索引
著者プロフィール
奥付

著者プロフィール

• 相原 典佳（著者）

  相原典佳（あいはら・のりよし）
  DTP、Webディレクター業務を経たのち、2010年にフリーランスとして独立。ディレクションからデザイン、構築まで、一貫したWebサイト制作を提供している。
  現場での経験や知識を元に、デジタルハリウッドなどで講師を担当するほか、「Web初心者を抜けた人たち」向けのコミュニティ、Beans Collegeの運営を行っている。

• 岡部 千幸（著者）

  岡部千幸（おかべ・ちゆき）
  UIデザイナー
  法政大学デザイン工学研究科システムデザイン専攻卒業。事業会社にて、既存サービスのグロースやゲーム開発、新規サービスの立ち上げ等を経験し、独立。
  個人事業主として多くのプロダクト開発を経験後、株式会社cencoを設立。
  現在は、UIデザインを軸足に、職域に縛られることなくプロダクト開発に携わっている。
  大学の非常勤講師や学生向けイベントでの講義も担当。