Как сделать анимированную обложку для статьи на vc.ru с автозапуском?
В поисках ответа на этот вопрос мы облазили весь интернет. И нашли примерно НИ-ЧЕ-ГО. Анимированные обложки, которые мы загружали к статьям на vc.ru, упорно не хотели воспроизводиться автоматически.
Хотя мы видели, что у некоторых других блогов такой функционал есть.
Тогда мы обратились к техподдержке самой платформы.
На что получили такое сообщение:
При этом наше видео было меньше 20 мб и без звуковой дорожки.
Мы упорно хотели добиться нужного нам результата, поэтому начали экспериментировать.
Изначально ролик был в разрешении 1920x1080, размером 13 МБ, битрейтом в 5000 и длительностью 10 секунд. Вооружившись видео-конвертером, мы выделили несколько гипотез:
1. Разрешение 1080 слишком велико, пробуем 720
2. Длительность в 10 секунд неоправдана, поэтому сокращаем до 5 секунд (изначально элементы в анимации зациклены на 1 и 5 секунд соответственно)
3. Частота 30 кадров в секунду может тоже не устраивать сервис, поэтому приведем их к 15, как в gif-анимации
В результате пункты 1 и 2 сработали. И мы с чувством разгаданной тайны начали адаптировать прошлые обложки, чтобы и они воспроизводились автоматом.
Однако с ними уменьшение разрешения и длительности не помогло.
Тогда мы пришли к выводу, что ключевым параметром является вес видео. Он должен быть не более 3,5 МБ.
В первом случае манипуляции с разрешением и длительностью просто совпали с сокращением его размера. Но когда применили эти гипотезы к другому ролику — уже не попали в нужный размер.
Рецепт идеальной анимированной обложки
В итоге мы оставили разрешение 1080, частоту кадров 50 — для более плавной анимации, при этом длительность сделали не больше 5 секунд, а битрейт — 3000, чтобы картинка не была совсем уж пиксельная.
Берите лайфхак на заметку и пользуйте. Надеемся, что теперь одной загадкой дыры стало меньше.