SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

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

「Figma」とは? テレワーク時代に効率的に共同作業ができる注目プロトタイピングツールの魅力を解説

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


  • X ポスト
  • このエントリーをはてなブックマークに追加

他デザインツールとの比較

 ブリューアスではFigmaの他にプロトタイピング(デザイン)ツールとしてSketchやXDを利用したことがあるため、いくつかの観点から3つのツールを比較してみました。

共同編集

 共同編集はXDでも可能ですが、環境やファイルサイズによってはタイムラグが大きくコンフリクトが頻繁に起きたことがあります。それからヒストリー機能はないためバージョンごとにファイル管理と共有が必要です。それに比べFigmaは、ファイルサイズに左右されにくくリアルタイムに編集内容が反映されます。またアプリケーションを必要としない分、開発メンバーやクライアントにデザイン制作過程を見せることも簡単にできます。

共有機能

 Figmaはデザイナー間での共有にも優れていますが、非デザイナーへの共有が圧倒的に楽です。特に好評だったのが、画面(フレーム)ごとにパラメータが振られており画面単位でURLを共有できることと、Viewerでも画面やパーツごとに画像をエクスポートできることです。画像出力はPNG、JPEG、SVG、PDFの4つの形式と倍率を選択することができます。また、任意の箇所にコメントを付けられる機能もあるため、デザインに関するやりとりをFigma上で完結させることもできます。

透明性

 SketchやXDのデザイン共有は、ツールの連携が必要なことから完成したデータの共有になることがほとんどですが、Figmaであれば基本ひとつのURL共有だけで済むのでワイヤーフレーム作成時などの早い段階からの共有がしやすいです。そのため、誰がいつどこで作業をしているのかがわかり、ブラックボックス化しやすいデザイン過程が可視化されます。また、デザイナーが編集したデータをそのまま見れるため、齟齬が起こりにくいです。

コンポーネント管理

 近年のアップデートによりSketch、XD、Figmaそれぞれ便利機能が増えているので甲乙つけがたくなってきているのですが、コンポーネントの差し替えなど細かいところのUXはSketchが使いやすい印象です。ただ、Figmaは別ファイルのコンポーネントやデザインスタイルを引用してこれるライブラリという機能があるため、複数ファイルで同一コンポーネントを利用する場合はFigmaが使いやすいです。それとFigmaであればViewerも各画面のインスタンスからコンポーネントへのアクセスが簡単に行えます。

履歴管理

 SketchやXDと連携させて利用するZeplinでは画面ごとに履歴を確認することができますが、Figmaはファイル単位でしか確認できないため、細かい修正などはコメントなどで補う必要があります。プラグインを利用すればFigmaからZeplinにデータを書き出すことが可能です。

おわりに

 ブリューアスでFigmaを本格的に利用するようになってからまだ1年も経っていないのですが、他のツールには戻れないほどFigmaにはたくさんの魅力があります。特に大人数が関わるプロジェクトでは作業効率がぐんと上がったのを実感しています。

 もちろん、日本語フォントの調節が上手くいかなかったり、パソコンのスペックや回線の状況によっては動作が重くなることがあったりと、気になる点もいくつかあります。他の競合ツールも日々アップデートが行われているため、今後の使いやすさはどうなっていくかわからない部分もあります。

 しかし、他のツールに劣る箇所は管理方法やプラグインの利用で補えるものが多く、頻度の高いアップデートによる機能の追加で解消される可能性も大きいです。同じようなツールを使った経験があれば、新規ツール導入による学習コストもそれほど高くありませんので、ぜひ一度利用してみてください。

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
共同作業に最適なプロトタイピングツール「Figma」入門連載記事一覧

もっと読む

この記事の著者

株式会社ブリューアス UIデザインTEAM(カブシキガイシャブリューアス UIデザインTEAM)

株式会社ブリューアス  スマホアプリ開発を中心にUIUXデザインからWeb制作まで、多様な技術力と実績を持つ開発会社です。BtoBからBtoCまで幅広い領域での制作・開発経験があります。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/14661 2021/11/19 21:12

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング