---
url: "/ja/pitchdeck/design/slides.md"
description: "Pitchdeckは、Figmaプラグインを通じて現在のFigmaページからトップレベルの親フレーム、コンポーネント、インスタンスを読み込み、各フレームをプレゼンテーションの「スライド」として扱います。"
---

# プレゼンテーションのスライドをデザインする

> Pitchdeckは、Figmaプラグインを通じて現在のFigmaページからトップレベルの親フレーム、コンポーネント、インスタンスを読み込み、各フレームをプレゼンテーションの「スライド」として扱います。

## 資料にスライドを追加する {#adding-slides-to-your-deck}

[Video](/assets/videos/pitchdeck/design/pitchdeck-create-frame.mp4)

Figmaページに追加したトップレベルのFigmaフレーム、Figmaコンポーネント、Figmaインスタンスは、Pitchdeckプラグインでスライドとして扱われます。

最適な結果を得るために、スライドに使うFigmaフレーム、Figmaコンポーネント、Figmaインスタンスがすべて同じサイズになっていることを確認してください。

ほとんどの画面でプレゼンテーションするには、16:9の比率（例：**1280x720**や**1920x1080**）で統一したフレームサイズを使うのがおすすめです。

> **Tip:** **縦に長いスクロールできるフレームを追加する** 幅より高さのほうが大きいFigmaフレーム、Figmaコンポーネント、Figmaインスタンス（例：1920x2600）は、Pitchdeck Webアプリでプレゼンテーションするときに、自動的に「スクロールできる」スライドになります。Webサイトのモックアップなど、縦に長い「ページ」を資料内で見せたいときに便利です。

> **Note:** 縦向きのフレーム（例：1080x1920）を使いつつ、スクロールさせたくない（スクロールが標準の動作です）場合は、パスワードなしのPitchdeckプレゼンテーションURLに`&contain=true`を、トークンのないPitchdeckのURLに`?contain=true`を追加します。スライドが画面サイズ内に収まり、スクロールしなくなります。

> **Warning:** **親フレームを回転させると、要素の位置に影響します**。 回転（0以外の値）が設定された親フレームを使うと、その子要素のx/y位置に影響します。最初に縦向きのフレームを作成し、それを回転させて横向きにした場合などに、意図せずこの状態になることがあります。すべてが正しく配置されるように、親のFigmaフレーム、Figmaコンポーネント、Figmaインスタンスに回転が設定されていないことを確認してください。

## Figmaからスライドを読み込む {#loading-slides-from-figma}

[Video](/assets/videos/pitchdeck/design/pitchdeck-select-slides.mp4)

Pitchdeckを開く前、またはスライドローダーを更新する前に、キャンバス上でトップレベルのFigmaフレーム、Figmaコンポーネント、Figmaインスタンスの一部を選択しておくと、Pitchdeckはその選択した項目に絞り込むため、その一部だけを読み込めます。

このキャンバス上の一時的な選択によって、ほかのスライドの含める・除外するチェックボックスが変わることはありません。後でもう一度更新すれば、現在のFigmaの選択に含まれていなかったスライドのチェックボックスの保存状態を失わずに、追加のスライドを読み込めます。

## 編集するスライドを選択する {#selecting-a-slide-to-edit}

[Video](/assets/videos/pitchdeck/design/selecting-slides.mp4)

Pitchdeckプラグインの左側にある各フレームのサムネイル画像をクリックすると、プラグイン内でスライドを切り替えられます。

> **Note:** **親レベルのFigmaフレームが必要です**。 Pitchdeckにスライドを読み込むには、Figmaページに親のFigmaフレーム、Figmaコンポーネント、Figmaインスタンスが1つ以上含まれている必要があります。つまり、ページの*直下*にあるFigmaフレーム、Figmaコンポーネント、Figmaインスタンスです。

## スライドを含める・除外する {#including-or-excluding-slides}

[Video](/assets/videos/pitchdeck/design/excluding-slides-from-exports.mp4)

各スライド名の横にあるチェックボックスで、そのスライドを含めるか除外するかを切り替えます。除外したスライドは薄く表示され、サムネイルに**Excluded**バッジが付きます。Figma Slidesでは、スライドのチェックを外すとFigmaでそのスライドがスキップされます。Figma Designでは、スライドリストの上にある**Included**チェックボックスで、読み込んだすべてのスライドを切り替えられます。

複数のスライドをまとめて変更するには、スライドを選択して**More actions**（**…**）を選び、**Exclude from deck**または**Include in deck**を選びます。Figma Slidesでは、これらは**Skip slides**と**Unskip slides**になります。

## Figmaのフレームからスライドを更新する {#refreshing-your-slides-from-figma-frames}

[Video](/assets/videos/pitchdeck/design/refresh-slides-list.mp4)

Pitchdeckプラグインの実行中に、現在のFigmaページで親のFigmaフレーム、Figmaコンポーネント、Figmaインスタンスを追加・削除する必要がある場合は、必要な変更を行ってから、Pitchdeckプラグインのツールバーにある**Refresh**アイコンボタンをクリックします。

## スライドを自動スクロールで表示する {#auto-scrolling-slides-into-view}

[Video](/assets/videos/pitchdeck/design/selecting-slides.mp4)

編集するスライドを切り替えやすいように、Figmaページで対応するレイヤー（または子レイヤー）をクリックすると、Pitchdeckはプレビューウィンドウでそのスライドまで自動的にスクロールします。

逆方向にも動作します。プレビューウィンドウでスライドのタイトルの横にある**frame**、**component**、**instance**のアイコンボタン（スライドのレイヤーの種類によって異なります）をクリックすると、Figmaページで対応するFigmaフレーム、Figmaコンポーネント、Figmaインスタンスまで自動的にスクロール・ズームして表示されます。

