Figmaの隠れ機能4選

今やWEB制作には欠かせないFigma。度重なるアップデートにより、未知の新機能が増えつつあります。

今回は、作業していく中で私が見つけた「こんな便利な機能があったなんて」ポイントを4選、ピックアップさせていただきます。

画像の移動

画像を別のシェイプでも使用したい時、上のようにわざわざそのシェイプから、また画像を呼び込んでくるのは手間がかかります。

①まずは画像元となるシェイプを選択します。

②次に「塗り」レイヤーの部分、該当する画像レイヤーを選択し、背景がブルーのアクティブ状態であることを確認します。
その後、ctrl + cで、画像レイヤーをコピーします。

③次に移動先のシェイプを選択。ctrl + vで画像レイヤーを貼り付けます。
これで他のシェイプにも画像を移動させることができました。

画像の背景切り抜き

これは最近できた機能で、AIに画像の背景を削除してもらうことができる機能です。画像の背景削除の他にも、明るくしたり、色を変えたりなどの指示もできるようなので、ぜひ試してみてください。

①背景を削除したい画像を選択します。

②一番下にあるツールバーの右側にある「キラキラアイコン」をクリック。

③「背景を削除」という項目を選択

④背景が切り抜かれました。

複数の文字を一括変換

カレンダーなど、文字を一括で変換したい時に便利な機能です。

【注意点】変換対象の文字は左のようにそれぞれ独立させてください。
文字の長さが増えて、レイアウトがズレる可能性があるものに関しては、
あらかじめオートレイアウトを適用しておいてください。

①変換対象の文字をshiftまたはshift + ctrlを押しながら選択してください。

②Enterを押すと、カーソルの近くにある文字が編集可能になります。

③変換希望の文字を入力します。
対象の文字が全て置き換わりました。

リスト項目を自動で複製

ニュース部分のデザインをする際、作成した１項目をわざわざコピーして貼り付けして増やしていませんか？その際、うまくオートレイアウト内に入らずにイライラしたこともあると思います。

こちらの機能はAIが自動で項目を複製してくれるので、コピペを繰り返さず便利です。

①基本となる項目を1つ作成します。

②項目をもう一つコピーし、二つをオートレイアウトで囲みます。

③オートレイアウトで囲んだ部分をもう一度選択すると、下記の赤枠の部分が出現するので、それを下にドラッグして引っ張ってみてください。

④項目が複製されました。

（おまけ）下部メニューバーの上にある「コンテンツを置換」ボタンを押すと…

それっぽい文章に仕上がるので、時と場合に応じて使ってみてください。
何か仮でテキストを入れておきたい時にも便利です。（少し日本語が変なのは気になりますが）

まとめ

いかがでしたでしょうか。

他にも良い機能があれば、コラムにて発信してまいります！