メインコンテンツまでスキップ

Figma Slidesでデッキを作成

6つの長方形が横に3つずつ2行の碁盤目に並んでいるカラフルな抽象的デザイン。碁盤目には明るいオレンジの縁取りがあり、交点が黄色い点で繋ぎ合わされている。長方形のそれぞれには紫、青、緑、白、茶色などさまざまな色でそれぞれ違う形や模様が描かれていて、視覚的にダイナミックで現代的な図柄になっている。6つの長方形が横に3つずつ2行の碁盤目に並んでいるカラフルな抽象的デザイン。碁盤目には明るいオレンジの縁取りがあり、交点が黄色い点で繋ぎ合わされている。長方形のそれぞれには紫、青、緑、白、茶色などさまざまな色でそれぞれ違う形や模様が描かれていて、視覚的にダイナミックで現代的な図柄になっている。

見栄えの悪いプレゼンテーションとは、もうお別れしましょう。本日発表するのはFigma Slidesのオープンベータ版で、視覚的にストーリーを伝える方法として全く新しい標準となるものです。

Figma Slidesでデッキを作成を共有

Vismeのブログ記事によると:

  • 45%の発表者が、プレゼンテーションをクリエイティブなレイアウトにするのが難しいと感じている。
  • 41%の発表者が、良いビジュアル要素を探してプレゼンテーションに使うのが大変だと感じている。
  • 47%の発表者が、プレゼンテーションのデザインに8時間以上をかけている。

Figma Slidesはベータ版で、6月26日(PDT)に順次ユーザーに提供されます。

私たちの調査によると、Figmaユーザーは昨年だけでも約350万本ものプレゼンテーションを作成しています。この数字の理由は、Figmaが他のスライド製品にはない、高品質なデザインのパワーを提供していることにあります。とはいえ、実際にプレゼンをする場になれば、デザイナーはデザイナー以外の人たちに対応するために、プレゼンテーションを他のツールに移動することから、事前資料を配り、さらにはプロトタイプに押し込むことまで、離れ業をやってのけなければならないのです。

現在はオープンベータ版のFigma Slidesを構築したのはこれが理由でした。最初は社内のハッカソンで断片的なプロジェクトとして始まり、現在はFigmaの視覚的な忠実度とFigJamの対話的なフィードバック機構を統合したパワフルなツールに育ちました。Figma Slidesは、プロのデザイナーもデザイン部門以外のコラボレーターも、誰もが参加できるツールです。経営層が新機能にゴーサインを出すための製品レビューであっても、クライアントを説得するためのセールス用デッキであっても、投資家に向けて投資を募るためのピッチデッキであっても、Figma Slidesを使えば誰もが参加できる形でストーリーを作り上げることができます。

忠実度が高いデザインツールというFigmaの思想を継承

Figmaのピクセルレベルの操作やお好みのツールの使いやすさとの引き換えで、デザイナーはこれまで、発表者ノートやスライドの画面切り替えといった基本的なスライド機能がない中でやってきました。Figma Slidesはそういったコア機能をカバーするだけでなくデザイン機能も拡張しているので、デザイナーとデザイナー以外のメンバーの両方が簡単に同じ空間で共同制作できます。

抽象的な図柄のカラフルな背景がついたプレゼンテーション用のスライド。Malala Yousafzaiの言葉「We cannot all succeed when half of us are held back」の引用とともに、STEM教育へのアクセスを提供するという組織ミッションについてのテキスト。抽象的な図柄のカラフルな背景がついたプレゼンテーション用のスライド。Malala Yousafzaiの言葉「We cannot all succeed when half of us are held back」の引用とともに、STEM教育へのアクセスを提供するという組織ミッションについてのテキスト。
発表者ノートを使うことで「えーと」をなくして、まるでプロのようなプレゼンができます。

デザインモードをオンに

このTechSmithの調査によれば、コミュニケーションで画像を使用している回答者の97%が、ビジュアルでメッセージがより効果的になると回答しており、64%がエンゲージメントと関心を高めることができていると回答しています。

基本のツールバーにも、テキストや画像、図形を挿入してスライドを作成するために必要なものはすべて揃っていますが、デザインモードをオンにするとFigmaのフル機能が自由に使用できるようになります。オートレイアウトから高度なプロパティまで、Figmaデザインで利用可能な機能がすべてFigma Slidesでも使えます。

デザインモードをオンにして、Figmaデザインのフル機能にアクセスします。

