最近、にわかにFigmaユーザーが増えて行っている気配を感じたので、触ってみることにしました！

１、Figmaに関するツイート

直接の興味をもったのは crowdport 日比谷すみれさんのこのツイート

最近メルカリの鈴木さんがこんなこともつぶやかれていて

5/11日のこちらのイベントに登壇される三橋さんもよくfigmaのことをつぶやかれています。私も参加してきます。

そんなわけで、Figma最近注目度高いという風を感じてしまった私は、Figmaをさわってみるわけです。

２、note内のFigmaの記事

note内では（18年5月現在）figmaの記事はとても少なく、こちらの記事が代表的です。（19年に入りかなり記事が増えましたね！）
全体のFigmaに関することはこちらを読んでいただくのがよろしいかと。
基本的な操作はほぼsketchに準ずるといった感じです。

３-１、コンポーネントの柔軟性がすごい

私は主に、コンポーネントの柔軟性について触れていきます。

動画の一番左の緑のボタンがベース、ラベル、アイコンをコンポーネント化したマスターのコンポーネント

コンポーネントを複製して、それぞれ色を直接変えることができます。しかもマスターコンポーネントに紐づいているので、ベースや文字の色を変更するとそれぞれ複製したものにも同じく反映されます。同じことをSketchでやろうと思うと、別のシンボルを作ることになるのでとても柔軟性が高いです。

もちろん、カラーをコンポーネント化してベースのカラーをオーバーライドする（インスタンス変更する）sketch的なやり方もできます。

ちなみに、figmaのコンポーネント ＝ sketchで言う所のシンボルは、シンボルレイヤー的なものが存在しないので、同一画面に平置きする感じになります。（たぶん）

※追記　チームライブラリ　というコンポーネントをライブラリ化する機能があるようです。

３-２、インスタンスのスワップが便利

対象を選んでから、コンポーネントを　オプション＋ドラッグ＆ドロップ

動画では、緑のボタンのアイコンを通常のインスタンス変更（sketchでいうところのオーバーライド）したのち、上記の方法での変更と２通りの変更方法をしています。
緑ボタンがマスターなので、アイコン変更したら他の２つのボタンにも反映されてますね！

４、写真ぽいぽい機能がすごい

Shift + ⌘ + K　で写真選択画面を開いて、必要な画像をピックしたら、fillに画像を設定したいところにぽいぽいしていく。

正直、Sketchのinvisionのほうが使い勝手はいいですね。でも設定したいところを任意に選べるってのはなかなか柔軟じゃないでしょうか？あと動きが気持ちいい（笑

５、ヒストリーパネル・バージョン管理

Command + Option + S でヒストリーバージョンに任意の名前をつける

Figmaには標準でバージョン管理機能が付いてます、大幅な変更をする場合はヒストリー機能を使って名前をつけておくといいと思います。

なお、ヒストリーパネルはツールバー真ん中のファイル名の横の三角から、Show Version Historyからたどり着けます

６、コメント機能

コメント機能ってどこにあるんだ？って微妙にわかってなかったので、おまけで収録した動画。ちゃんとツールに並んでました！
好きなところにコメントつけ放題！

終わりに

Figmaが本領を発揮するのはブラウザさえあればいけるところと、複数人で画面共有or同時作業ができるという部分なんだろうなと思います。が、私は一人なので、あまり恩恵に預かれません。
ただ、こうやってコンポーネントに着目すると他のツールにはない便利さがあったのだと知りました。
ツールはその案件にあったものを適切に使用したいものですね！