セクションでキャンバスを編成

はじめに

この機能を使用できるユーザー

すべてのチームまたはプランで使用できます

ファイルの編集可アクセス権があるユーザーは、セクションを作成できます

関連するアイデアをグループ化してファイルにコラボレーターを導くために、ラベル付きセクションでキャンバスを編成します。

セクションで次のことができます:

• コラボレーションまたはアイデア創出のためにキャンバスのエリアを指定
• ナビゲーションが簡単になるようにファイルを編成
• デザインのグループにリンク
• コンテンツを「開発準備完了」としてマークし、開発者にハンドオフできます

Figma Designのセクションは、デフォルトでキャンバス上のトップレベル要素になっています。セクションには他のセクションを含むすべてのレイヤータイプがありますが、フレームやグループ内に含めることはできません。

セクションを作成

セクションを作成するには、次のようにいくつかの方法があります:

ツールバーおよびショートカット

1. ツールバーの[セクション]をクリックするか、キーボードのショートカット⇧ Shift Sを使用します。
2. セクションを移動するキャンバスの場所をクリックしてドラッグします。

追加するオブジェクトの上にセクションをクリックしてドラッグすることもできます。

選択

1. オブジェクトをクリックして、セクションに追加するキャンバスにドラッグします
2. 選択を右クリックして、メニューから[新しいセクションで囲む]を選択します。

オブジェクトをセクションに追加

オブジェクトをセクションに追加するには、次のようにいくつかの方法があります:

• オブジェクト上にセクションを移動
• オブジェクト上でセクションのサイズを変更
• オブジェクトを選択して、マウスまたはキーボードの矢印キーでセクションに移動

セクションを編集

タイトル

1. キャンバスまたは レイヤーパネル上のセクションタイトルをクリックします。
2. タイトルを編集します。
3. ReturnまたはEnterを押します。

塗りおよび線

右サイドバーの 塗りおよび 線セクションを使用して、セクションの背景およびボーダーの色を変更します。

塗りを追加する方法の説明 →

線のプロパティを適用して調整する方法の説明 →

セクションを共有

リンクをセクションにコピーして、コラボレーターをキャンバス内の特定のセクションに導くことができます。

1. 共有するセクションを選択します。
2. 右サイドバーの [共有] をクリックします。

セクションを開発準備完了としてマーク

セクション内のコンテンツが確定されると、そのセクションを開発準備完了としてマークできます。セクションにフラグを立てることで、開発者が開発モードを使用しやすくなります。

開発準備完了としてマークするには、次の手順に従います。

1. セクションを選択します。
2. [開発準備完了にする]をクリックします。
3. 開発準備完了としてのマークを解除するには、[開発準備完了]ラベルの3つのドットメニューをクリックし、[準備完了状態を削除]を選択します。

dev statusを更新

セクションを[開発準備完了]としてマークした後、デザインを変更した場合、Figmaは自動的にdev statusを変更済みに変更します。変更済みステータスは、開発者がready for devとマークされた後に反復するデザインを追跡するのに役立ちます。

セクションの変更済みステータスを解決するには、変更済みのステータスインジケーターをクリックし、変更の理由を入力します。その後、dev statusはready for devに戻ります。

Devハンドオフプロセスの管理について詳しく見る →

セクションを削除

セクションとそのコンテンツを削除するには、次の手順に従います。

1. セクションを選択します。
2. Delete/Backspaceを押します。

コンテンツを削除することなくセクションを削除するには、次の手順に従います。

1. セクションを選択します。
2. 次のショートカットを使用します。
   • Mac: Command Delete
   • Windows: ControlBackspace

セクション付きプロトタイプ

プロトタイプでは、セクションを使用してデザインの様々な部分間でフローを接続できます。

セクションへのコネクションを作成すると、Figmaでは最後に参照したセクションのフレームを記憶します。

セクションでのプロトタイピングについて詳しく見る →