Как сделать GIF из видео

GIF по-прежнему остаётся общим языком чатов, документации, баг-репортов и файлов README. Они запускаются сами, крутятся бесконечно, не требуют ни плеера, ни клика и показываются там, где видео не принимают вовсе. Подвох — в размере: GIF — формат конца 1980-х с ограничением в 256 цветов и без современного сжатия, поэтому наивная конвертация 20-секундного ролика с телефона легко даёт 50 МБ.

В этом гайде — весь путь целиком: как получить правильный исходный ролик, вырезать нужный момент, выбрать настройки, которые держат файл маленьким, и что делать, если результат всё равно слишком большой.

Решите, нужен ли вам GIF

GIF — правильный выбор, когда адресат принимает только изображения или когда весь смысл в автовоспроизведении без звука:

• Воспроизведение бага, приложенное к тикету или пул-реквесту.
• Короткая демонстрация интерфейса в списке изменений, на вики-странице или в README.
• Ролик-реакция для чата.
• Анимация в письме, где видео не воспроизводится.
• Слайд в презентации, который должен крутиться по кругу без элементов управления.

Для всего, что длиннее примерно 10–15 секунд, где важен звук, или для фонового цикла на собственном сайте короткий MP4 без звука в разы легче и выглядит лучше. Используйте GIF, когда без него не обойтись, а не по привычке.

Шаг 1: получите хороший исходный ролик

Записи экрана

• Windows 11. «Ножницы» записывают экран в MP4. Выделите только нужную область, а не весь монитор: чем меньше область, тем меньше GIF.
• macOS. Нажмите Cmd+Shift+5 и выберите запись выбранной части экрана. Получится файл MOV, который конвертер принимает напрямую.
• iPhone и Android. Запись экрана находится в Пункте управления или в быстрых настройках. Записи попадают в «Фото» или галерею как обычные видео.

Перед записью увеличьте текст, который хотите показать, закройте посторонние уведомления и спрячьте курсор, если он не участвует в демонстрации. Движущийся курсор меняет пиксели в каждом кадре и добавляет вес.

Съёмка на камеру

Держите телефон неподвижно или поставьте его на что-нибудь. Неизменные области кадра в GIF почти ничего не стоят, а тряска в руках заставляет меняться каждый пиксель в каждом кадре. Однотонный фон и ровный свет помогают палитре из 256 цветов.

Шаг 2: вырежьте нужный момент

Ограничение длительности в конвертере всегда отсчитывается от самого начала видео. Если нужный момент в середине, сначала вырежьте его в «Обрезать видео онлайн»: запустите ролик, задайте ползунками начало и конец (шаг 0,1 секунды) и скачайте короткий MP4.

Сокращение длительности — самая большая экономия. Ролику-реакции редко нужно больше 3–5 секунд; демонстрация интерфейса обычно укладывается в 5–10. Если демонстрация по своей природе медленная, например индикатор прогресса, ускорение ролика в Изменить скорость видео перед конвертацией вдвое сократит длительность без потери смысла.

Шаг 3: сконвертируйте

1. Откройте «Конвертировать видео в GIF» и перетащите ролик. Принимаются MP4, MOV (включая записи с iPhone) и WebM до 500 МБ.
2. Выберите частоту кадров: 5, 10, 15 или 20 FPS. Значение по умолчанию 10 подходит для большинства роликов.
3. Выберите ширину: 320, 480, 640 или 800 px. Высота подстраивается автоматически, так что пропорции сохраняются.
4. Задайте максимальную длительность: 5, 10, 15, 30 или 60 секунд, считая от начала ролика.
5. Нажмите «Конвертировать в GIF» и скачайте результат. Откройте его один раз, чтобы проверить зацикливание перед отправкой.

Конвертация выполняется в браузере с помощью FFmpeg, скомпилированного в WebAssembly, поэтому записи экрана с внутренними дашбордами или данными клиентов никуда не загружаются. Она проходит в два прохода: сначала строится палитра из 256 цветов по реальным цветам вашего ролика, затем каждый кадр переводится в эту палитру с дизерингом. Поэтому результат выглядит намного лучше, чем GIF со стандартной веб-палитрой. Звуковая дорожка отбрасывается, а GIF зацикливается бесконечно.

