Как делать видео, чтобы они сами играли и мало весили

Исчерпывающий гайд про видео на ДТФ, чтобы раз и навсегда закрыть этот вопрос. Ничего лишнего, просто рассказываю по шагам, как делаю сам. Гайд в двух вариантах: для Mac и для Windows.

Содержание

Почему можно доверять этому гайду

(заголовок писал прям по заветам инфобизнеса)

Опытным путём я пришёл к тому, что большинство видео в моих статьях весят не больше 3 мб. Вот к примеру папка с гифками для одной статьи:

<i>При этом многие отрывки длятся по 10—20 секунд</i>
При этом многие отрывки длятся по 10—20 секунд

Вот видео из этой же папки взял видео. Оно длится 29 секунд, а весит 1,2 мб, при это качество приличное:

«История двух сестёр» (2003)

Если делаешь видео для превью, то следи, чтобы оно весило не больше 5 мб. Если весит больше, то вряд ли будет автоматически проигрываться в браузере.

Важный момент!

Для некоторых авторов важно, чтобы читатель наслаждался видео в максимально лучшем качестве и с размером минимум 1920 × 1080 px. Поэтому они не парятся с сжатием, размерами и прочим.

Я прекрасно понимаю такой подход, сам был таким. Но сейчас для меня важнее два момента:

1. Читателю комфортно читать мою статью. Комфорт — это когда не нужно жать play, чтобы видео начинало работать. Комфорт — это когда не нужно ждать, чтобы большое видео долго прогружалось. Ради такого комфорта я жертвую качеством финального результата и трачу больше своего времени.

2. В общей ленте мои статьи выделяются среди прочих постов. Я считаю, что анимированные превью выглядят лучше в общей ленте и привлекают внимание. С этим можно поспорить, потому что есть и другие аспекты для «яркой» обёртки (заголовок, лид, сиськи, котики, гослинг и т. п.).

Как делать видео, если у тебя Mac

1. Скачиваешь программу GIPHY Capture — с помощью неё будешь записывать любое творящееся непотребство на экране: геймплей игр, отрывки из фильмов и т. п. Она бесплатная и мало весит. Кстати, видео на превью тоже делал в GIPHY — текст там тоже можно добавлять.

У GIPHY Capture есть ограничение — она записывает не больше 30 секунд. Но так даже лучше, не будет соблазна рожать огромные видосы, которые много весят.

2. Установил? Находишь нужный отрывок, запускаешь программу, захватываешь нужную часть экрана и записываешь отрывок. Сам разберёшься, там элементарно.

<i>С помощью шестерёнки в правом нижнем углу можно настроить горячие клавиши</i>
С помощью шестерёнки в правом нижнем углу можно настроить горячие клавиши

3. Записал? С помощью двух ползунков регулируешь длину получившегося отрывка → ставишь размер 640 px — этого достаточно, чтобы видео занимало колонку дтф-текста в браузере:

<i>Помни, чем больше длина видео, тем больше весит финальное видео</i>
Помни, чем больше длина видео, тем больше весит финальное видео

4. Всё подготовил, всё нравится? Жмёшь SAVE AS... → выбираешь формат .mp4 → сохраняешь своё творение в нужную папку.

Уже где-то здесь можешь посмотреть сколько весит получившееся видео. Если тебя устраивает размер, то шаг №5 тебе не нужен. Но я всегда делаю пятый шаг.

5. Переходишь на сайт по ссылке ниже → закидываешь своё видео → СЖИМАЕШЬ ЭТУ ТВАРЬ ЕЩЁ СИЛЬНЕЕ!

6. Готово! У тебя видео в удобоваримом качестве и небольшого размера. Можешь ставить его на превью, или иллюстрировать им что-нибудь внутри статьи.

«Западный фронт» (2015)
Как делать видео, если у тебя Windows

1. Скачиваешь Movavi Screen Recorder — с помощью неё будешь записывать любое творящееся непотребство на экране: геймплей игр, отрывки из фильмов и т. п.

У Мовави один минус — она платная. Когда-то я её купил за 990 ₽ на распродаже, но сейчас нужно выложить 2190 ₽. Ещё можно сходить на торрент, там всё бесплатно.

2. Установил? Зайди в «Настройки» и сделай как на скриншоте. Дело в том, что Мовави перед записью экрана отсчитывает 3 секунды — это со временем утомляет. Если тебя не утомляет, то всё равно поиграйся с настройками на свой вкус.

Как делать видео, чтобы они сами играли и мало весили

