終了

Lottie JSONの貼り付けがWindows版のXDでエラー(Mac版は問題なし)

New Here ,
Jul 27, 2022 Jul 27, 2022

リンクをクリップボードにコピー

コピー完了

Lottie JSONをWindows版のXDにドラッグ&ドロップすると、添付のエラーが表示。

しかし、同じJSONをMac版にドラッグ&ドロップすると、問題なく貼り付けられる。

 

ErrMessage.png

キーワード
プロトタイプ作成 , 読み込みと書き出し

表示

447

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines

correct answers 1 件の正解

積極的な参加者 , Aug 03, 2022 Aug 03, 2022

ファイルありがとうございます。こちら確実にローカルでも削除するようにいたしますね。

さて、読み込みに成功しましたので特定した原因をお知らせします。

 

原因はWindowsに存在しないフォントを使っているからのようでした。


ヒラギノ角ゴシックをSource Han Sans JPに変えたところ動きました。

お手元で簡単に試せますので、JSON内をこのように書き換えてみてください。

"fFamily": "Hiragino Kaku Gothic Pro",
              

"fFamily": "Source Han Sans JP",

根本的な対策ですが、Lottie JSONファイルを書き出す時にフォントをアウトライン化していただくか、Windowsでも存在しているフォントを使用していただくとよいと思います。

追加で、ヘルプで制限を確認すると、フォント指定を含むLottie JSONファイルはブラウザでプロトタイプを見た時にテキスト部分が正しく表示されないかもしれません。
https://helpx.adobe.com/jp/xd/help/work-with-lottie-animations.html?trackingid=4X3B8ZV4&mv=in-product#limitations

...

投票

翻訳

翻訳
積極的な参加者 ,
Jul 27, 2022 Jul 27, 2022

リンクをクリップボードにコピー

コピー完了

おそらく同じアカウントでお試しだと思うのですが、Windows版とMac版のXDは同じバージョンでしょうか。

 

可能でしたら、問題が発生しているJSONファイルを添付していただけませんでしょうか?

Windows版のバグであるかはわかりませんが、同じファイルをほかのWindowsマシンで読み込めないならその可能性が上がると思います。

 

添付いただけない場合は、Windows環境でそのLottieファイルが再生できるかどうかお試しいただけますでしょうか?

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Jul 28, 2022 Jul 28, 2022

リンクをクリップボードにコピー

コピー完了

同じアカウントではありませんが、XDのバージョンが同じであることは

確認しています。(バージョン情報を添付。)

また、他のWindowsPCで確認したところ、同じメッセージが表示され、

読み込めませんでした。(アカウントは同じです。)

 

Windows環境での再生は、問題なくできています。

 

追加情報ですが、

MacでLottieアニメーションを貼り付けたXDWindowsで再生しよう

としても何も表示されませんでした。(Macでは再生されました。)

 

XDについて.png

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
積極的な参加者 ,
Aug 02, 2022 Aug 02, 2022

リンクをクリップボードにコピー

コピー完了

時間が空いてしまいましたが解決方法提示にはいきつけませんでした。

 

参考になるかはわかりませんが、いくつか検証しましたので共有します。

 

シンプルなテキストファイルとしてはエンコーディングや改行コードを変えて手元のLottie JSONで試してみたのですが、同じメッセージが唯一でたファイルはMac版/Windows版ともに読み込みできませんでした(UTF-8 BOM付きのLottie JSONファイルはXDで読むことができないようです)

 

RisaYuguchi_0-1659454103309.png

 

私の手元で試したところ、Windows版で読み込めないLottie JSONファイルは見つけられなかったので、英語版コミュニティとUserVoiceも見ましたが現在特定されている原因はないようです。(自作のLottie JSONファイルはどちらでも読めますし、LottieFilesというサービスで配布されているファイルも読めました)

 

おそらくOneSolutions さんのマシンでもそれ以外のLottie JSONファイルは読み込めるのではないでしょうか?

もしどのLottie JSONファイルも読み込めないならば何らかのインストール失敗が起こっている可能性がありますのでXDの再インストールをお試しください。

