学習兼ねて近所の寿司屋さんのWEBサイトをSTUDIOで作成しています。
メニューのイメージ画像をモーションで動かしているのですが、PCブラウザ(Chrome, Edge)で見るとページの読み込み時間が長いようで、なかなか動きません。
特に2枚目の画像読み込みが遅いと感じます。
同じWi-Fiを使っている携帯電話だと特に気になりません。
設定に問題あるのか、解消方法がわからず困っています。
何か良い方法があれば、ご教授いただけないでしょうか。
イメージファイルは1MB～3MBほど＊7枚は大きすぎる？
ひとつのでアイテムをたくさん作るのがいけない？
各アイテムに設定されたモーション間で依存関係がある？
↓のメニュー以下の部分です。
モーションの設定は↓です。
こんにちは。STUDIOは基本的に、画像を全てwebp形式に自動圧縮してくれます。
えいばさんがご自身でアップロードされたであろうお寿司の写真たちは、各50kB前後まで容量が圧縮されているようですので、原因は画像以外にあると思います。
恐らくアニメーションの設定ではないかと思います。
僕に編集権限を付与していただければ、エディタを確認してみたいと思いますが、いかがでしょうか？
もしよければ、僕の編集用アドレスをお送りしますので、SlackにてDMをください。
「あき @ シドニー」という名前でSlackにいます。
よろしくお願いします
ありがとうございます！
SlackにDMしました。
お疲れ様です。原因が分かりました！
原因は、一部の画像がSVG形式でアップロードされていたからです。
SVGというのはベクター情報が詰まっている画像で、2Dのイラストやロゴなどを保存するには非常に軽くて使いやすい形式なのですが、3Dの画像になった途端に一気に容量が上がります。
そしてSTUDIOでは、JPGやPNGなどは、webp形式へ自動圧縮されますが、SVGはされません。（そもそもベクター情報なので、圧縮しづらい形式です。）
こちらの二枚で、赤枠に囲ったところをご覧いただくと、SVGとwebpとで圧倒的に容量が違うのがお分かりいただけます。
SVGでのお寿司の写真は、なんと11MBです。これらが数枚あるので、読み込みが遅くなっておりました。
STUDIOでは、画像が読み込まれるタイミングはその場面へスクロールしたときなので、その瞬間瞬間にそれぞれ11MBのSVGを読み込んでいたから時間がかかっていたのだと思います。
一度画像を全て削除していただき、全てJPGまたはPNGであることを確認した上で再アップロードすると、全てがうまく動くはずです。
あきさん、お疲れ様です。
非常に素早い解決、ありがとうございます！
画像を差し替えたらうまくいきました！
最初の方にアップロードした画像は、iPhoneからPCに画像を移動させるときにうまいやり方が思いつかず、アルバムからGoogle Drive経由でPCへ移動させていましたが、このときにごちゃごちゃした結果SVGになったみたいです。
作業後半は人からLINE経由でもらった画像もあったので、一旦LINEの自分用トークに投稿して、それをPCでダウンロードして使っていました。これはJPGになるようです。
ホントにありがとうございました 
