Discordコミュニティを作りました! 参加する

フォーラム

トピックを立てる前にチェック
  1. フォーラムガイドライン」に必ず目を通してください。
  2. バージョンアップデート後に表示がおかしくなった場合は、
    「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。
  3. フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
メインビジュアル(SP)の動画設定時の...
 
通知
すべてクリア

メインビジュアル(SP)の動画設定時のちらつきについて

15 投稿
4 ユーザー
18 Likes
1,465 表示
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

お世話になっております。

メインビジュアル(SP)にて動画を使用していますが、添付の動画のように「メインビジュアルの高さ設定」で指定したサイズで表示される

前に一瞬小さいサイズの動画のようなものが表示され、ちらつきのように見えてしまいます。

(PCではこういった現象はなく、SPでのみ起こっています)

こちらの動画は「メインビジュアルの高さ設定」を「ウィンドウサイズにフィットさ

せる」にしておりますが、「数値で指定する」「画像・動画サイズのまま」にしても同じ現象が起きています。
※ポスター画像の設定あり/設定なしも影響がありませんでした。

同様の設定で作成したサイトが全て同症状が起きており、以前はなかった現象に思いますので、

不具合かもしれないと思い報告させていただきました。

(仕様でしたら申し訳ありません)

確認項目
利用規約に同意します*, ガイドラインを読み、内容を把握しています*, よくある質問を先にチェック済みです*, 過去に同じようなトピックがないか検索済みです*, WordPress更新後、SWELLは最新版にしましたか?, Googleなどでも検索してみました, プラグインを停止しても同じことが起こることを確認しました, 自分で追加したコードに問題がないかチェック済みです
問題が確認できるページのURL
利用中のSWELL本体のバージョン
2.6.6.1
OS
iPhone
利用中のWordPressバージョン
6.0.1
利用中のサーバー会社
Xサーバー
利用中のプラグイン一覧

なし(全停止状態)

 
投稿済 : 25/07/2022 3:38 pm
了
 
(@loos_ryo)
投稿: 1264
メンバー Admin
 

見かけたことのない不具合ですねー🤔

プラグインは本当に全て停止していますか?

また、URLを教えていただけないと現象の確認と状況確認ができないため、問題の把握が難しいです。

SWELL開発者です。

 
投稿済 : 25/07/2022 6:52 pm
CHILCHIL reacted
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

返信ありがとうございます。

クライアント様のサイトでしたので、新しくサンプルサイトを用意しましたが同様の症状が出ています。

https://chicoblog.tokyo/demotest/

こちらでご確認いただけますでしょうか。
(何回かブラウザ更新しないと起こらないことがありました)

既存のプラグインは停止してテストしていましたが、こちらのサイトはプラグイン自体を削除しております。

WPは6.0.1、テーマは2.6.6.1、現象が確認できたのはiPhoneとiPadです。

 
投稿済 : 26/07/2022 2:15 am
山本大介
(@b4rskbe5)
投稿: 132
メンバー
 

Android で確認してみましたが、何度更新しても特にチラツキなどの問題はありませんね。参考まで。

Android 9 (53.0.C.1.479) で Chrome (103.0.5060.129) で確認。

スマホ用の動画もサイズが大きいので縦長にリフレームしてビットレートを落としてみたら改善したりしないでしょうか?

お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン

 
投稿済 : 26/07/2022 7:22 am
CHILCHIL reacted
es:エス
(@es)
投稿: 26
メンバー
 

iPhone(iOS15.5)では仰る症状が確認できました。

いわゆる横長の動画をスマホの縦長に調整するのですが、その処理ラグでどうしても一瞬横長で表示されるのと、最初は処理の影響でチラつくのではないかなと思います。

以前との差位についてはわかりませんが、SWELLでは動画(SP)を別設定できると思うので、スマホ用の縦長の動画をご用意されて個別に設定してみるのもひとつの手かと思います。

 
投稿済 : 26/07/2022 8:41 am
, 山本大介, CHILCHIL and 1 people reacted
es:エス
(@es)
投稿: 26
メンバー
 

あ、動画はSPに設定されている、ということですね。失礼しました。いずれにしてもPCとSPは画角が異なるため、PC用とSP用を分けて設定されることで、解消される可能性が高いと思います。

あとは山本さんも示されているように、ネット回線が遅い時でも少しでも処理が早くなるよう、ビットレートを落とすのも効果的な方法だと思います。スマホ用ですと、1Mbpsあればまず大丈夫だと思うので軽くもなってよいと思います。

 
投稿済 : 26/07/2022 8:57 am
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

@es

@b4rskbe5

返信ありがとうございます。

サンプルサイトでは「以前問題なかった設定」を再現したため、SPでも大きな動画を使用したのですが、SP用の動画サイズにしたものを使用しても、多少ちらつきが抑えられるだけで改善はしませんでした。

例えば冒頭に文字やロゴが入っているような動画ですと文字が拡大するように見えてしまい、かなり違和感があります。

