見出し画像

Figma使ってるからレビューしてみたよ📝

皆さん、こんにちは!Design Switchです。✋✋
今まで知識系の記事を投稿してきましたが、今回はFigmaのレビューをしていきたいと思います!ARCHECOでは主にFigmaを使ってUIのデザインを行っています。そのため、現場で使っている私たちだからこそのレビューをしていきたいと思います!それではFigmaについてレビューしていきます!!📝

そもそもFigmaってなにかというとUIを作ることができるプロトタイピングツールです。プロトタイピングツールはFigmaの他にもSketchAdobeXDなども有名です。デザインツールの比較などは以前の記事でも紹介しているので、よければこちらも合わせてご覧ください。😎

実際にFigmaを使ってみてわかったメリットとデメリット

実際にFigmaユーザとしてメリットとデメリットをあげてみました!
ではまずメリットからご紹介します。

◆ コンポーネントの管理が楽
最近FigmaにVariantsという新しい機能が出ました。デザインをしていく上で状態が変化するコンポーネント(例えばボタン一つにしても通常時、ホバー時、選択時、選択できない時)に遭遇するのですが、今まではこれらのコンポーネントをそれぞれ独立したコンポーネントとしてしか取り扱うことができませんでした。ですが、このVariantsという機能によってこれらのコンポーネントを一括で管理できるようになりました。そのためこれらの状態変化ごとにコンポーネント化してVariantsの設定を行うことで、必要に応じてボタン一つで状態を変えられるようになりました!画面数が多くUIの部品が多い場合はとても便利で管理しやすくなります。

画像1


◆ プラグインが豊富
Figmaは拡張機能を追加することができ、その種類がとても豊富です。例えば画像の背景を消してくれるプラグインユーザーアイコンの中に自動でフリー素材の写真を入れてくれる機能など実用的なプラグインがたくさんあり、より効率的にデザインを進めることができます。今度オススメのFigmaのプラグインツールを紹介しますね!

▼Autoflow (オブジェクトを同士を選択すると矢印を付けてくれるプラグイン、画面遷移を作成するときに便利)

▼remove.bg (画像の背景を削除できる、コンセプトUIを作成する時に便利)


◆ プレビュー時に実機に当て込んだモックアップの状態で見ることができる実際にデザインをしているとき、iPhoneやタブレットなどでどう見えるのかを確認したい時があります。そんな時にFigmaだと再生ボタン一つで確認をすることができ画面内でスクロールすることも可能です。

◆ 複数人の同時作業が可能
複数人のリアルタイム同時作業が可能です。もちろんオンライン環境でないといけません。ですがリモートワークの方にとってはskypeなどで通話しながらFigma上のUIデザインについてフィードバックやブラッシュアップの話し合いがスムーズに行えるので非常に快適です。

◆ 他の人の視点を共有できる
私が地味に助かっている機能が視点共有機能です。同じファイル上であれば、他の人のアイコンを押すとその人が今みている画面の状態で自分も見ることができます。なので誰かがFigma上で説明をしている時にいちいちその人のカーソルを追わずにすみます。

画像2

これだけメリットがあるFigmaですが、少しデメリットもあります (許容範囲ですが...)

◆ 日本語に対応していない
Figmaは残念ながら日本語に対応しておらず英語での表記のみになっています。そのため英語が苦手な方はうっ…となるかもしれません。ですが、Figmaについて解説している日本語の記事や動画はたくさんあるので分からない場合は調べてみると良いでしょう。
ただ、Figmaが日本語に対応していないのと同様にFigmaのプラグインも基本的には英語で書いてあります。なのでそんな時はGoogle翻訳に頼るしかないですね。。

◆ 文字の縦書きはできない
日本語ならではの問題にはなるのですが、文字は横向きにしか書くことができず縦に書いていくことはできません。なので縦書きを使用するデザインテイストを多く使用するのであればFigmaは向いていないでしょう。


最後に

🔳  Figmaとは?
UIを作ることができるプロトタイピングツールです。
🔳  Figmaのメリットデメリット
◆ メリット
・コンポーネント管理が楽
・プラグインが豊富
・プレビュー時に実機に当て込んだモックアップの状態で見ることができる
・複数人の同時作業が可能
◆ デメリット
・日本語に対応してない
・文字の縦書きはできない

皆さんいかがでしたか? リモートワーク環境下だとメンバー同士のコミュニケーションが大変なのですが、Figmaならデザイナーメンバー複数人で共同作業できたり共有が簡単だったりと非常にメリットの多いツールです。是非使ってみてくださいね!次回はFigmaに導入すると便利なプラグインツールについてご紹介します。✏️👀

▼ 次の記事

🌟 Design Switchを運営している UX/UIデザイン会社 ARCHECOについて


この記事が気に入ったらサポートをしてみませんか?