リモートでデザインプロセスまわってます。

どうも、ファームノート の菅原です。
本日はFigma Advent Calendea 2018 3日担当として、滑り込みアウトでお送りします。

事業戦略やマーケとか開発とかその辺の塩梅見ながら、どんな感じに顧客の動機にプロダクトを差し込んで行くかなー見たい感じでデザインしてます。
自分一人で形を決めてるわけではないので、目線合わせしていかないでものを作ってしまうと、売り方と実態が噛み合わないなんとも奇妙なキメラが生まれてしまうと言うことが発生してしてしまって、顧客はなんとも微妙と言う気分になってしまったりしますよね。
なので、みんなが同じ目標に向かって進めると言うのは大事な事になります。

ただ、問題もありまして、認識合わせのミーティングばっかりやってると肝心の作業時間が取れずアイディアの練りこみが全然足らんとかそんなんが発生してしまうわけです。
これは美味しくない。

と言う訳でやっとFigmaの出番がやってきます。

ファームノートでは現在、執行役員1名からエンジニアまで総勢17人分くらいのアカウントがあり、最近は営業もFigmaを使い始めています。

使い方として下記のような感じ

役員

資料を都合がいいといってやたら情報量が詰まったデカイ図を作たりしてます。

UXデザイナー

・カスタマージャーニーマップ・ストーリー・プロダクト戦略などプロダクトに必要な前提情報を1ページに大量に作成
・リモートでワークショップ形式で付箋を全員で作って配置しまくるなどブレインストーミング
・細かい白いのが付箋です

UIデザイナー

基本はSketchと同じようにデザインワークを行う。
Teamライブラリを作成し、組織全体で使えるコンポーネントの運用
人によってはプロトタイプをFigmaでやるケースもあります。
PMが文言調整したりラフを作って見たりとか、エンジニアが実装に合わせて修正してくれたりする事もあります。
たまにデザインレビューでコメントするのが面倒になって直接直したりとかもしたりします。

フロントエンド・アプリエンジニア

UIデザインのコンポーネント粒度を見ながら、同じ粒度になるように実装だったり、FramerXでプロトタイプ作ってます。

解決した事

・認識合わせの際に見るべき資料を減らした。
・デザイン段階でフロントエンドの設計も同時に行う事でコミュニケーションコストを削減
・デザイナー以外が自分にもできるんじゃないかと思ってくれるくらいにデザインが組織に溶け込んできた。(営業がDailyUIを始めちゃうレベル)

まとめ

みんな1箇所見ればとりあえずわかるので楽です。
後、Figmaの隠れた凄みとして大量に要素おいても落ちません。
ちょっと遅くなった後はそれ以上遅くならないと言うすごく粘り強いツールで、他にこのレベルで要素を並べられるツールは20年間触ったことがありません。

Figmaはデザインツールなのは当然ですが、みんなでDesignすると言う行為を後押しする使い方で真価を発揮します。

ファームノートでインタラクションデザイナーやってます。 最近はFigmaとFlutterでアプリを作っています。