Эффект выключения телевизора — это анимация, при которой изображение резко сжимается в тонкую горизонтальную линию и гаснет, имитируя отключение старого лампового экрана. Чтобы его сделать, нужно определиться с инструментом: в видеоредакторах вроде Adobe Premiere Pro или After Effects эффект строится на масштабировании по вертикали, а на веб-странице — на CSS-свойстве transform.

Ниже разберём оба подхода: создание эффекта при монтаже видео и реализацию на сайте с помощью кода. Отдельно рассмотрим готовые пресеты и типичные ошибки, из-за которых анимация выглядит неестественно.

Из чего состоит эффект выключения ТВ

Классическая анимация отключения кинескопа состоит из трёх фаз. Сначала картинка быстро сжимается по вертикали до узкой светлой полосы. Затем полоса сжимается по горизонтали в точку. В финале точка гаснет — экран становится чёрным.

Именно последовательность фаз создаёт узнаваемый «телевизионный» характер. Если просто уменьшить масштаб кадра до нуля, получится обычный зум, а не эффект выключения. Поэтому ключевой параметр здесь — непропорциональное масштабирование: вертикаль и горизонталь анимируются раздельно и с разной скоростью.

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

💡

Эффект выключения ТВ = сжатие по вертикали → сжатие по горизонтали → затухание. Анимируйте оси раздельно, иначе получится обычный зум.