ヒント
Phrase TMSにおけるFigma統合の詳細については、Figma (TMS)を参照してください。
Figmaプラグインを使用すると、デザインコンテンツをPhraseプロジェクトと統合でき、製品デザインチームとローカリゼーションチームの間のギャップを埋めることができます。このプラグインは、コンテンツのプッシュ、翻訳のプル、およびFigmaとPhrase Strings間でのキー管理をサポートしています。
-
Branching がサポートされています。
-
翻訳者のユーザー権限を持つ少なくとも1つのプロジェクトと1つの言語へのアクセス権が必要です。アクセス権は、招待を管理者またはプロジェクトマネージャーから送ってもらうことで付与されます。
-
プラグインは、子要素ではないオートレイアウトフレームのスクリーンショットを送信します。
-
デフォルトでは、非表示のテキストレイヤーは統合に含まれません。これは、設定
で を選択することで変更できます。
-
デフォルトでは、プラグインで選択されたタグはプッシュ処理後にクリアされます。これは、設定
で オプションを無効にすることで変更できます。
-
プラグインのデフォルト設定
に加えた変更は保存され、維持されます。
プラグインを実行するには、Figmaのプラグインブラウザ内または Figma Community からプラグインを選択し、Try it out をクリックします。プラグインはFigmaの メニューから利用できるようになります。
FigmaからPhraseへの接続は、Phraseの認証情報、アクセストークン、またはシングルサインオン(SSO)を使用して行うことができます。
SSOでサインインするには:
-
プラグインのログイン画面で、Sign in with SSO を選択します。
-
組織IDを入力してください。
-
開いたブラウザタブでログインを完了してください。
認証が完了したら、プラグインに戻ってください。
接続が確立されると、フレームを選択することでFigmaコンテンツのプレビューと、ユーザーがPhrase Stringsに対してプッシュまたはプルできるキーが読み込まれます。
タブでは、Figmaレイヤーを既に存在するStrings プロジェクト内のキーに接続できます。命名規則がレイヤーとキーの両方で同じであれば、自動的に照合できます。
プラグインには、Figmaサイドバーの専用ボタンからアクセスできます:
-
Phrase Strings
クリックしてプラグインを開きます。
-
View text in Strings
Stringsプロジェクトに接続されたFigmaファイルに表示されます。クリックして、関連するプロジェクトを翻訳エディタで開きます。
タブでは、FigmaのフレームやテキストレイヤーをローカライズのためにPhrase Stringsへ送信できます。保護されたメインブランチにコンテンツをプッシュすることはできません。
プッシュするコンテンツのプロジェクト、ブランチ(使用している場合)、および言語を選択します。オプションで、アップロードするキーに追加するカスタムタグを入力します。
空のキー名や重複するキー名は、列の赤いカウンターで示されます。長いキー名のリストを管理するには、 ドロップダウンを使用して、またはを表示します。
備考
選択した並べ替えオプションは、次回のセッションでも記憶されます。
キー名の入力欄が空である、無効な文字が含まれている、または保護されたメインブランチが選択されている場合、キー名が一意でないと、Push to Phraseボタンは無効になります。
設定を選択して、キー名の入力を編集し、名前の競合を解決します。必要に応じて、目的のキーを選択し、テーブル上部のレイヤーを除外をクリックして、それらのレイヤーをプラグインから削除します。
競合するキー名を持つ切断されたレイヤーがある場合は、利用可能な解決オプションのいずれかを選択して続行してください。
-
-copyサフィックスが付いた新しいキーを作成します。 -
レイヤーを既存のPhraseキーにリンクします。
-
競合しないレイヤーのみをプッシュします。
Figmaプレビューをアップロードオプションが有効な場合:
-
ユーザーは、Figmaプレビューに含めるターゲット言語を任意で選択できます。言語が選択されていない場合、デフォルトですべての言語が含まれます。
-
プラグインは、プッシュに含まれるルートフレーム(またはトップレベルコンポーネント)ごとに1つのジョブを作成します。多数のトップレベルフレームを含むFigmaページ全体をプッシュすると、それに応じて大量のジョブが生成されます。ジョブ数を実際の翻訳作業の範囲に比例させるには、プッシュする前に、新規または更新されたコンテンツを含む特定のフレームのみを選択してください。
レイヤーがStringsに正常にプッシュされると、ウィンドウが表示され、概要と以下のオプションが示されます。
-
ジョブを作成
クリックすると、プッシュされたキーが事前に選択された状態でページが開きます。
注意
Figmaプレビューをアップロードオプションが有効になっている場合、Stringsでジョブが自動的に作成されます。一度有効にすると、無効にすることはできません。
-
Stringsで開く
クリックすると、Stringsエディターでプッシュされたキーが表示されます。
コンテンツをプッシュした後にStringsで名前が変更されたキーの横に、黄色の警告アイコンが表示されます。Figmaプラグインでキー名を更新するには、不一致のキー名の横にある省略記号
メニューから キー名を同期 を選択します。
プッシュオプションとアクション
メニューをクリックして、必要に応じて以下のプッシュオプションのオン/オフを切り替えます。
-
スクリーンショットをアップロード はデフォルトで有効になっています。これにより、フレーム内の選択されたレイヤーのスクリーンショットを添付できます。
-
設定が有効な場合、Figmaプラグインでインポートされた非表示のテキストレイヤーには、スクリーンショットの左上隅にマーカーが配置されます。
-
設定が有効な場合、Figmaセクションのスクリーンショットは作成されません。
セクション内で作業中にプラグインのパフォーマンスに問題が発生した場合は、このオプションを有効にしておくことをお勧めします。
-
を有効にすると、各スクリーンショットの範囲が、最上位の祖先ではなく、テキストレイヤーを囲む最も近いフレーム、コンポーネント、インスタンス、またはセクションに限定されます。そのコンテナ内のすべてのテキストレイヤーに、現在の選択範囲外のレイヤーを含めてマーカーが配置されます。
このオプションはデフォルトでオフになっています。 では特定のネストされたフレームへのキャプチャを十分に制限できず、スクリーンショットが大きくなりすぎてコンテキストが分かりにくくなる場合に使用してください。
-
-
Phrase Stringsのコンテンツを更新 はデフォルトで有効になっています。
-
Phrase Stringsのキー名を更新はデフォルトで有効になっていますが、設定が無効の場合は適用されません。
このオプションをオフに切り替えると、すべてのキー名入力がリセットされます。
-
Figmaプレビューをアップロード を有効にすると、選択したキーからHTMLバンドルがエクスポートされます。
このオプションは、Stringsから同期されたジョブを操作する際に、TMS CATエディターでインコンテキストプレビューを生成するために必要です。
ユーザーは、コンテンツをプッシュする際にFigmaプレビューに含めるターゲット言語を任意で選択できます。言語が選択されていない場合、デフォルトですべての言語が含まれます。
プレビューが正常に生成されると、Stringsでジョブが自動的に作成されます。重複するジョブを避けるため、Stringsプロジェクトでアクティブなジョブ自動化はスキップされます。
プレビューが50 MBの制限を超える場合、キーはStringsにプッシュされますが、プレビュー付きのジョブは作成されません。
備考
StringsエディターでFigmaプレビューを操作するには、コンテキストサイドバーのFigmaプレビューを追加アクションを使用します。
-
コンテンツの書式設定とスタイルを保持を有効にすると、FigmaからPhraseにコンテンツをプッシュし、翻訳をプルバックする際に、リッチテキストの書式設定(リスト、改行、太字/斜体、リンクなど)が保持されます。
有効にすると、HTML書式設定タグが自動的に追加されてインラインスタイルが保持され、Stringsから同期されたジョブを操作する際に、TMSのインコンテキストプレビューでサポートされます。HTML書式設定タグは、StringsエディターおよびFigmaにプルバックされたエクスポート済みの翻訳内に表示されます。
手動調整を避けるためにリッチな書式設定が不要な場合は、このオプションを無効にしてください。
この設定はファイルレベルで適用され、そのファイルで作業するすべての共同作業者に影響します。このオプションは、新しいファイルに対しても引き継がれます。
されたレイヤーについては、関連する省略記号メニューで以下の操作が可能です。
-
キーの詳細を表示を選択して、Phrase Stringsでキーの説明を表示/編集するか、キーの文字数制限を設定します。ウィンドウで保存された変更は、エディターページを更新するとStringsエディターのサイドバーに反映されます。
ヒント
タブで複数のキーを選択し、一括アクション文字数制限を設定を使用して、選択したすべてのキーの文字数制限を一度に設定します。
-
エディターでキーを開くを選択して、Stringsエディターの関連キーに移動します。
-
コンテンツをPhrase Stringsから切断を選択して、レイヤーを既存のキーから切断します。
この重複コンテンツの管理
コンテンツをプッシュする際、重複するコンテンツを持つレイヤーは、まったく同じテキストを含む複数のキーをStrings内に生成します。ユーザーは、ウィンドウで、この重複コンテンツをどのように管理するかを決定できます。
-
重複するコンテンツを持つ複数のキーを作成することが意図的な場合は、マージせずに続行を選択します。
-
一部の重複コンテンツを単一のキーにマージするには、以下の手順に従ってください。
-
一部またはすべての複製されたコンテンツをリストの最初のキーにマージするには、次の手順に従います。
-
リストから複数のキーまたはすべてのキーを選択し、
Merge all duplicates into first keyをクリックします。
-
Proceedをクリックし、ポップアップでMerge and Pushを選択して確定します。
複製されたコンテンツは単一のキーにマージされ、関連するすべてのレイヤーがそのキーに接続されます。
このオプションは、重複が多い大きなファイルで役立ちます。すべての重複を、見つかった最初のキーに一度の操作でまとめてマージできるため、各項目を個別に処理する必要がありません。
-
Figmaでフレームやテキストレイヤーを複製すると、Phrase Stringsキーへの既存の接続も複製されます。複製されたレイヤーが新しい無関係なコピーに再利用され、先に接続を解除せずにプッシュされた場合、プッシュによって新しいキーが作成されるのではなく、既存のキーのソーステキストが更新されます。キーのソーステキストを更新しても、そのキーに既に保存されているターゲット言語の翻訳が消去または更新されることはありません。そのため、後でレイヤーをプルしても、新しくプッシュされたコピーではなく、以前のコンテンツに関連付けられた翻訳が返されます。
複製または再利用されたフレームやテキストレイヤーからコンテンツをプッシュする前に、タブを確認し、レイヤーが既にキーに接続されているかどうかを確認してください。接続されており、新しいコピーが以前のコンテンツと無関係である場合は、まずレイヤーの接続を解除してください。そうすることで、プラグインは既存のキーを上書きせずに新しいキーを作成します。
Auto-exclude layers設定は、名前のプレフィックスに基づいてタブからテキストレイヤーを削除します。有効にすると、_または.で始まる名前のレイヤーは自動的に除外されます。
この設定はデフォルトでオフになっており、ファイルごとに適用されます。オフにするまで、そのファイル内の名前が付けられたすべてのレイヤーに対して有効になります。
除外設定は選択範囲全体で保持されます。コンポーネントの場合、コンポーネントのレイヤーにプレフィックスが付いており、Auto-exclude layersが有効になっていると、そのコンポーネントを使用する下流のデザインにも除外設定が継承されます。
からプレフィックス付きレイヤーを自動除外するには:
プラグイン設定のセクションでは、接続されたキーの命名規則を設定できます。
Figmaでキー名をカスタマイズするには、以下の手順に従ってください。
-
Enable smart key namingを設定からクリックします。
-
を選択します。
備考
が有効な場合、キー名はテキストレイヤー名に基づいて自動的に生成されます。
-
フィールドに、カスタムキー名の命名規則を定義するテキストを入力します。
-
必要に応じてAvailable macrosをクリックし、サポートされているマクロから選択して、キー名を自動生成します。
複数のマクロを選択してキー名を構成できます。
-
フィールドでは、自由入力テキストとマクロを組み合わせることができます。
Examplesをクリックして、定義済みの例を表示し、選択します。
-
-
必要に応じて、ドロップダウンからフォーマットオプションを選択し、テキストを適宜変更してスペースを削除します。
コンテンツをPhrase Stringsにpushing contentする際、以下のいずれかの方法で、新しく作成した命名規則を以前接続したキーに適用します。
-
テーブル下部にある更新
アイコンをクリックする。
-
特定のキーを選択し、テーブル上部にあるRegenerate key namesをクリックする。
利用可能なマクロ
|
マクロ |
項目 |
|---|---|
|
ファイル名 |
Figmaファイルの名前 |
|
ページ |
キーが識別されるFigmaページ |
|
{parent_section} |
ページツリー内の最上位セクション |
|
{nearest_section} |
ページツリー内でテキストレイヤーに最も近いセクション |
|
{frame} |
キーが識別されるフレーム |
|
{parent_group} |
ページツリー内の最上位グループ |
|
{nearest_group} |
ページツリー内でテキストレイヤーに最も近いグループ |
|
{component} |
キーが配置されているFigmaコンポーネントの名前。ソースコンポーネントのみが考慮されます。 |
|
{element_name} |
テキストレイヤーの名前 |
|
{element_content} |
テキストレイヤーからのコンテンツ |
|
{random} |
ランダムに生成された一意の短いハッシュ |
コンテンツをプッシュする際、ユーザーはレイヤーをPhrase Strings内の既存のキーに接続するか、新しいキーを生成できます。
タブを選択して、接続済みおよび未接続のキーの概要を表示します。
すでに接続されているキーは、列にあるリンクアイコンで識別されます。必要に応じて、プロジェクト、ブランチ(使用されている場合)、および言語を選択するか、検索アイコンをクリックして目的のコンテンツを見つけます。
キーを接続を選択して、タブ内のすべての未リンクキーを一括接続します。個々のキーを接続または接続解除するには、対応するエントリの右側にある関連アイコンをクリックします。
Figmaフレームを複製またはコピーすると、既存のレイヤーとキーの接続もコピーされます。元のフレームが別のPhrase Stringsプロジェクトのキーに接続されていた場合、複製されたレイヤーは、意図したプロジェクトに接続されるのではなく、そのプロジェクトのキーにリンクされたままになります。元のプロジェクトで同じロケールが構成されていない場合、影響を受けるレイヤーのそれらのロケールに対して、Figmaへのコンテンツのプルが通知なく失敗します。
影響を受けるレイヤーを修正するには、タブを開き、プロジェクトを正しいものに設定し、キャンバス上で影響を受けるテキストレイヤーを選択してコンテンツで検索し、一致するキーの接続をクリックします。レイヤーはプロジェクトごとに個別の接続を保持できるため、事前にレイヤーを以前のキーから接続解除する必要はありません。
一部のアカウントでは、プラグインの「設定」パネルで「新しい接続ビューを使用する (ベータ版)」トグルを利用できます。有効にすると、キャンバス上で影響を受けるすべてのレイヤーを一度に選択し、を開いて、一括コンテンツで接続アクションを使用することで、個別にではなく一度に再接続できます。
備考
個々のキーを接続解除するオプションは、タブでも利用できます。
新しいビューでは、現在の選択範囲のテキストレイヤーとその接続ステータスが単一のテーブルに一覧表示され、以前のキーベースのリストに置き換わります。
備考
最新バージョンが読み込まれるように、ベータ版を有効にする前にプラグインを再起動してください。
を有効にするには:
以前の接続ビューも引き続き利用可能です。元に戻すには、プラグイン設定でを無効にします。
単一のレイヤーを接続するには、それを選択して2つのタブがあるウィンドウを開きます:
-
提案: 名前が完全に一致するキーと、翻訳コンテンツが一致するキーを表示します。
-
検索: 名前またはコンテンツですべてのキーを検索します。
複数のレイヤーに対して操作を行うには、それらを選択して一括操作トレイを表示します:
-
キー名で接続: レイヤーを名前が完全に一致するキーに接続します。
-
コンテンツで接続: レイヤーを、翻訳内容が一致するキーに接続します。
-
レイヤーの接続を解除:選択したレイヤーから接続を削除します。
一致するキーが複数あるレイヤーをスキップ。
一致するキーが複数あるレイヤーをスキップトグルは、が、テキストが複数のキーに一致するレイヤーをどのように処理するかを制御します。
トグルを有効にするには:
-
プラグインを開き、タブに移動します。
-
ナビゲーションの
をクリックして、表示オプションを開きます。
-
を有効にします。
有効にすると、複数のキーに一致するレイヤーは、実行時にスキップされ、手動で確認するために接続されません。
実行後の概要。
「コンテンツで接続」または「キー名で接続」のバッチ実行後、結果ウィンドウに結果が表示されます。
-
接続数。
-
スキップされました—一致するものが見つかりません。
-
スキップされました—複数の候補が見つかりました(「複数のキーが一致するレイヤーをスキップ」がオンの場合に表示されます)。
未接続のレイヤーを表示をクリックして、まだ対応が必要なレイヤーをテーブルでフィルタするか、完了をクリックして結果ウィンドウを閉じます。
テキストレイヤーを複数形キーとしてマークすると、Phrase Strings内のそのキーの複数形に接続されます。複数形キーの場合、列にはキーのコンテンツの代わりにフォーム選択ドロップダウンが表示され、選択した言語で使用可能なフォーム(例:oneやother)が一覧表示されます。ポーランド語のように、より複雑な複数形ルールを持つ言語では、最大5つのフォームが表示されます。
ドロップダウンは、タブとタブの両方に表示されます。
キャンバス上で複数形をプレビューするには:
-
コンテンツテーブルで複数形のキーを見つけます。
-
列のフォーム選択ドロップダウンをクリックし、プレビューする複数形を選択します。
-
Phrase Stringsは、一致する翻訳をレイヤーにプルしてキャンバス上でプレビューします。
複数形のキーをPhrase Stringsにプッシュする場合、他のキーと同じプッシュワークフローに従い、選択したフォームの翻訳のみが更新されます。
選択された複数形は、レイヤーごと、プロジェクトごと、およびブランチごとに記憶されます。この選択はセッションをまたいで保持されます。
翻訳が完了したら、翻訳をプルするFigmaレイヤーまたはフレームを選択し、タブをクリックします。
ユーザーは、プルするコンテンツのプロジェクト、branch(使用されている場合)、および言語を選択できます。タグをFigmaにプルバックすることはできません。
キー名の長いリストを管理するには、 ドロップダウンを使用してし、潜在的な問題に対処します。必要に応じて、特定のキーを選択し、テーブル上部の レイヤーを除外 をクリックして、それらのレイヤーをプラグインから削除します。
備考
選択した並べ替えオプションは、次回のセッションでも記憶されます。
をクリックして、Figmaでプルされたコンテンツの表示方法を選択します:
-
デフォルトで選択されています。複数の言語をプルする場合、選択した各言語に対して個別のFigmaページが作成され、ページ内のすべてのレイヤーが含まれます。
備考
Figma Buzz では、 オプションが表示されます。
-
単一の新しいページを作成し、選択した翻訳済みコンテンツを言語別の列に並べて配置します。このオプションは、Figmaページ全体を複製するのではなく、アクティブな選択範囲のみに焦点を当てます。
プルパフォーマンスを向上させ、不要なファイルサイズを削減するために、大きなファイルに対して推奨されます。
-
選択したテキストレイヤーは翻訳で上書きされ、ビューポートで更新されます。
このオプションは、複数の言語をプルする際には自動的に無効になります。
-
デフォルトでは無効になっています。有効にすると:
-
翻訳されたコンテンツの代わりにキー名がプルされ、表示されます。
-
プルするコンテンツの言語を選択することはできなくなります。
-
-
設定は今後のセッションのために記憶されます。
-
無効にすると、列に選択したレイヤーのコンテンツが直接表示されます。
-
有効にすると、列に、接続されたレイヤーの選択した言語でのコンテンツのプレビューが表示されます。
-
接続されていないレイヤーについては、オプションを有効にすると、選択した言語でのプレビューが表示されます。プルされたデータに同じ名前のキーが存在する場合、そのキーのコンテンツがプレビューとして使用されます。
-
このオプションは、複数の言語をプルする際には自動的に無効になります。
-
-
Figmaでデータをプルする際に、接続されていないレイヤーをどのように処理するかを制御します。設定は今後のセッションのために記憶されます。
-
有効にすると、システムはプルされたデータに同じ名前のキーが存在するかどうかを確認します。
一致するものが見つかった場合:
-
接続されていないレイヤーが、一致するキーに接続されます。
-
レイヤーのコンテンツは、既存のキーからプルされたコンテンツで更新されます。
-
-
無効にすると、プルされたデータに一致するキーが存在する場合でも、接続されていないレイヤーは更新されません。
-
翻訳ステータスを確認します
「翻訳ステータスの確認」機能は、Figmaにコンテンツをプルする前に、現在の選択範囲内のテキストレイヤーに選択したターゲット言語の翻訳が既に存在するかどうかを検証します。このチェックは、選択範囲内のすべての接続済みキーに対して実行されます。
翻訳ステータスを確認するには
-
タブで、確認するターゲット言語を選択します。
-
翻訳確認ステータスをクリックします。
ページには、現在の選択範囲における各言語の翻訳済み、部分翻訳、未翻訳のキー数が表示されます。
言語の横にあるView detailsをクリックすると、その言語の接続済みキーの内訳が表示されます。、、の各フィルターを使用して、リストを絞り込みます。
コンテンツがFigmaに正常にプルされると、ウィンドウが表示され、更新されたレイヤーの概要が示されます。
複数の言語でプルする場合、ボタンを押すと、プロジェクトのデフォルト言語をソース言語としてキーが開かれます。
備考
デザインで使用されているフォントがローカルにインストールされていない場合、プラグインはプルされた翻訳で影響を受けるテキストレイヤーを更新できません。これが発生すると、「The font [X] could not be loaded」というエラーが表示されます。ここで[X]は不足しているフォントの名前です。このエラーメッセージでフラグが立てられたすべてのフォントをローカルにインストールしてから、コンテンツを再度プルしてください。
Figma Buzz
Figma Buzzは、ブランドデザイナーやマーケティングチームがFigmaエコシステム内で直接、ブランドに沿ったビジュアルアセットを大規模に作成できるツールです。これには、テンプレートシステム、簡略化されたデザインエディター、アセットの一括作成、AIを活用した編集機能が含まれています。
Buzz用のPhrase Stringsプラグインを使用すると、Figma Designとの統合と同等の機能を提供し、Buzz内で直接テキストコンテンツをローカライズすることができます。
-
BuzzデザインからStringsへ、Push source textをプッシュします。
-
Buzzに、Pull translationsをプルバックします。
-
Manage keysを管理し、アセット全体でテキストの一貫性を維持します
備考
ライブプレビューはサポートされていません。
このプラグインは、Buzzのメニューから利用できます。一度アクティブ化すると、将来の使用のために保存でき、Figma Buzzサイドバーのモーダルで開くことで、選択したデザインに対して実行できます。テキストレイヤーは自動的に検出され、プラグインに表示されます。
デザインコンテンツは、翻訳のために接続されたStringsプロジェクトにプッシュできます。翻訳後、ユーザーはローカライズされたコンテンツをBuzzにプルバックでき、これにより翻訳されたバージョンのデザインを含む新しい行が作成されます。
の切り替えとターゲット言語の選択は、キーをプッシュする前にはBuzzでは使用できません。Buzzからキーをプッシュする場合、Stringsプロジェクトで構成されたすべてのターゲット言語が自動的に使用されます。