はじめに
この記事では下記アドベンドカレンダーに参加したので、Figmaにはじめて触れた時の経験等をまとめていこうと思います
Figmaとは？
👆上記Figma公式のページに概要はありますが、プラス情報として、Figmaはアメリカの企業が提供するデザインツールであり、2012年にアメリカのスタートアップとして設立され、ブラウザ上で動作するデザインツールとして人気を集めているモノになります。日本生まれではなかった
Figmaと類似サービスについて
Figmaというものがざっくり理解できたところで、現在は他のデザインツールも沢山あります。他のツールとFigmaの違いについて表形式で見やすくまとめたものが下記表になります。
Canvaしか知らなかったのでこんなにも類似サービスがあることに驚きました
| ツール名 | 特徴 | Figmaとの違い |
|---|---|---|
| Figma | - ブラウザ上で動作（インストール不要） - リアルタイム共同編集が可能 - 無料プランあり |
- ブラウザ主体なので環境を選ばない - 初心者でも操作が簡単 |
| Adobe XD | - Adobeが提供するUI/UXデザインツール - 強力なアニメーション機能 - Creative Cloudと連携 |
- アニメーション機能が充実 - ローカルでの作業に強い |
| Sketch | - macOS専用ツール - プラグインが豊富 - 長年の実績があり安定性が高い |
- macOS専用 - チームコラボには追加ツールが必要 |
| Canva | - 簡単なデザインを手軽に作れる - Webデザイン以外にも用途が広い - 無料プランが充実 |
- プロトタイピング機能は弱い - デザインツールとしては簡易的 |
| InVision | - プロトタイピングやデザインプレゼンに特化 - コメント機能が充実 |
- デザイン作成よりもプロトタイピングや共有向け |
| Axure RP | - 高度なプロトタイピング機能 - ロジックや動的動作の設計が得意 |
- 高機能だが初心者にはやや複雑 |
使い分けの例
簡単に始めたい → Figma、Canva
プロ仕様を求める → Adobe XD、Sketch
プロトタイピングに特化 → InVision、Axure RP
Figmaをはじめて触った時の感想
わたしがそもそもFigmaを使用するに至った経緯はプログラミングスクールの制作物作成の中で画面遷移図を作成する必要があったからです。
とりあえず、新規登録して始めよう。触りながら進めればどうにかなる。の精神で取り組みましたが、意外と時間がかかってしまいました。💦
感想としましては、記事だけでなく、YouTubeで事前にどんな機能があるのか、実際に動かしている状況を把握しておくとよりスムーズに進めることができたのではないかと感じています。
なので、これからはじめて触ってみるという方たちはぜひ、公式サイトだけでなく、動画解説付きの情報を収集してみることをお勧めします。
Figmaについておもうところ
私自身は画面遷移図でしかFigmaを使用していないのですが、かなりいろんなことができ、使いこなせれば業務時間短縮？にもつながるのではないかと思っています
実際にテンプレートのようなものを利用して始めることが可能で、種類も沢山あるのがうれしいです。
はじめこのテンプレートの存在を知らなく一から自分で作成していました😿
さいごに
- 改めてFigmaと類似サービスを調べてみると多く存在することに驚きました。
- それぞれ特徴があるので、参考書と同じように自分が見やすいもの、使いやすいものを選ぶことで最終的はすぐにモノを作成できる人になれるのかな、と思いました。
- 参考になる記事・動画等を共有させていただきます。(このほかにも調べてみると知らなかったいろんな機能があり驚かされます。深く知りたい方はぜひ調べてみてください。）