Editタブでは、Figmaに挿入したりダウンロードしたりする前に画像を編集できます。左側にツール、中央に写真、右側にコントロールが表示されます。左側のナビゲーションは、Tools（Selection、Paint brush、Fill、Eraser、Crop、Retouch）、Adjustments（Adjust）、Finishing（Filters、Effects、Local AI）のグループに分かれています。Selectionでは、オブジェクト検出、自動選択ツール、長方形、楕円、なげなわ、ブラシによる選択ができます。カラースウォッチの横にあるPickでは、画像から色を取得できます。
動画チュートリアル：Figmaで画像を編集する
画像を開く
- FigmaのDesignファイルでTinyImageを開き、Editを選択します。
- 対応する画像ファイルを開くにはOpen image from computerを選びます。Figmaのレイヤーを使う場合は、レイヤーを選択してUse selected Figma layerを選びます。画像を開く前のメインヘッダーには、Open project、Save project、Batch editのみが表示されます。画像を開いたあとのメインヘッダーでは、短いラベルのOpen from computerとUse Figma layerが使われます。選択したレイヤーが1つならすぐに開きます。複数のソースがある場合は、編集する画像を選びます。
- 複数のレイヤーを選択していてソースピッカーが表示された場合は、original imageの塗りかrendered layerを選び、Open selected imageを選択します。
Use selected Figma layerは、レイヤーを選択していないと無効になります。別の画像やプロジェクトを開くと、現在の画像と編集内容を置き換える前に確認が表示されます。作業を続けるにはキャンセルし、作業内容を残すには先にプロジェクトを保存してください。
original imageは、Figmaの色調整を含まない元のピクセルを使います。rendered layerには、Figmaの調整やほかのコンテンツを含む、レイヤーの見た目がそのまま含まれます。置き換えられるのはoriginal imageの塗りだけです。ローカルファイル、rendered layer、再度開いたプロジェクトは、新しい画像として挿入できます。
Layersで編集を管理する
右パネル上部のLayersタブを選ぶと、調整、マスク、エフェクトをまとめて確認できます。編集の横にある目のアイコンを使うと、設定を保ったまま、その下の画像と比較できます。名前をクリックするとコントロールが開きます。表示・非表示の変更はUndo/Redoと保存したプロジェクトに対応しており、非表示の編集は出力から除外されます。横にあるHistoryタブでは以前の編集状態に移動でき、Propertiesでは現在のツールのコントロールに戻ります。詳しくはレイヤー、履歴、プロジェクトをご覧ください。
Local AIツール
ツールサイドバーでLocal AIを選び、画像を高解像度化するにはBoost resolution、透明な背景の切り抜きを作成するにはRemove backgroundを使います。どちらのツールも100%お使いのデバイス上で実行されます。いずれかの操作を初めてクリックすると、そのモデルが自動でダウンロードされてから画像が処理されます。画像が外部サービスにアップロードされることはありません。モデルはプラグインを開いている間は使い続けられます。
手順についてはBoost resolutionとRemove backgroundをご覧ください。結果はFigmaに挿入するか、ダウンロードできます。透明を保つにはPNGを使ってください。
編集ガイド
- トリミングとリサイズ
- 明るさと色
- シャープ
- Boost resolution
- Remove background
- フィルターとプリセット
- エフェクト
- 選択、ブラシ、消去
- レタッチ
- 履歴とプロジェクト
- 一括編集とエクスポート
キャンバス右上のAfter、Before、Compareの切り替えで編集内容を確認できます。Beforeをクリックすると編集前の画像に切り替わり、もう一度クリックすると編集後の表示に戻ります。Beforeを長押しすると一時的に確認でき、\を押しても切り替えられます。ローカル処理のあとは、その処理の直前の画像が表示されます。どのズーム倍率でも、Spaceを押しながらドラッグするとキャンバスを移動できます。キャンバス下のズームメニューでFitまたは倍率を選べます。
対応するアップロード
Open image from computerは、次の画像形式に対応しています。
| 形式 | ファイル拡張子 |
|---|---|
| PNG | .png |
| JPEG | .jpg, .jpeg |
| WebP | .webp |
| GIF | .gif |
| BMP | .bmp |
| AVIF | .avif |
| TIFF | .tif, .tiff |
| HEIC / HEIF | .heic, .heif |
| カメラのRAW | 下記の拡張子をご覧ください。 |
対応するカメラのRAW拡張子は、.dng、.cr2、.cr3、.crw、.nef、.nrw、.arw、.sr2、.srf、.raf、.orf、.rw2、.pef、.rwl、.srw、.x3f、.3fr、.fff、.iiq、.kdc、.dcr、.mos、.mrw、.erf、.rawです。
RAWへの対応は、カメラと圧縮形式によって異なります。拡張子に対応していても、すべてのカメラのバリエーションを開けるとは限りません。対応していないファイルや破損したファイルを開いても、現在の編集セッションはそのまま残ります。
RAW画像は、カメラのホワイトバランスと向きを使ってローカルで現像され、編集用に8ビットのsRGB画像に変換されます。Editorは埋め込みのサムネイルではなく、現像したセンサー画像を使います。これは画像編集のためのワークフローであり、センサーのRAWデータは保持されず、RAWでのエクスポートにも対応していません。保存したプロジェクトには、変換後の画像が保持されます。
GIFは静止画として開き、複数ページのTIFFは最初の完全な画像を、HEIC/HEIFファイルはプライマリ画像を使います。TIFFのRGB画像とグレースケール画像は8ビットまたは16ビットに対応していますが、編集とエクスポートでは8ビットのピクセルを使います。対応していないTIFFのピクセル配列ではエラーが表示されます。読み込み時に、元のファイルのメタデータやカラープロファイルは保持されません。
デコードはプラグイン内でローカルに行われます。アップロードの上限は64 MB、デコード後の画像の上限は24メガピクセルです。これより大きいRAWファイルは、リサイズまたは変換してから開いてください。
エディターのウィンドウサイズを変更する
Editタブは、最初は1120 × 780ピクセルで開きます。右下のハンドルをドラッグすると幅と高さを変更できます。最小幅は、Editタブの初期幅と同じ1120ピクセルです。ハンドルにフォーカスしているときは、矢印キーで10ピクセルずつ、Shiftを押しながらだと50ピクセルずつサイズを変更できます。TinyImageはエディターのサイズを記憶しており、別のタブを選んだときは通常または拡大したウィンドウサイズに戻します。
画像の上限
エディターは、デバイスのグラフィックスとメモリの性能に応じて、最大24メガピクセルの画像に対応しています。エディターが起動しない場合は、ハードウェアアクセラレーションを有効にするか、ChromeでFigmaをお試しください。画像を表示できない場合は、より小さい元画像をお試しください。編集の応答性を保つため、プレビューには小さい画像が使われることがありますが、エクスポートする画像はトリミング後のフル解像度になります。
画像の編集結果はラスター画像になります。Figmaで編集できる調整レイヤーにはなりません。
編集の範囲
エディターはラスター画像を対象にしています。レイヤー付きのPSDファイルは編集できません。編集内容は、結果を挿入、置き換え、ダウンロードするまでエディター内に残ります。処理はお使いのデバイス上で行われ、一部のツールは最初に処理用のモデルをダウンロードします。