仕事で使えるスクリーンショット(6) ページのロードのgifアニメを撮る スマートフォン編
これの続きです。
前回はページのロードを撮りましたが、スマートフォンの場合は縦に長いのでファーストビューしか撮ることができません。それを何とかする技です。
Chormeのデベロッパーツールでスマートフォンの表示にして、左上のデバイスを選ぶところで "Responsive" にして、高さを十分に高くします。今回は高さ3200で、そのために倍率が19%になっています。
その後は、前回の手順どおりTimelineのScreenshotsをチェックしてからリロードして、右クリックで保存して、ここで変換するだけです。
ちょっとぼんやりしますが、ページ全体のロードを見るという用途には十分使えると思います。よーく見ていると、一通りページのレンダリングが終わった後に追加されるDOMがあったりして、裏の動きが何となくわかってきますね。