Eビジネスエンジニアリング課の小枝です。
直近では管理画面アプリのUIデザインを手掛けています。
今回はグラフィックソフトに馴染みのないエンジニアでも実務で使える、Figmaの最小限の操作をご紹介します。
これだけ押さえれば大丈夫！Figmaは怖くない……！！
対象：Figmaの操作に馴染みのないエンジニア
ゴール：画面移動、オブジェクトの選択、画面の書き出しがわかる
・手のひらツール
・グループ内のオブジェクトを選ぶ方法
・画面の書き出し方
画面の移動には手のひらツールを使用します。
でも移動させるたびにツールから選択するのは面倒です……。
Figmaではスペースキーまたはマウスのホイールボタンを押し続けている間、一時的に手のひらツールになります。
複数のオブジェクトがグループ化されている場合などは、レイヤーウィンドウから選択できますがレイヤー名から探すのは結構大変です。
なので選択したいオブジェクトをまずクリックして選択します。
ダブルクリック一回ごとに現在選択しているオブジェクトの子要素が選択できるので、選択したいオブジェクトが選択できるまでダブルクリックし続けます。
書き出したい画面を選択して、画面右下のインスペクタからエクスポートの＋アイコンを押下すると、書き出しの指定ができます。
サイズや拡張子も選べますし、複数画面をひとまとめに書き出すことができます！
手のひらツールはスペースキーもしくはホイールボタンで使える！
グループ内のオブジェクトはダブルクリックで選択できる！
画面の書き出しは画面右下から！