「たとえばオブジェクトの配置時に自動整列される機能など、UIのデザインのために最適化された機能はどれも、使用性の大幅な改善につながりました」と同僚のプロダクトデザイナーのKeeyen Yeoは言っています。「たとえば、インタラクティブな部品をホバー状態でペーストすると、プレゼン時に動作します」

すぐに使えるライブラリとアセット

当社のプラットフォームのデザイナーは何年にもわたって、Figma上でテキストのスタイル、色のスタイル、アセットなどを磨き上げてきました。嬉しいことに、同じリソースがFigma Slidesでも1クリックだけで使えるようになります。さらに、プレゼンテーション用にUIデザインを1つずつエクスポートするという苦労をしてきた人も、これからはコピーアンドペーストのシームレスなワークフローをFigmaの製品群全体で使用できるようになります。

グリッドビューで全体像をつかむ

インパクトのあるビジュアルというのは不可欠な要素の一つにすぎません。それを説得力のあるストーリーの中に並べることも同様に不可欠な作業です。単一のスライドビューで作業するか、全体像を把握するためにグリッドビューで編集するかを選択できます。ズームアウトするとスライドのセクションがきれいに並ぶので、簡単に並べ替えてストーリーを固めることができ、また、ビュー間で行き来しても変更がすぐに反映されます。

グリッドビューで編集することで、簡単にストーリーを構築し直すことができます。

「スライドデッキの中に20枚以上もスライドがあると、ストーリーの流れを変えるのが難しくなるので、それまでに作ったものにこだわりがちです。グリッドビューなら全体像が見えるので、全体のストーリーを練り上げられます」とKeeyanは言っています。

一方向のプレゼンテーションを双方向の会話に

偶然にも、現状のプレゼンテーションの効率の悪さを明らかにしてくれたのはFigJamでした。2021に発表した後、事実上すべての会議で使っていました。チームキックオフも、バグバッシュも、経営層の製品レビューも、全体ミーティングも、Q&Aも、すべてFigJamでした。

FigJamの良いところは、普通なら1人の人が話している時間で20人が意見を出せることです。そのような場では、会話の流れを変えられるのは、一番声の大きい人でも一番偉い人でもなくなります。会話ははるかに民主的なものになるのです。会話が広がれば、意思決定までの時間も短縮されます。プレゼンテーションにも同じことが当てはまらないはずがありません。

投票と意見の一致度スケールによる文脈に沿ったフィードバック

こんなことはとてもよくある話です、とユーザーリサーチ担当の同僚、Christa Simonは言います。発表者は、「みんなうなずいているけど壁に向かって話しているよう」だと感じるか、会話や会議メモ、チャットなどのチャンネルでやってくるフィードバックに圧倒されるか、どちらかだといいます。いずれにしても、はっきりとした結論は得られません。

「まったくそう思わない」と「とてもそう思う」の間のスケールで回答するユーザーインターフェース。スケールの上にユーザーのアバターを置いて反応を示している。紫の背景で「結果 - 表示中」というラベルのボタンがスケールの下にある。「まったくそう思わない」と「とてもそう思う」の間のスケールで回答するユーザーインターフェース。スケールの上にユーザーのアバターを置いて反応を示している。紫の背景で「結果 - 表示中」というラベルのボタンがスケールの下にある。
意見が一致している人たちを一目で把握します。
「パルスチェック!」というタイトルの濃い赤のスライドで、「ローンチの準備は整いましたか?」と問う投票がある。チェックのついたユーザーのアバターで投票結果を示している。「パルスチェック!」というタイトルの濃い赤のスライドで、「ローンチの準備は整いましたか?」と問う投票がある。チェックのついたユーザーのアバターで投票結果を示している。
チームのフェイススタンプを使用した回答プロンプト。
「どちらの方向性にしますか?」に対する投票の結果を示す緑色のスライドで、80%が「方向性A」に、20%が「方向性B」に投票している。ユーザーのアバターが結果の下に表示されている。「どちらの方向性にしますか?」に対する投票の結果を示す緑色のスライドで、80%が「方向性A」に、20%が「方向性B」に投票している。ユーザーのアバターが結果の下に表示されている。
投票で意思決定を加速させます。