Выбор настроек

Размер GIF растёт примерно пропорционально количеству кадров, умноженному на количество пикселей, поэтому три настройки работают вместе.

Частота кадров

• 5 FPS. Рваное движение, как в кинеографе. Подходит для слайд-шоу и пошаговых кликов в интерфейсе.
• 10 FPS. Достаточно плавно для записей экрана, «говорящих голов» и большинства реакций.
• 15–20 FPS. Только для быстрого движения, например спорта или игр. Файл будет в 1,5–2 раза больше, чем при 10 FPS.

Ширина

• 320 px. Реакции в чатах и мобильные устройства.
• 480 px. Посты в блогах и обычная документация.
• 640–800 px. Записи экрана, где мелкий текст должен оставаться читаемым.

Не выбирайте ширину больше, чем у исходного видео: увеличение добавляет вес, но не добавляет деталей.

Типичные результаты

10-секундный ролик при 480 px и 10 FPS для простого материала вроде записи экрана с плоскими цветами обычно весит несколько мегабайт. Шумная съёмка на камеру с движением может быть в разы тяжелее. Если результат должен уложиться в конкретный лимит, начните с заниженных настроек и повышайте их, только если качество неприемлемо.

Особенности платформ

• Чаты. Многие мессенджеры конвертируют загруженные GIF в собственный формат зацикленного видео, так что файл, который вы потом видите, — не ваш оригинал. Лимиты на загрузку при этом всё равно действуют на то, что вы отправляете.
• Хостинги кода и баг-трекеры. GIF, встроенные в issue и README, воспроизводятся автоматически прямо на странице — поэтому они так популярны в баг-репортах. Действуют лимиты на загрузку изображений, так что делайте демонстрации короткими.
• Почта. Некоторые почтовые программы показывают только первый кадр анимированного GIF. Убедитесь, что первый кадр понятен сам по себе.
• Презентации. Офисные приложения воспроизводят GIF на слайдах. Для длинных или больших анимаций лучше вставить MP4 — так файл останется управляемым.

Если GIF всё ещё слишком большой

Не спешите заново конвертировать в крошечной ширине. Прогоните готовый GIF через «Сжать GIF онлайн»: три его уровня одновременно снижают частоту кадров, размеры и количество цветов, а уровень «Сильное» опускает частоту до 10 FPS, вдвое уменьшает ширину и высоту и сокращает палитру до 64 цветов. Записи экрана с плоскими цветами переносят это хорошо; на фотографиях и градиентах полосатость появляется раньше.

Если видео у вас осталось, вернуться к нему и взять меньшую длительность или 320 px обычно лучше, чем сжимать сильнее. Подробнее о лимитах и компромиссах — в гайде о том, как сделать GIF достаточно лёгким для чата.

Решение проблем

• Конвертация не удаётся или вкладка падает. Длинные ролики при 800 px и 20 FPS могут исчерпать память на телефонах и старых ноутбуках. Обрежьте ролик и уменьшите ширину.
• GIF начинается не с того момента. Ограничение длительности отсчитывается от 0:00. Сначала обрежьте.
• Полосы или зернистый шум на градиентах. Это ограничение в 256 цветов плюс дизеринг. Обрежьте небо и мягкие фоны или выберите вместо GIF короткий MP4.
• Текст не читается. Для записей экрана используйте 640 или 800 px и записывайте меньшую область при большем масштабе.
• Цвета немного не те. Каждый кадр GIF использует палитру максимум из 256 цветов. Оттенки кожи и фирменные цвета могут слегка сместиться — это особенность формата, а не настроек.

Чек-лист

1. Убедитесь, что адресату нужен именно GIF, а не MP4 без звука.
2. Записывайте только нужную область, с устойчивым кадром и без лишнего курсора.
3. Обрежьте до тех 3–10 секунд, которые важны.
4. Сконвертируйте при 10 FPS и 480 px, затем подстройте.
5. Сверьте размер с лимитом адресата; при необходимости сожмите или сократите.
6. Для писем убедитесь, что первый кадр понятен сам по себе.