UI3 Figma Slidesの使い方やテンプレートの基本。シンプル版。 / いがわ

.

Memo

Figma Slidesの使い方。スライドの例。

Figma Slidesとは?

Figma Slides。スライドがテンプレートから作れる。

Figma Slidesの使い方について。

Figma Slidesは現在ベータ版として用意されており、アカウントがあれば2025年初頭まで無料で使用が可能。

使い方はシンプルで直感的。

使い方は簡単で、テンプレートなのですぐに慣れる。

スライド画面のサイズはモニター用に指定されている。

スライドの画面となる縦と横のサイズも、パソコンやテレビに多い「16:9」の比率になっているので、作成後はそのままモニターへ映せる。

Figma Slidesの料金について。

一般提供後の料金は、プランに応じてユーザー1人あたり月額3ドルまたは5ドルからとのこと。

無料プランも継続される模様。

2024.08.01時点。ドルは米ドル。)

参照元:Config 2024: 管理者向けガイド – Figma Learn – ヘルプセンター


Figma Slidesの使い方。

Figma Slidesの使い方の例。

「新規作成」 > 「スライド」へ。

デザインファイルやFigJam同様、Figmaの画面右上の、新規作成から進む。

Figmaのスライドの画面。

「新規作成」をクリックするとプルダウンメニューが開くので、その中から「スライド」を選択する。

Figmaのスライドの画面。

「始める」をクリック。

「始める」のボタンをクリックすると、Figma Slidesとして用意されているテンプレートの選択画面になる。

Figmaのスライドの画面。

スライドのテンプレートを選択。

テンプレートの一覧が表示されるので、好みのデザインや使い勝手を考慮して選ぶ。

今回はダークモード用のテンプレート「Dark slides」を選択。

Figmaのスライドの画面。

テキストを変えていく。

選んだスライドのテンプレートが、Figmaのメイン画面へ配置される。

テキストをクリックすると、編集できるようになる。

フォントの種類や太さ、大きさ、ボーダーなどの装飾は、画面右側のサイドバーから指定できる。

クリックの仕方でパネルの内容が変わる。例えばフォントの種類や太さを変えたい場合は、テキストをダブルクリックする。

Figmaのスライドの画面

今回は仮に、「Slide Deck Title」をカタカナ表記にした「スライドダークタイトル」へ。

実際に使用するときは、何のスライドなのか、見る人たちにわかりやすいタイトルの方が良い。

Figmaの画面の下の方に入力欄があり、ここへスライド使用時用のメモを書いておける。スライドの画面ではないので、モニターに映る心配はない。

Figmaのス
ライドの画面

左側のサイドバーから、「新しいスライド」をクリック。

左側のサイドバーから、「新しいスライド」 > 「Dark slides」の中から、1枚1枚のスライド用テンプレートを追加していく。

Figmaのスライドの画面

テンプレートを追加、編集していく。

スライドに必要な枚数分だけ追加し、そして編集していく。デザイナーが作ったテンプレートの編集なので、とても簡単に作成できる。

Figmaのス
ライドの画面

Figmaの画面右上の「▷」 > 「プレゼンテーション」 or 「プレゼンテーション + メモ」へ。

テンプレートの追加と編集がひと通り完了したら、Figmaの画面右上にある「▷」を押す。(共有の左側のボタン。)

「プレゼンテーション」と「プレゼンテーション + メモ」にわかれているので、使用目的に合わせてどちらかを選択する。

Figmaのスライドの画面

もし下記のメッセージが表示された場合は、「もう一度試す」をクリックすると、次の画面に進める。

ポップアップをブロックするブラウザ拡張機能の影響があるかもしれません。)

Figma UI3からスライドの画面

下記のように、Figmaを開いていた画面とは別のウィンドウで立ち上がる。

MacのChromeの場合。)

Figmaのスライドの画面

スライドの見せ方。

「プレゼンテーション」を選択した場合、新しくウィンドウが立ち上がる。その画面の下部に「戻る」と「進む」のボタンがあるので、用途に合わせて進んだり戻ったりできる。

ウィンドウの画面右下には「再起動」のボタンがあるが、これはFigmaやブラウザ、パソコンの再起動ではなく、スライドの最初に戻るためのもの。

また、キーボードの矢印キーでも、進んだり戻ったりができる。右矢印で進み、左矢印で戻る。

Figma Slidesのプランと料金。

Figma Slidesベータ版では無料。正式版ではプランごとに。

Figma Slidesはベータ版のうちは無料で利用できるが、2025年初頭予定の正式版がリリースされた後は有料となる場合がある。

スタータープランでは無料で提供されるが、機能の制限や使えるテンプレートの数、使用目的などによって変動があると思われる。

参照元:Config 2024: 管理者向けガイド – Figma Learn – ヘルプセンター

Figmaのスライドの使い方。Figma Slides?

以上、参考になれば幸いです。


Webデザインは実務数年、職業訓練校講師数年、フリーランス数年、計15年以上のキャリアがありますが、一気にがぁっと書いているので「です・ます調」ではありません。(元々はメモ書きでした。) 事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。 写真は主にUnsplashPixabayのフリー素材を利用させていただいております。その他の写真や動画もフリー素材やパブリックドメイン、もしくは自前のものを使用しております。

井川 宜久 / Norihisa Igawa
デザイナー、ディレクター、講師、コーチ / 井川宜久

Figma 関連メモ。

デザインツールFigmaのロゴ。

使い方 & プラグインなど。


免責事項について

  • 記事ページ(Memosのページ)は当初は文字通りメモ書きでした。その後、修正や更新をしております。
  • 事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ早急に対応いたします。
  • 一個人のポートフォリオサイトですので、万一損害・トラブル等が発生した場合でも、一切の責任を負いかねます。