Design
Coding
Setting
Figma(フィグマ)とは
01:03デザインファイルの構成を知る
Figmaのデザインファイルについて説明していきます。
ファイルの構成
Figmaのデザインファイルは、ウェブサイトやアプリのデザインを作成・管理するためのものです。
以下に主な要素を紹介します。
ツールバー
ツールバーは、デザイン作業においてよく使用されるツールが並んでいます。
例えば、選択ツール、ペンツール、テキストツールなどがツールバーに配置され、それらをクリックすることで対応する機能を利用できます。
- メインメニュー
ファイル作成やインポートができます。 - 移動ツール
オブジェクトの移動や拡大縮小ができます。 - リージョンツール
フレームやセクションが作成できます。 - シェイプツール
四角形や丸などの図形を作成できます。 - ペンツール
パスを持った線を描画できます。 - テキスト
テキストを追加・編集できます。 - リソース
作成したコンポーネントやプラグインを確認できます。 - 手のひらツール
キャンバスの上下左右に移動できます。 - コメントツール
コメントの追加ができます。
左サイドバー
左サイドバーは主にレイヤーパネルとアセットパネルから構成され、デザイン要素の管理などを行うためのものです。
右サイドバー
右サイドバーは、プロパティパネルで選択したデザイン要素の詳細なプロパティや設定を行ったり、プロトタイプパネルでウェブサイトの動きを模擬的に再現できるプロトタイピング機能を追加することができます。
以上、「デザインファイルの構成を知る」について説明でした。
次のステップで、 「各種ツールの使い方」について説明していきます。
Figmaの使い方
全 14 動画
