未分類

UIデザインにFigmaを導入するメリット

投稿日:

UI Figma デザイン メリット

UIデザインツールとしてSketchが登場した時は、かなりの衝撃を受けましたが、Sketchを使いはじめて2年ほどで、またさらに進化したツールFigmaが登場!

時代の流れの早さに、ロボットの時代がやってくる現実と焦りを感じました。

と、焦りを感じつつも、Figmaのおかげで、つまらない作業から解放され、よりデザインに集中できるようになったのはまぎれもない事実。

昨年の秋頃からFigmaを使い始めて1年ほど経ちましたので、このFigmaツールを使うメリットをご紹介したいと思います。主に、Sketchと比較してのメリットになります。

UIデザインにFigmaを使用するメリット

共同編集ができる

この、「共同編集ができる」ということがFigma最大のメリット!

複数人でプロジェクトを進めている場合は、プロジェクトの進行がかなりスピードアップしますし、無駄でつまらない作業がなくなりストレスも減ります。

共同編集とは、デザイナーが編集している画面を、リアルタイムで閲覧でき、編集もできるということ。

デザインに迷って、消しては作ってを繰り返しているのも、メンバー全員に丸見えになりますw 最初はちょと恥ずかしいな、とか、集中して考えられない とか思いましたが、慣れてくるとメリットの方が大きく、恥ずかしさはどこかへ飛んでしまいました。

共通で使うボタンなどのパーツや、フォントサイズやカラーなどのスタイルルールも設定して共有でき、複数人でのデザイン制作をしやすくなりました。

他の人が制作しているデザインをチラチラ見ることができるので、噛み合ってないかどうかを早めに確認できるのもメリット。

Windows,Macどちらでも利用できる

SketchはMacでしか利用できませんでしたが、FigmaはWin,Macどちらでも利用できます。

なので、メンバーが新たにMacを購入しなければならないという大きな壁もありません。

リアルタイムでスマホプレビューが見れる

スマホ用のデザインをするとき、PCでデザインしながら、リアルタイムでスマホに映し出すことができます。この機能のおかげで、かなりデザインスピードが上がりました!

デザイン確認からFIXまでのやりとりが楽

デザインが出来上がり確認をしてもらう時は、Figmaの画面URLを連絡すればいいだけ!

Figmaが登場するまでは、出来上がったデザインをjpegなどに書き出しして、共有フォルダへアップしたりメールで送信したりしていましたが、そのような手間は一切不要です。

デザイン確認者(ディレクター)は、修正依頼をしたい場合は、Figmaの画面上の修正して欲しい箇所にコメントを追記できます。このコメントも、メンバー全員に瞬時に共有されます。

Figma登場前は、デザイナーから受け取ったデザインを、パワポやエクセルなどに貼り付けて、修正箇所を記載し、そのファイルをメールで送信 と、面倒な作業がありましたので、かなり楽になりました!

最新版の管理が楽

ファイルのやりとりがないので、最新版はどれ? と迷子や行き違いになることがありません。

エンジニアへの共有も楽に

デザインが完成した後、実装してもらうエンジニアへのデザイン共有も、FigmaのURLを送るだけ!

これまでは、最新デザインファイルと書き出しした仕様書を送っていましたが、その手間はなくなりました。

Sketchが登場し、仕様書を作らなくて良くなっただけで感激していたのですが、Figmaでは、さらに本当に何もしなくても良くなって感激すぎます。

ファイルの書き出しがないので、デザイン完成後に出てしまった修正にも対応しやすく、最新の仕様はどれ? と混乱することもなくなりました。(そもそもデザイン完成後の修正は混乱の元なので避けたいところですが・・・)

UIデザイン以外でも便利なFigma

大量のバナーを、定期的に日付などのテキストや画像の差し替えをして使いまわしている場合、

最初は普通に作成しなければなりませんが、その後のテキスト・画像の差し替え作業は、瞬時にできてしまいます。

これはSketchでも可能ですが、Figmaにしておけば、最新ファイルを探す手間がなくなり、メンバーの中で手が空いている人がやるということもできて便利です。

さっそくFigmaを使ってみよう

このFigmaツールは、ベーシックプランであれば無料で利用できます!

ブラウザベースで使えるため、自分のPCでなければ編集・閲覧ができないということもなく、とても便利!

まだFigmaを使ったことがない方は、一度触ってみることをおすすめします。

Figma公式サイトへ

-未分類

Copyright© HITON.DESIGN , 2019 All Rights Reserved Powered by STINGER.