そうでないと問題のファイル固有の何かが引っかかっている可能性が高いと思います。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Aug 02, 2022 Aug 02, 2022

リンクをクリップボードにコピー

コピー完了

色々とアドバイス、ありがとうございます。

 

読み込めないLottie JSONは、1つのみです。(他のファイルは読み込めています。)

XDのアンインストール、再インストールを試してみましたが、状況は変わりませんでした。

 

ファイル固有のようですね。

ぜひともXDに貼り付けたいLottie JSONですので、ファイルをお渡しして確認いただきたいと思います。

発注したデザイナーに相談し、可能な限り簡略化してから添付するようにいたします。

少しお時間をいただきたく。よろしくお願いいたします。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Aug 03, 2022 Aug 03, 2022

リンクをクリップボードにコピー

コピー完了

Mac版のXDでは、貼り付けも、再生も問題なくできることを再確認しました。

 

早期の解決を図りたいと思いますので、該当のLottie JSONを添付します。

※著作物ですので、取り扱いにご注意ください。

 

よろしくお願いいたします。

 

[添付ファイルはモデレータにより削除済み]

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
積極的な参加者 ,
Aug 03, 2022 Aug 03, 2022

リンクをクリップボードにコピー

コピー完了

ファイルありがとうございます。こちら確実にローカルでも削除するようにいたしますね。

さて、読み込みに成功しましたので特定した原因をお知らせします。

 

原因はWindowsに存在しないフォントを使っているからのようでした。


ヒラギノ角ゴシックをSource Han Sans JPに変えたところ動きました。

お手元で簡単に試せますので、JSON内をこのように書き換えてみてください。

"fFamily": "Hiragino Kaku Gothic Pro",
              

"fFamily": "Source Han Sans JP",

根本的な対策ですが、Lottie JSONファイルを書き出す時にフォントをアウトライン化していただくか、Windowsでも存在しているフォントを使用していただくとよいと思います。

追加で、ヘルプで制限を確認すると、フォント指定を含むLottie JSONファイルはブラウザでプロトタイプを見た時にテキスト部分が正しく表示されないかもしれません。
https://helpx.adobe.com/jp/xd/help/work-with-lottie-animations.html?trackingid=4X3B8ZV4&mv=in-produc...

  • Lottie アニメーションでデスクトップフォントを使用している場合、そのフォントは web 再生では表示されません。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Aug 03, 2022 Aug 03, 2022

リンクをクリップボードにコピー

コピー完了

ありがとうございます。

 

初歩的な原因でしたね。お手数をおかけしました。

フォントが原因ではないかと思い、「Meiryo UI」を設定するよう依頼してあったのですが、

Macでは「Meiryo」であり、「UI」が抜けていたようです。

JSONの中身も見るべきでした。反省です。

 

プログラムでJSONの中のフォントを変更する仕様のためアウトライン化してなかったことも

原因発見を遅らせてしまったようです。

 

改めて、ありがとうございました。引き続き、よろしくお願いいたします。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
積極的な参加者 ,
Aug 03, 2022 Aug 03, 2022

リンクをクリップボードにコピー

コピー完了

解決してよかったです。
テキストファイルといえば文字コードかフォントはポイントになりやすいですね!

 

こちらはオープンな場ですのでJSONファイルはお早めに削除してくださいませ。

難しいようでしたら管理者に削除依頼を出しますのでお知らせください。

 

すてきなサイトになりますように。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Aug 03, 2022 Aug 03, 2022

リンクをクリップボードにコピー

コピー完了

最新

すいません。削除方法がわかりません。

さらにお手数をおかけしてしまいますが、管理者の方に削除をお願いしてもよろしいでしょうか? よろしくお願いいたします。

 

XDは、主に、Webアプリケーションのデザイン、プロトタイピングに使わせていただいています。個人的には、Photoshop以来の革新的なアプリケーションと思っています。(年齢がばれてしまいますが、Photoshopは初版から使わせていただいています。)

毎回のバージョンアップも楽しみにしています。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines