動画チュートリアル:FigmaをSketchに変換する
この動画では、Convertifyプラグインを使って、Figmaから直接デザインをSketchファイルに(ワンクリックで)自動変換する方法を説明しています。
FigmaのデザインをSketch用にエクスポートするには、以下の手順で.sketchファイルを変換、ダウンロードして開きます。
Figmaのページ全体をSketchにエクスポートする
Convertifyプラグインを起動したら、Export from Figmaタブをクリックし、ワークフローセレクターからExport Figma to Sketchを選んで、現在のファイル内でSketchに変換したいFigmaページを選択します。
デフォルトでは、Figmaファイル内のすべてのページが自動的にエクスポート対象として選択されます。エクスポートに含めるページを指定したい場合は、Export all Figma Pages to Sketchトグルをオフにし、トグルの下にあるページ一覧で、エクスポートしたいFigmaページのチェックを入れたり外したりします。
Figmaページを選んだら、ConvertifyプラグインのExport Pagesボタンをクリックすると、デザインをSketchに変換できます。自動変換の処理が始まります。
所要時間の目安。所要時間の目安(例:~14 seconds to convert 555 layers)は、Figmaページ内のレイヤー数をもとに、変換にかかる時間の目安として表示されます。大きな画像を含むFigmaページは、ファイルへの変換が完了するまでの時間が長くなる可能性があります。
ページ内で選択したFigmaフレームをSketchにエクスポートする
Figmaのページ全体をSketchに変換したくない場合は、変換したいFigmaフレームを選択し、ConvertifyプラグインのExport Selected Framesボタンをクリックすると、デザイン内の特定のフレームレイヤーだけをSketchに変換できます。自動変換の処理が始まります。
所要時間の目安。所要時間の目安(例:~14 seconds to convert 555 layers)は、Figmaページ内のレイヤー数をもとに、変換にかかる時間の目安として表示されます。大きな画像を含むFigmaページは、ファイルへの変換が完了するまでの時間が長くなる可能性があります。
.sketchファイルのダウンロード
ConvertifyがFigmaレイヤーの処理を終えると、確認メッセージが表示されます。Download .sketchボタンをクリックすると、.sketchファイルをダウンロードできます。
Figmaからダウンロードしたファイルの保存 Figmaのデスクトップアプリを使っている場合は、ファイルをダウンロードするためのダイアログが表示されます。一方、WebブラウザでFigmaを使っている場合は、デフォルトでファイルが自動的にパソコンにダウンロードされます(通常はパソコンのDownloadsフォルダに保存されます)。
.sketchファイルを開く
Figmaから.sketchファイルをパソコンにダウンロードしたら、ファイルエクスプローラーで保存先のフォルダを開きます。エクスポートした.sketchファイルをダブルクリックすると、パソコンにインストールされているバージョンのSketchでファイルが開きます。
FigmaのコンポーネントをSketchのシンボルに変換する
動画チュートリアル:FigmaのコンポーネントをSketchのシンボルとしてエクスポートする
この動画では、Convertifyプラグインを使って、FigmaのコンポーネントをSketchのシンボルに自動変換する方法を説明しています。
デフォルトでは、FigmaのコンポーネントとインスタンスはSketchの通常のグループとレイヤーとして変換されます。ただし、ConvertifyプラグインでExport Figma to Sketchを選び、Export Figma Components to Sketch Symbolsトグルを有効にすると、この機能を使ってFigmaのコンポーネントをSketchのシンボルに変換できます。
FigmaとSketchの違いを理解する
Convertifyは、Figmaのすべてのレイヤーと属性をできる限りSketchに変換しますが、Sketchが標準で対応している機能はFigmaより少ないため、どうしても制限があります。
Sketchで再現されないFigmaの機能
以下の機能はFigmaにはありますが、Sketchには標準で存在しないため、Convertifyプラグインでは引き継がれません。
- 親アートボードの非表示
- 回転した親アートボード
- 「円弧」プロパティを持つ楕円
Sketchで対応しているプロトタイプリンク
Sketchのプロトタイプが対応しているインタラクションは、On Clickのみです。
また、Sketchが対応しているナビゲーションの種類は、Navigate ToとBackです。
Convertifyが引き継ぐのは、Figmaのプロトタイプリンクのうち、Sketchが対応しているこれらのプロトタイプ属性に一致するものだけです。