議論がスムーズに！ プロトタイピングツール「Figma」の開発フェーズ別便利機能【要件定義・画面設計編】

共同作業に最適なプロトタイピングツール「Figma」入門　第2回

　ブラウザ上で簡単に使用でき、共同作業が便利なプロトタイピングツール「Figma」。このツールは要件定義、画面設計、デザイン、開発とUI制作における4つのフェーズで活用することができます。連載の第2回と第3回では、このFigmaの機能をフェーズごとに具体的な使用例を用いて紹介します。

要件定義フェーズ

　一般的に要求のヒアリング後、WEBサイトやアプリの開発は要件定義から始まることが多いと思います。要件定義フェーズでは、顧客の要望、市場、競合、その他さまざまな情報を収集し、開発物に必要な機能や状態を協議して、ドキュメントに落とし込みます。

　株式会社ブリューアスでは、このフェーズからデザイナーが参加することも多く、要件定義フェーズに限らず議論を重ねながらリアルタイムに情報整理を行うことが必要な場合、キャンバスが非常に広く使えて直感的に入力ができるのでFigmaを活用することで効率的に情報を整理することができます。

自由に使えるキャンバス

　Figmaのキャンバスは1辺が100,000pxを超える大きさなので、範囲を気にせずにさまざまな情報を並べることができます。

キャンバスの大きさ

　例えば、顧客から提供された資料などを画像化して読み込み、俯瞰的に資料を閲覧しながら議論するなどオンラインホワイトボードのような使い方もできます。その資料へ情報を書き込む、ラフ案を添える、不要な情報を削除するなど、情報をより効果的に整理することで議論の活性化に繋がります。

資料画像や指示の整理

リアルタイム性を活かした共同作業

　リモートワークが推奨され確認するディスプレイの解像度がバラバラなことが多い昨今、キャンバスが大きいと他のユーザーが作業や説明をしている位置が把握しにくいのではないかと懸念する方もいるかもしれません。Figmaでは、他のユーザーの位置がリアルタイムで追えるように表示され、また位置を把握したいユーザーのポインターへ自動で遷移するショートカット機能が備わっています。

他ユーザーのポインターへ遷移