ソリューション技術部デザイングループの池田です。
強火の犬派 兼 中火の猫派です。現在は猫を飼ってます。
みなさん、スライド資料を作成した経験はありますか？
使うツールはPowerPointですかね。
便利ですよねパワポ。
残念ながら今回はパワポの話ではないです。
弊社の採用ピッチ資料を作りたいな〜、という依頼が人事部から舞い込んできたのですが、普段使い慣れているFigmaでスライド資料作りたいな〜〜と思って作ったらFigmaで良かったなぁ〜〜！と思った話をします。
どうしてFigma？
ローカル作業だと複数人でのやりとりが億劫だった
ひとつの資料を複数人でチェックをするので、デザインのフィードバックや文言の修正・追加などのやりとりが多く発生するのは必至です。
ローカルで資料を作成していると、修正データと新規資料等が溢れかえり、どれが最新データかわかりにくい状況になります。
合わせてSlack上でもやりとりをすると、どこに知りたい情報があったか？誰かもう修正依頼をしたか？等、例え一瞬であっても確認する、思い出すといった作業が発生するので結構ストレス。
資料のやりとりもそうですが、「この資料のこの文言」と修正して欲しい部分をテキストで伝えるって結構大変です。
それが5個も10個もまとめてだったら文章考えているだけで日が暮れる。
スライドはひとつの資料に50Pくらいと聞いていたので、できれば迅速かつ正確に、そして円滑にやりとりがしたい！誰だってストレスフリーがいいでしょう！
Figmaはリアルタイムで同じ画面を閲覧・編集できる！
Figmaはリアルタイムで複数人が同じ画面を閲覧・編集することが出来ます。
一番最初の資料はパワポで貰って、Figmaで作業、出来上がったスライドからチェックして、修正依頼はFigmaのコメント機能を使って指示、ちょっとした文言なら人事側で修正…といったように、ツールをあちこち移動せずにFigmaを開いていれば済む状況でした。
コメント機能*1はキャンバス内に自由に配置することができるので、ページ番号を態々伝える必要もなく的確に指示することができます。
そう、「ここ」って言えるんです。
これで「資料A_修正依頼_20231008_3.pptx」みたいなデータが溢れかえることもない！
さらに全ページがキャンバスの上にずらっと並んでいるので、目的のページまでひたすらページを捲ることなくすぐ確認できるのも便利です。
コンポーネントで一括変更！
採用ピッチでは、同じページを別の資料でも使う事が結構ありました。
例えば会社概要や社内風景の写真、役員の写真とありますが、資料の2/3は他の資料と一緒だけど1/3だけ新規、といったような事もありました。
「コンポーネント」*2
これさえあれば同じページが10枚あったとしてもメインコンポーネントを編集すれば終わりです。
写真もアイコンもテーブルのセル、使い回ししそうだなと少しでも思ったものはコンポーネント化をすることで後々の自分を助ける事になります。
実際にコンポーネントの使い方を人事にレクチャーしたら、新しい資料にも使う既存のものはコンポーネント化して再利用していました。助かる。
資料のアップデート・扱い方
デザイナーじゃなくても修正可能
「資料が完成した後も、テキストの修正をする場合があるので更新できる状態がいい」
というのが、人事からキックオフ時に相談されていました。
Figmaは編集権限さえあれば、ちょっとした文言修正ならデザイナーでなくても修正が可能です。
実際にまだ文章が決まっていなかったスライドに、ダミーテキストをとりあえず置いておいたら、fixした文章を人事がさらっと入れておいてくれました。助かる。
今後資料を大きくアップデートをする事になった時も、Figmaをマスターとしているので人事側が更新した資料をデザイナーに再度展開する必要もありません。
資料編集ルール
とはいえ、自由に触りすぎても困るので、弊社では以下のルールを設けています。
- Figmaをマスターとすること
- テキストなどの編集は以下の条件に当てはまる場合は、デザイナーに依頼する
- 採用チームに編集権限がない場合
- レイアウトの崩れが起きる場合（長文によってズレが生じる・新しいアイコン/画像が必要など）
- 新規ページはデザイナーに相談し、作成依頼を出す
- 既存ページからの複製による軽い編集などの場合は採用チームに編集権限があれば作成でも良いが、必ずデザイナーチェックを挟むこと
- 編集権限を付与するのはデザイナーがする
- 編集権限から閲覧権限への移行も同様
文言の変更は崩れなければ大丈夫、崩れたら相談してねというスタンスです。
まだデザイナー以外とFigmaの編集のしあいをした事がないので、気になったことがあれば都度ルールは変わっていくと思いますが。
さいごに
今回はFigmaを使ってスライド資料を作ったらこんな良いことあった〜〜と思ったことをお話ししました。
作成・チェックが一番多いスタート時はもちろん、今後の資料の在り方を考えると、圧倒的にストレスフリーでやりとり・作業が出来るやり方だったかと思います。
パワポよりもFigmaの方が圧倒的に使い慣れているツールなので、私がやりやすいのは当たり前です。
触ったことがない人でもストレスなく出来るやり方、どこまでを許容するかの範囲の設定を考えることができたのはとても良い機会でした。
Figmaは直感的にわかりやすいUIなので、非デザイナーでも触りやすいツールだと思います。
今回デザイナーが資料をある程度作成した後に、Figmaの簡単な使い方を人事にレクチャーしました（テキスト編集・コンポーネントについて・ルール説明）
普段使っているツールではないのと、デザイナーが使っているツールでは当たり前と思っている動作・概念はもちろん知らないので、レクチャーする時も新鮮な反応が面白かったです。
そんな人事とあれこれ作成した採用ピッチ資料は下記URLから見れますので、良ければどうぞ。
speakerdeck.com
*1:コメントを使用すれば、フィードバックへの対応、デザインの微調整、素早い発散作業のすべてを、オリジナルのデザインファイル内で実行できます。Figmaのコメントについて参照
*2:コンポーネントは複数のデザイン間で再利用できる要素です。これは、複数のプロジェクト間で一貫性のあるデザインを作成して管理する時に便利です。 Figmaのコンポーネントについてのガイド参照