現象が起こるのはiOSのみのようで、私の方でもAndroidでは確認できませんでした。

iOSでは、safari、Chromeなどブラウザ関わらず出現するようでした。

 
投稿済 : 26/07/2022 1:08 pm
es:エス
(@es)
投稿: 26
メンバー
 

CHILCHIL さん

改めて、上記サイトに組み込まれている動画(.mov)のみを確認したところ、動画そのものがカクついていたり、縦長で始まる動画の途中で横長サイズの静止画が入っていたりとしています。

その点は関係ないものとして、ということなのかも含め、今一度ご確認いただけますでしょうか。

 
投稿済 : 26/07/2022 1:31 pm
山本大介 reacted
山本大介
(@b4rskbe5)
投稿: 132
メンバー
 

ご確認ありがとうございます。
やはり iOS や iPadOS の不具合か、もしくはスペック (CPU、メモリ、ネットワーク) 不足によるデコード処理落ちが考えられそうです。

動画はコーデックの種類や設定が非常に豊富ですので、コーデックを変更することも検討してみて下さい。
H.264 は、ファイルサイズが小さくなりますが、再生時の負荷がやや高いので MEPG-4 などにしてみたり、インターレースでなくプログレッシブにしてみて下さい。
細かな内容は調べていただいた方が良いと思います。
※ OS のバグの場合は、どうしようもないですが。改善されればラッキーくらいの感じです。

どんな設定か不明であれば、以下のようなソフトで確認可能です。
https://forest.watch.impress.co.jp/library/software/shinkuuslite/

image

本題とは少しそれますが、WebM が使用可能な時に WebM が使えるようメインビジュアルの設定があると便利ですね。ものすごく軽くなります。

お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン

 
投稿済 : 26/07/2022 1:39 pm
and es:エス reacted
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

@es ご確認ありがとうございます。ひとまず別動画へ差し替えしてみましたが同じようです・・・。

(ファイル形式などは山本さんのアドバイスでmp4にしています)

動画自体は素材サイトから持ってきたものなのと、他のサイトの動画でも同様の現象が起こっているので動画そのものは関係ないかもです。

 
投稿済 : 26/07/2022 2:27 pm
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

@b4rskbe5 ありがとうございます。

SPの動画ファイルをmp4のものに差し替え、サイズをSPサイズ(400×900)にカットした上圧縮したものに差し替えしました。

(あまり動画形式に明るくなく、アドバイスに沿ったものでなかったら申し訳ありません)

サイズをスマホに合わせた分、多少のちらつきは抑えられますが現象は起こるようで、やはり動画本来の大きさから、各スマホサイズに切り替わるのが表示されてしまっているようです。

 OSのバグとして諦めるしかないですかね・・・。

 
投稿済 : 26/07/2022 2:33 pm
山本大介 reacted
es:エス
(@es)
投稿: 26
メンバー
 

CHILCHIL さん

ご確認ありがとうございます。了解しました。うーん、不思議ですねぇ。
今から打ち合わせが続くため少し後になってしまいますが、のちほど当方の環境でもテストしてみようと思います。
それまでに他の方からのアプローチで解決するかも…ですが、ひとまずそういうことで失礼いたします。

 
投稿済 : 26/07/2022 2:35 pm
了
 
(@loos_ryo)
投稿: 1264
メンバー Admin
 

@chihiro

iOSバージョンはいくつですかね?古い場合はアップデートしてみてください。

iOS15.6のiPhone 13 Pro及びiPhone 11 mini のSafariとChromeではやはりこの件は再現できませんでした。

iOSの一部バージョンでの不具合な気がします 🤔 

また、省電力モードになっていると動画が再生されなかったりするのですが、充電が十分にされているかなども念の為にご確認いただければと思います。

This post was modified 2年前 3回 by

SWELL開発者です。

 
投稿済 : 26/07/2022 3:07 pm
山本大介 reacted
es:エス
(@es)
投稿: 26
メンバー
 

今スマホで改めて確認したところ、花の映像に変わってますね。先ほどはキャッシュのせいなのか、山の映像のままでした。
花の映像の方だと、了さんが書かれているように私の環境(iOS15.5)でも問題なく再生されています。
また動画自体にも問題がないように見えています。
もし何度もリロードを繰り返した際に、画面両端が若干にじむように見えることを指しているなら、これは画面サイズにフィットするまでのラグではないかなと。
なお、その現象であればAndroidでも確認できます。
いずれにしても結論としては、SWELL固有の問題ではない、ということになりそうですね。

 
投稿済 : 26/07/2022 4:47 pm
CHILCHIL
(@chihiro)
投稿: 10
メンバー
Topic starter
 

@es

@loos_ryo

ご確認いただき、ありがとうございます。

iosバージョンはiOS15.5での確認でした。

ひとまずテーマではなく、OS側の不具合ではないかとのことで、現象が軽減するよう対策を打ってみます。

迅速なご対応をいただき、ありがとうございました!

 
投稿済 : 27/07/2022 1:32 am
共有: