見出し画像

フルリモートでも仕事のスピードを落とさないためのFigma活用術

こんにちは。クックパッドデザイナーの新妻 里夏です。
今回はデザインツールのFigmaが、デザインの現場でこんな感じで活躍してるよ〜というお話です。

はじめに


クックパッドは3月1日から人気順の無料開放などを行い、ユーザーさんやテレビ等のメディアから沢山の反響をいただきました。これらの取り組みを「やろう!」と意思決定しリリースするまでの期間は・・・なんと2日間!

なるべく早くユーザーさんにサービスを提供したい!ということで、急遽休日作業することになった為、稼働できるメンバーも限られており、さらにクックパッドは2月下旬から全社員原則リモート勤務になっていたので、さてこの状態でどうすれば必要なデザインを最短で効率よく作ることができるか?を必死に考えた2日間でした。

デザインチームが2日間でやったことリスト

バナー8種類
プッシュ通知画像
プレスリリース用画像
OGP画像
メルマガデザインと実装
特設ページ制作
LPの修正
課金動線のクローズに伴う表示チェック
ヘルプページ用画像
などなど・・・

サービス開発の基本ですが、どんなに便利な機能を作ってもユーザーさんに気づいてもらい使ってもらわなければ意味がありません。今回はプレスリリースでのお知らせや無料開放中にユーザーさんが誤ってプレミアムサービスに入会しないための対策などもあり「とにかく細かい制作物がいっぱい!」という感じでした。

そんな中で大活躍してくれたのがFigmaです。(クックパッドでは去年からFigmaメインで開発をしています)もしFigmaがなかったら、フルリモートのこの状態で2日でリリースは無理だったと思えるくらい貢献度が高かったので、実際にどんなシーンで活躍したのかを共有しようと思います。

◎Figmaの具体的な使い方は弊社デザイナー藤井の記事がオススメ


活用ポイント①
複数メンバーで同時作業!リアルタイムデザインレビューも可能に

画像5

figmaはリアルタイムで変更が反映されるので、他のメンバーが作っているデザインをいつでも確認、レビューすることが出来ます。物理出社していた時期には、隣りに座って「あーだこーだ」いいながらペアデザインが出来たのですが、リモートワークでもfigmaとzoomがあれば問題なくペアデザインが出来ました。むしろ、簡易レビューならzoomも不要で、figma上に直接コメントを書いて事足りる場面もありました。

またアートディレクターとしては、担当デザイナーに「進捗どうですか?」と聞くまでもなくFigmaをみればいま何がどこまで進んでいるのか確認できるのもスピードが大事な状況にマッチしていました。デザイナー側もレビュー用にスクショを用意して・・・というような作業を省略できることで作業に集中できるメリットもありました。

活用ポイント②
エンジニアもディレクターもアクセス可能!待ち時間ゼロ

画像4

PhotoshopやIllustrator、Sketchを使っていたときは主にアプリケーションを購入しているデザイナー以外がデザインデータをひらくことが出来ませんでした。しかし、Figmaであればリンクさえ共有しておけば誰でもWEBブラウザからアクセスができるので「ちょっとここ確認したいな」と思ったらデザイナーに依頼せずに、自分でデザインデータにアクセスできたのもお互いの時短になり良かったです。ちなみにクックパッドでは入社のタイミングで非デザイナーでもFigmaの閲覧権限が付与されます。

活用ポイント③
デザインデータを一箇所にまとめて再利用&一気に展開

画像5

今回のような部署をまたいだ取り組みの場合、ニュースチームに依頼されたバナー広報チームに依頼されたOGPがほぼ同じ要素になることがあります。これらを別々に作ってしまっては時間の無駄です。Illustratorなどを使っていた頃は1つのデータを複数人で更新できないので他の人の作っているものをリアルタイムに知ることが難しく、結局それぞれの用途ごとのファイルが存在していました。結果、重複に気づくのが遅かったりデザインの再利用がしにくいなどの問題がありました。

そこで今回はFigma上に「コロナウイルス対応」というfileをつくり、そこをみれば既に作成されているデザイン制作物が一覧でまとまっている状態を作りました。(↓Pagesで制作物ごとにまとめている)

スクリーンショット 2020-05-16 17.02.37

これにより、ニュースチームからの依頼が「広報で使ったこのOGPをバナーにしたい」という分かりやすいリクエストになり、デザイナー同士でも「いまカテゴリのデザインこんな感じで作ってるから、バナーもテイスト合わせて作って〜。」というような途中段階でのデザイン共有がしやすくなりました。結果的に、複数の制作物を複数のメンバーが同時進行で展開していくことが出来ました。

さいごに

画像6

コロナウイルスの影響で思いがけず全社リモート勤務という状況になりましたが、いざやってみると大きな問題もなく、むしろ通勤がない分ストレスも少なく、子供と過ごせる時間も増え、リモート最高だな。と個人的には思っています。

はじめのうちは、進捗状況の把握が難しくなったり生産性が落ちるかもという懸念もありましたが、今回紹介したFigmaをはじめ、zoomやSlackなど世の中のツールの進化によって、オフィス出社時と変わらず仕事ができることが分かりました。

今回共有したのは超タイトスケジュールの場合の話なのですが、普段はGithubでissue管理しながらデザインの意図や経過などもしっかり記録しつつ改善を行っています。状況に応じて最善の方法を探りながら、リモートワークでも今まで以上に成果を出せるようにしたいですね(*^^*)

ところで

そんなクックパッドのサービスを一緒に作ってくれる仲間を募集中です!少しでもご興味を持っていただけましたら、ぜひ下のリンクに流入しちゃってください😉

🍳 一緒に働きたい!



👀 どんなデザインができるのか知りたい

👆noteのマガジンはほぼ毎週更新中です!さまざまな領域で活躍しているデザイナーの記事がまとまっているので、こちらもぜひ!

この記事が気に入ったらサポートをしてみませんか?