作って学ぶFigma入門［完全版］　ステップ・バイ・ステップで身につくWeb/UIデザインの基本

かならず作れる！ ハンズオン形式で学べる Figmaの入門教科書です。 Figmaを使ったWeb/UIデザインをマスターするには、実際のWebサイトを作りながら学べるハンズオン形式が最適です。本書は、解説の通りに操作を進めることでFigmaの基本をマスターできる、初学者必携の入門書です。解説に使用している作例データは画像を含めてダウンロードできるので、 1実務に即したデザインを 2実際の流れに沿って制作し 3完成させることができます！ オートレイアウト、コンポーネント、スタイル、バリアブルといったFigma特有の機能はもちろんのこと、最新のWebサイトに必須のハンバーガーメニュー、カルーセル、レスポンシブ対応など、現場で今すぐ活用できるスキルをこれ1冊に詰め込みました。Figmaの最新UIにも対応した、Figma入門の決定版です。 ●こんな方におすすめ ・Webデザイナーを目指す学生・社会人の方 ・制作会社に入ったばかりの新人Webデザイナーの方 ●本書の内容 LESSON 1 Figmaの概要とレッスンの準備 LESSON 2 スマートフォンのWebデザイン LESSON 3 スクロールするスマートフォン画面 LESSON 4 ページ遷移するカード型ページ LESSON 5 ハンバーガーメニューとカルーセル LESSON 6 レスポンシブなWebデザイン LESSON 7 インタラクティブなUIパーツ ●本書で学べる内容 レイアウトグリッド／オートレイアウト／コンポーネント／インスタンス／プロトタイプ／スタイル／バリアブル／バリアント／オーバーレイ／ハンバーガーメニュー／カルーセル／レスポンシブ／ナビゲーション／検索用ウィンドウ／アニメーション／チェックボックス／ファイル共有　など はじめに 本書の利用方法 LESSON 用のサンプルファイル 本書の LESSON で作成する内容 ●LESSON1　Figmaの概要とレッスンの準備 01 FigmaとUI/UXデザイン 02 ソフトウェアの準備 ●LESSON 2　スマートフォンのWebデザイン 01 スマートフォン画面の作成 02 画像とテキストの基本操作 03 アイコンの作成 ●LESSON 3　スクロールするスマートフォン画面 01 オートレイアウトの基本操作 02 コンポーネントの基本操作 03 iOSコンポーネントの利用 04 プロトタイプの基本操作 ●LESSON 4　ページ遷移するカード型ページ 01 スタイルの作成 02 バリアブルの作成 03 ページ遷移の作成 04 オーバーレイの作成 ●LESSON 5　ハンバーガーメニューとカルーセル 01 ハンバーガーメニュー 02 カルーセルの作成 03 アプリでプレビュー再生 04 Figmaファイルの共有 ●LESSON 6　レスポンシブなWebデザイン 01 レスポンシブなフレームの拡大 02 プロパティによるデザイン変更 ●LESSON 7　インタラクティブなUIパーツ 01 検索用ウィンドウの作成 02 検索操作アニメーションの作成 03 チェックボックスの作成 04 ドラッグで閉じるウィンドウ Google フォント カラーコード ショートカットキー一覧