Figma活用

FigmaでUI参考を集めながら設計する方法

UIリサーチで集めた参考画面は、実際の設計作業に近い場所へ置けるほど活用しやすくなります。SnapUIのFigmaプラグインを使うと、ブラウザとFigmaを行き来せず、参考UIを見ながらワイヤーフレームやデザインレビューを進められます。

要点

SnapUIはFigmaとFigJamのプラグインとしても利用できます。国内アプリのUIをFigma内で検索し、参考画面をキャンバスに配置して、リサーチ、比較、ワイヤーフレーム作成を同じ作業環境で進められます。

Step 1

FigmaまたはFigJamでプラグインを起動し、探したいアプリやUIパターンを検索します。

Step 2

見比べたい画面をキャンバスへ置き、構成や文言、画面遷移をデザイン作業の近くで確認します。

Step 3

参考UIの共通点と差分を整理し、ワイヤーフレーム、UI案、レビュー資料に反映します。

はい。Figma Communityから無料で入手できます。FigmaとFigJamの両方で、国内アプリの実画面を検索してキャンバスに配置できます。

参考画面、ワイヤーフレーム、コメント、比較メモを同じキャンバス上に置けるため、リサーチ結果を設計やレビューに使いやすくなります。

登録前でも実画面の一部を確認できます。