内容説明
※この商品は固定レイアウトで作成されており、タブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字列のハイライトや検索、辞書の参照、引用などの機能が使用できません。
前半ではFigmaの基本操作を学びます。UIコンポーネントとスタイルを集めた本書オリジナルのUIキット「Stockpile UI（ストックパイルユーアイ）」を元に、UIデザインで必須のコンポーネントやアイコンについて、その機能や目的を学びながらデザインしていきます。後半では本書オリジナルアプリに実装することで、一連の制作の流れを体験できる内容になっています。「いろいろなサンプルを一気に見たい」「とにかく早く実務に生かしたい」人に役立ちます。Chapter 1で利用する練習用のファイルと、本書オリジナルのUIキット「Stockpile UI」のデータをサンプルファイルとして使用することができます。
目次
表紙
本書について
はじめに
目次
本書の読み方
サンプルファイルについて
本書の構成
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 作ったデザインシステムを運用してみよう
索引
著者プロフィール
奥付
感想・レビュー
※以下の感想・レビューは、株式会社ドワンゴの提供する「読書メーター」によるものです。
mekatamatama
