導入してチームの生産性が上がった話です。デザインドリブンで、プロセスを可視化しながら進める僕の開発スタイルと相性が良いので、最近はクライアントワークでも啓蒙しています。Figmaは平たく言うとデザインコラボレーションツールですが、こちらのリンクから動画をみると雰囲気が伝わると思います。https://www.figma.com/UIデザインツールのリッチ化ではなく、開発チームとコミュニケーションのしやすさが強みで、1人でUIを作るならSketchの方が使いやすいかもしれません。エンジニアやプロダクトマネージャーとガンガン議論して仕様を詰めていくスタイルを好む人はFigmaと相性良いです。デザインプロセスが可視化されるためプロダクトマネージャー、エンジニア視点でも有用なツールだと思います。従来デザインはローカルファイルで作業するものでしたが、クラウド化によってデザインはみんなのモノであるを実現したのがFigmaです。図左のようにビジネス、エンジニア、デザインはそれぞれ独立しているのではなく、デザインアウトプットはビジネスとエンジニアリングに直結するので、図右のようにデザインがその2つに食い込んでアウトプットされるイメージです。そのため巻き込んで会話する必要があります。Figma.と記載してありますが、ブラウザかつコラボレートが他のデザインツールと異なる特徴です。・デザイナー+その他職種とのコラボレーションステークホルダーやエンジニアを巻き込んでを一緒にデザインを考えていこうがFigmaが目指す本質と思います。Fintechや専門領域のSaaSなどは、その領域有識者のインプットを受けながら作る必要があるため、巻き込み力が高くないと実現可能性を考慮したデザインが作れません。・デザイナー+デザイナーのコラボレーションデザイナー同士でも「I」ではなく「We」でデザインする事でデザイナー集団の生産性をあげる取り組みが重要という話を最近よくします。デザイナーが二人以上居る環境だと、下記のように同じ画面でデザインの幅を出しができるため、パーツの貸し借りやマージがしやすいですし、アイディアの掛け算で1人だと気が付かない案がでてきて集合知のデザインが実現できます。Abstractのようにブランチを切って「I」+「I」でモジュールを組み合わせるバージョン管理ではなく、マスターを一緒に考えようという感じで「We」でデザインできるとお互いの知見をGIVE出来るようになります。Asetを共有して使い回せるように効率化の整備も始めてます。デザイン議論をオープン化しやすいFigma+Slackを組み合わせる事でオープンに議論しやすい環境が作れます。いえ、透明化はツールより作業者の意思による所が大きくて、Figmaを使ってもシェア頻度が低く、1週間後の定例でレビューして意思決定する使い方の場合は特に変化はありません。プロセスを透明化する意思を持つことが先決です。スプレッドシートをシェアする感じで「URLを知っている人なら誰でもみれる」で発行したURLを踏むとすぐに画面をみれるようになります。メンバーに展開できます。下記のURLを踏むと手軽さがわかると思います。https://www.figma.com/file/XhcOB4oE6kvvQa4ebC7rXXWr/note-%E3%82%B7%E3%82%A7%E3%82%A2%E7%94%A8Figma?node-id=0%3A1これは制作中のコーポレートサイトの一部ですが、アートボード画面がそのまま表示されるので見やすいと思います。Upすると無料ユーザーでもマージンなどが表示できるようになります。遷移が俯瞰できるのでコンテキストが伝わりやすく説明コストが減るのと、Slackを活用した非同期コミュニケーション活用でミーティング回数を減らせます。対面ミーティングは関係者を全員集めるのも苦労しますし、密室化されて非参加メンバーに背景が伝わらないので、Slackにログを残しておく意味でも下記のようなスタイルでSlackを活用した仕様の議論を実施します。キャプチャを貼り付けて返信率を上げる事も意識してます。僕が請ける仕事の多くは、ざっくりとしたビジョンや仮説をプロダクトの形に落とし込んで推進する役割なので、Figmaで目に見える形に起こして議論と意思決定を繰り返していくスタイルにはフィットします。onlyでも登録して気軽に見てもらいやすい環境を整えましょう。edit:Figma上でデザイン作業、編集できるデザイナーだけではなく、エンジニアの生産性が上がるデザイン画面をそのままシェアできるのがFigmaの強みです。開発効率の良いUIを選択するためのデザイン議論にエンジニアを巻き込みやすく、より早いタイミングで実施しやすくなりました。UIの選択はエンジニアの実装工数とリンクしているからです。Appの開発に関わりましたが、達成したいユーザー体験は同じでも、開発言語やチーム環境によって生産性が高いUIデザインを考えます。クライアントエンジニアも、ロジックを考える人、デザイン当て込みが得意な人、アニメーション実装が得意、苦手な人が居るので、チームパラメーター次第で見積もりや目指すべきUIの選択が変わってきます。Nativeで触り心地重視のリッチアニメーション前提のUIデザインだと辛いですし、Firebaseの標準機能でコスパよく実装しようと考えてた画面で多彩な機能が詰め込まれたUIが上がってきたら、それは認識がズレている状態です。デザイナー側が、リッチなアニメーションを採用したいがエンジニアリソースに余裕がない場合は、Lottieを採用してアニメーション部分はデザインタスクとして巻取る最適化の判断も会話しながら決めていきます。これらの判断をデザイナー1人で抱え込むには責任を負いすぎるので、UI判断をチームのモノにして、どこに力を入れるか、どこで手を抜くかの会話をしていきましょう。あと実はエンジニアもUIを考えたいんです。Designとの向き合い方について早めに巻き込むと喜んでくれますし、チームで戦う体制を作れるので、そのドライブ役を担えるのがデザイナーの新しい役割かもしれません。実装を考慮したデザインに関しては、過去に関連した記事も書いているので良かったら読んでください。Zeplinがfigma一つで完結するのでコスト節約ソフトウェアは一本化できる方が楽だし、節約になるし、嬉しいですよね。(※プランの違いはありますが割愛してます)複数機能が盛り込まれてるサービスは往々にして痒いところに手が届かず、特化型を使い分ける事になりがちですが、Figmaは一元管理できました。Sketch派の方へ確かにデザインツール単体でみるとSketchの方が使いやすいんですよ。その気持ち非常によくわかります、プラグインも便利ですもん。デザイナーのデザインスピードの話であって、チームの生産性観点で考えてみると資産が共有しやすいFigmaの導入も視野にいれてみると良いと思います。日本語入力周りのバグはまじなんとかしたい。日本語周りに致命的なバグがあり、テキスト入力に関してはかなりストレスが溜まります。何度か運営にメールしてますが、市場規模的に日本は優先度が低いと思われるので、現状では対応されないと思います。ツールの日本語化オーダーではなく、テキスト入力時に日本語フォントを使っても不具合が起こらないように対応してもらえるのが、せめてもの願いです。オフィスに出向いて懇願したいので、ご紹介いただけると嬉しいです!!!願いよ届け。下記は、Figmaを勉強するのに参考した記事です。相談コミュニティ作りました!!https://note.mu/hikarutayama/n/n158b083af53fまだまだ模索中なのでこういう使い方もあるよーって事例あれば、ぜひ教えてください!以上、Figmaを使って生産性が上がっているという話でした。ありがとうございました。ダウンロード#デザイン#Design#UIデザイン#プロダクトマネージャー#figmaこの記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。朋デザイン会社Basecamp⛺️の代表。dely株式会社のCXO。プロダクトマネージャーです。仕事の依頼はDMで受け付けております。Retty【デザイナー向け】Lottieの使い方。NishidaSketchからFigmaにしました43【公式】Lovegraph2017年、デザインガイドラインについて考える。