## プラグインウィンドウのサイズを変更する {#resizing-the-plugin-window}

[Video](/assets/videos/pitchdeck/overview/resize-plugin-window.mp4)

大きめ（または小さめ）のモニターを使っている場合は、画面のサイズに合わせてプラグインウィンドウのサイズを変更し、操作しやすく、タイムラインを見やすくできます。プラグインのメインヘッダーメニューにあるサイズのドロップダウンをクリックすると、小さいサイズから大きいサイズ（4K）までウィンドウのサイズを変更できます。

## 複数のスライドを整理する {#organize-several-slides}

**Slides**の横にあるアイコンで、名前でスライドを検索したり、セクションを追加したり、リスト表示とグリッド表示を切り替えたりできます。資料にセクションがあると、スライドの上にフィルターが表示されます。**Command/Ctrl**キーを押しながらサムネイルをクリックすると複数のスライドを選択でき、**Shift**キーを押しながらクリックすると範囲を選択できます。この選択は、スライドをプレゼンテーションに含めるかどうかとは別のものです。

スライドを選択すると、リストの下にあるアクションで、スライドを**Duplicate**したり、1枚のスライドを**Rename**したり、選択範囲を**Export**したりできます。**More actions**（**…**）では、含める・除外する、**Move to section**、**Move before**も使えます。選択範囲をエクスポートすると、その一時的な一部のスライドを対象にエクスポートパネルが開き、資料に含めているスライドは変更されません。

選択したスライドをドラッグして並べ替えるか、**Move before**を使います。ドラッグする前に、検索とセクションのフィルターを解除してください。Figma Slidesでは、並べ替えはスライドのグリッドに従い、含める・除外するはFigmaのスライドのスキップ状態に対応します。

**Add a section**アイコンでセクションに名前を付け、選択したスライドをそのセクションに割り当てます。セクションは資料の整理やフィルターに役立ちますが、スライドのアートワークは変わりません。

## レイアウトを選ぶ {#choose-a-layout}

スライドリストの下にある**Add Slides/Charts**を選びます。名前付きのレイアウトを検索するか、カテゴリで絞り込んで、出発点となるレイアウトを見つけます。マスタースライドの一覧も検索できます。Theme stylesのビューには、ファイルで使えるスタイルが表示されます。スタイルの適用はFigmaで行ってください。

## 品質チェック・検索・復元 {#check-quality-search-and-recovery}

**Tools** > **Check presentation**を選ぶと、選んだ出力先に合わせて、不足しているフォント、小さいテキストや切れたテキスト、判明している単色背景のコントラスト、スライドの外にあるコンテンツ、画像の説明、読み上げ順序、アセットのサイズ、モーションの互換性を確認できます。検出結果は種類ごとにまとめられ、エラーが先頭に表示されます。検出結果の**Select object**を選ぶと、その場所を確認できます。**Check web links online**は、認証情報なしで、リンク先のサイトにブラウザからHEADリクエストを送信します。CORS、認証、HEADへの対応状況によっては、リンクが有効かどうかを判定できない場合があります。そのようなリンクは手動で開いて確認してください。

**Compare exported appearance**では、元のスライドに、出力先のツールでレンダリングしたPNG、JPEG、WebPを重ねて表示します。ピクセル単位の比較はレビューの補助です。違いはフォントのレンダリング、圧縮、位置合わせによって生じることもあります。

**Tools** > **Commands & search**（**Command/Ctrl+K**）では、スライド名、ノート、オブジェクト名、元のテキストを検索でき、Pitchdeckのすべてのツールを開けます。スライドの数が多い場合は、リストが仮想化されます。メタデータの保存が中断された場合は、**Review recovered edits**でローカルのチェックポイントを確認できます。復元では、以前の値と一致したままのフィールドが元に戻り、競合する新しい編集は保持されます。Figmaのバージョン履歴の代わりになるものではなく、元のデザインへの編集を取り消すこともありません。

## 保存した聴衆別のショー {#saved-audience-shows}

**Commands & search**から**Saved audience shows**を開きます。ショーに名前を付けてスライドを追加し、矢印ボタンで発表順を並べます。スライドごとに所要時間を設定でき、鉛筆ボタンを使うと、このショーに限ってそのスライドの話す内容のメモを上書きできます。**Active show**でショーを選ぶと、Present、Share、Exportでそのバージョンが使われます。元のスライドの含める設定、順序、ノートはそのまま残ります。選択したスライドだけを一度だけエクスポートする場合は、そちらが優先されます。

元のバージョンに戻すには**Full deck**を使います。元のスライドが見つからない場合は、ショーを発表する前に確認する必要があります。PresenterとLocal HTMLでは、自動でスライドを進める**Use show timings**を使えます。MP4では保存した表示時間が使われ、ビルドやナレーションに時間がかかる場合は延長されます。PowerPointでは、対応するネイティブのタイミング設定で、スライドの自動切り替えのタイミングが引き継がれます。保存できるショーは最大50件で、プレゼンテーション設定全体の容量は90 KBです。

アクティブなショーを変更しても、自動ではアップロードされません。現在のリンクに別の聴衆向けバージョンが含まれている場合は、**Tools** > **Share…** で更新するよう求められます。更新すると、そのページの既存のURLが使われ、アップロード済みの内容が置き換えられます。別々のURLが必要な場合は、[ページ・ファイルを分けるワークフロー](/ja/pitchdeck/web/multiple-presentation-urls)を使ってください。