Figma Slidesでは、投票と意見の一致度スケールによって情報の流れが効率化されるだけでなく、フィードバックの把握と文脈に応じた理解ができるようになります。発表者は事後にさまざまなチャンネルに目を通す必要がなく、また、ミーティングに参加できなかった人にとっては、参照のための信頼できる情報源となります。たとえば、チームメンバーが顔のスタンプで賛成を表明したり、非同期のレビューでスライドを見たということを簡単に知らせたりできます。また、エンゲージメントの促進、パルスチェック、決定事項の比較検討を行う機能などによって、議論を前に進めることができます。

見る人を惹きつけるプロトタイプの組み込みとアニメーション付き画面切り替え

1つのプロトタイプは1000の言葉に値します。以前は、チームどうしでワークフローをプログラミングしてデザインを形にする必要がありました。別のツールでコンテキストを作成し、それからFigmaデザインでプロトタイプを操作するために行列を作っていたのです。スライドにリンクをつける場合もありましたが、これはストーリーを断ち切ってしまい、見る人がスライドを飛ばしてしまうおそれがありました。それが今では、スライドデッキとデザインファイルの間で切り替える必要はなくなりました。

再生可能なプロトタイプで製品に命を吹き込みます。

さらに、スマートアニメートやプッシュ、ディゾルブなどの組み込みのスライド切り替えエフェクトを使用することで、デザイナーはスライド間のつなぎをスムーズにし、全体の流れを作ることができます。

スライドの切り替えエフェクトでシームレスなストーリーが生まれます。

シームレスな共同発表

「次お願いします。次お願いします。」という繰り返しを聞いたことがあるはずです。複数のチームメンバーが順番に発表するときによく起こりますが、1人の人がスライドの進行を仕切るのは大変で、見栄えのいいものでもありません。Figma Slidesでは何人かの共同発表者の中で自分が発表するパートで主導権を握り、順番にバトンを渡すことができます。

全員でつくるスライドデッキ

これまでは、チームが使うスライドツールについては、デザイナー以外には使いにくいパワフルなツールキットか、高い忠実度では表現できないシンプルなインターフェースかの選択を迫られていました。どちらのニーズも正当なものです。そこで私たちは、その両方のユースケースを念頭に置いてFigma Slidesを作りました。望む結果が得られるストーリーを共創することは簡単ではありません。だからこそ、私たちはデザイナーだけでなくチーム全体が共有できるスペースを構築して、ブレインストーミング、アイデアの出し合い、効果的なプレゼンテーションの作成ができるようにしたのです。

AIによるテキストの調整

ビジュアル検索ボタンの上に矢印が置かれたインターフェースのスナップショットビジュアル検索ボタンの上に矢印が置かれたインターフェースのスナップショット

Config 2024で発表したその他のAI機能については、このレポートでご覧ください。

私たちはAIを誰にとっても使いやすいものにしたいと考えていました。そこで追加した機能は、簡単にテキストの言い換えができるものでした。コピーを短くしたり、トーンを調整したり、書いた内容を翻訳したりと、AIが、オーディエンスに合わせた完璧なメッセージを作る手助けをしてくれます。

AIを使って伝え方とトーンを調整します。

既製のテンプレートに加え自作も可能

工夫が凝らされたデッキが持つパワーは誰もが知っていますが、デザイナー以外の人たちは、デザイナーに最後の仕上げに参加してもらうように頼むことには消極的です。Christaが言うには、「彼らは、頼むのは恥ずかしいが、自分のプレゼンを洗練された最先端なものにしないといけない、と考えるようです。全体的にネガティブなもやに覆われていたのです」

基調講演からピッチデッキまで、チームは、チームのさまざまな目的に合った高品質の既存テンプレートの中から選べます。また、スライドデッキを発行して、それをコラボレーターがテンプレートとして使えるようにすることもできます。さらに、そのテンプレートが崩れることはありません。Keeyanはこう言っていました。「一般的に、デザインにあまり詳しくない人にテンプレートを渡す場合、コンテンツを追加する際にはやはり配置や間隔の調整が必要となり、彼らの負担になります。けれども、Figma Slidesのテンプレートには空間を認識するオートレイアウト機能があるので、文字を入力すると同時に周囲の要素はきれいに再配置されます」