3. Настроил? Находишь нужный отрывок, запускаешь программу, захватываешь нужную часть экрана и записываешь отрывок. Сам разберёшься, там элементарно.

Как делать видео, чтобы они сами играли и мало весили

4. Записал? С помощью «Ножниц» обрезаешь лишнее → жмёшь «Экспорт» — там будешь финалить и выбирать размеры.

<i>Можно отрывок открыть сразу в видеоредакторе Мовави, но у меня его нет</i>
Можно отрывок открыть сразу в видеоредакторе Мовави, но у меня его нет

5. Нажал «Экспорт»? Жми «Дополнительно» → Выбирай во вкладке пользовательское «Разрешение» → меняй на размер в 640 px – этого достаточно, чтобы видео занимало колонку текста:

<i>Остальные настройки не трогаю, хотя может они тоже помогают отвоевать немного веса</i>
Остальные настройки не трогаю, хотя может они тоже помогают отвоевать немного веса

Можно перед экспортом поменять качество видео, двигая ползунок. Жаль, что нельзя посмотреть, как сильно шакалится видео:

<i>Было 5,9 мб, стало 4,6 мб</i>
Было 5,9 мб, стало 4,6 мб

6. Всё подготовил, всё нравится? Жмёшь СОХРАНИТЬ.

Где-то здесь можешь посмотреть сколько весит получившееся видео. Если тебя устраивает размер, то шаг №7 тебе не нужен. Но я всегда делаю седьмой шаг.

7. Переходишь на сайт по ссылке ниже → закидываешь своё видео → СЖИМАЕШЬ ЭТУ ТВАРЬ ЕЩЁ СИЛЬНЕЕ!

8. Готово! У тебя видео в удобоваримом качестве и небольшого размера. Можешь ставить его на превью, или иллюстрировать им что-нибудь внутри статьи.

«Дрянная девчонка» (2001)

А вот для сравнения вес двух одинаковых видео до сжатия и после:

<i>Качество видео при этом хуже не стало</i>
Качество видео при этом хуже не стало

Я рассказал о своём способе создания анимированных картинок. Но есть ещё вариант от Никиты, тоже отличный и рабочий:

P. S. Подписывайся на мой вот этот вот личный ДТФ блог, ну и на или на канал в телеге подписывайся — там тоже про кино :)

С тебя лайк, репост и прочие плюшки :)
568568
11
193 комментария

Умоляю, только не Movavi. Можно я тут со своей секты команду ffmpeg оставлю?

ffmpeg -i "C:/myfolder/video.mp4" -movflags +faststart -c:v libx264 -preset:v veryslow -profile:v baseline -level:v 3.1 -crf 26 -filter:v fps=30,scale=768:432:force_original_aspect_ratio=decrease,pad=768:432:(ow-iw)/2:(oh-ih)/2,setsar=1 -an "C:/myfolder/output.mp4"

^ даст файл который будет весить мало, выглядеть хорошо внутри статьи и на ПК, и на телефоне, с вырезанным звуком, уменьшенным до разрешения 432p с добавлением черных бортов по краям в случае нестандартных разрешений, и проигрываться на практически любом устройстве. Работает из-под командной строки на любой ОС, достаточно cd в директорию вместе с исполнительным файлом или добавить его в path. Качество можно регулировать через -crf, для интернета и 432p субъективно подходящие значения от 21 до 28. Звук можно добавить убрав -an и добавив -c:a aac -ar 44100 -b:a 96k, но современные браузеры отказываются воспроизводить звук в видео, которым проставлен тег автовоспроизведения.

ffmpeg -i "C:/myfolder/video.mp4" -movflags +faststart -c:v libx264 -preset:v veryslow -profile:v baseline -level:v 3.1 -crf 28 -filter:v fps=30 -s 640x480 -an "C:/myfolder/output.mp4"

^ упрощено если уверен в разрешении исходящего файла. Для тех, кому нужно ещё проще, можно попробовать GUI в лице HandBrake.

Для сайтов без продвинутого реактора автозапуск можно вставить через html. Будет выглядеть как "гифка", без элементов управления, с автовоспроизведением и бесконечным повтором:

<video controlslist autoplay muted loop controlslist="nodownload" oncontextmenu="return false;">
<source src="https://example.com/output.mp4"
type="video/mp4">

19

Короче, судя по многочисленным комментариям, все ваши проблемы решит некая ffmpeg https://ffmpeg.org/ — остальное хуйня! Сам не пробовал, так что не ручаюсь, но попробую.

14