オレンジ色の背景に大きい黒い字で「ピッチ資料」とある力強いピッチデッキのタイトルシート。デザインは左側にタブのような縁があり、ノートを模している。下にはさらにテキストがあって「- エージェンシー名 - パートナー名」とあり、右上隅には「本日の日付」と書かれている。全体的に現代的でビジネス風で、視覚的に強い印象を与えるデザインになっている。オレンジ色の背景に大きい黒い字で「ピッチ資料」とある力強いピッチデッキのタイトルシート。デザインは左側にタブのような縁があり、ノートを模している。下にはさらにテキストがあって「- エージェンシー名 - パートナー名」とあり、右上隅には「本日の日付」と書かれている。全体的に現代的でビジネス風で、視覚的に強い印象を与えるデザインになっている。
全体ミーティングのスライド。緑色と青が混じった背景の左側に縦向きに「あなたの会社名をこちらに記載」と書かれたプレゼンテーションスライド。右側には紫の箱があり、タイトルは「オールハンズ 0.0.24」、「あなたの会社の会議の名前.」となっている。全体ミーティングのスライド。緑色と青が混じった背景の左側に縦向きに「あなたの会社名をこちらに記載」と書かれたプレゼンテーションスライド。右側には紫の箱があり、タイトルは「オールハンズ 0.0.24」、「あなたの会社の会議の名前.」となっている。
デザインポートフォリオのタイトルシート。緑と白の横ストライプがあるシンプルなカタログの表紙のデザイン。緑色の「姓名」のテキストが目立つ形で表示されていて、小さい緑のテキストで連絡先と「デザインポートフォリオ」というラベルが中央にある。デザインポートフォリオのタイトルシート。緑と白の横ストライプがあるシンプルなカタログの表紙のデザイン。緑色の「姓名」のテキストが目立つ形で表示されていて、小さい緑のテキストで連絡先と「デザインポートフォリオ」というラベルが中央にある。
https://fig.px4.zidev.ir/community/file/1382860609183042144/design-portfolio
スライドデッキのタイトル。黄緑色のヘッダーに大きな黒い文字で「資料タイトル」と書かれている。下には岩山の画像があり、右のピンクのセクションにプレースホルダーのテキストがある。スライドデッキのタイトル。黄緑色のヘッダーに大きな黒い文字で「資料タイトル」と書かれている。下には岩山の画像があり、右のピンクのセクションにプレースホルダーのテキストがある。
マーケティング戦略のタイトル。灰色がかった茶色の背景の簡潔なスタイルのスライド。大きな薄緑色の文字で「マーケティング戦略 QX 20XX」というテキストがあり、左下には「会社名」と「本日の日付」という小さめのテキストがある。マーケティング戦略のタイトル。灰色がかった茶色の背景の簡潔なスタイルのスライド。大きな薄緑色の文字で「マーケティング戦略 QX 20XX」というテキストがあり、左下には「会社名」と「本日の日付」という小さめのテキストがある。
スライドデッキのタイトル。黄緑色のヘッダーに大きな黒い文字で「資料タイトル」と表示されている。下には岩山の画像があり、右のピンクのセクションにプレースホルダーのテキストがある。スライドデッキのタイトル。黄緑色のヘッダーに大きな黒い文字で「資料タイトル」と表示されている。下には岩山の画像があり、右のピンクのセクションにプレースホルダーのテキストがある。

用途に合わせてスライドを組み合わせる

デザイナーが見事なスライドデッキでプレゼンするのを見て、「あのスタイルを使いたい」と思ったことがあるかもしれません。実は、それが可能になりました。Christaによれば、「皆、他の人のプレゼンテーションの一部分を寄せ集めてつなぎ合わせているのです。あのスライドのトップバナーと、あのスライドの素晴らしいグラフと、といったように思い出して使っているのです」。Figma Slidesなら、さまざまなテンプレートから個別にスライドを抜き出し、それからスライドデッキ全体に統一テーマを適用して、まとまりをもたせることができます。

いますぐFigma Slidesを使ってみましょう

結局のところ、やはりコラボレーションとストーリーテリングが作業を前に進めるうえで最も重要な要素になります。私たちはFigma Slidesを、共有スペースで構築していく際に生じる重大な隔たりを埋めるものと認識しています。Keeyanが言うように、「これまでずっとデザイナーがFigmaでスライドデッキを作って得てきた喜びを、誰もが味わえるようになるのです」

Figma Slidesは無料ベータ版です。2025年初頭には、無料プランと有料プランで利用可能となり、ユーザーごとに月額3ドルと5ドルからとなる予定です。チュートリアルヘルプセンターで詳細をご確認いただき、さっそくFigmaコミュニティが作成した厳選されたコレクションを試してみてください

Figmaを使った制作とコラボレーション

無料で始める