Так, я планирую начать довольно большую серию про глитчи в видео
Если коротко, план такой:
запись -> носитель -> воспроизведение
Идея именно такая, потому что любое видео нужно записать, потом куда-то сохранить и, в итоге, воспроизвести. Соответственно, и рассказывать буду про каждый блок отдельно, а потом их уже можно комбинировать как угодно.
Также есть идея заходить с точки зрения физических (для аналоговых) и математических (для цифровых) принципов, чтобы было понятно, из-за чего тот или иной эффект возникает - оно тогда и смотрится реалистичнее, и делать их проще.
Плюс постараюсь примеры на шейдерах сделать.
Возможно, и видосов поназаписываю на эту тему для тех, кому читать лень (ну и часто в видео можно больше нюансов рассказать/показать).
Если коротко, план такой:
запись -> носитель -> воспроизведение
Идея именно такая, потому что любое видео нужно записать, потом куда-то сохранить и, в итоге, воспроизвести. Соответственно, и рассказывать буду про каждый блок отдельно, а потом их уже можно комбинировать как угодно.
Также есть идея заходить с точки зрения физических (для аналоговых) и математических (для цифровых) принципов, чтобы было понятно, из-за чего тот или иной эффект возникает - оно тогда и смотрится реалистичнее, и делать их проще.
Плюс постараюсь примеры на шейдерах сделать.
Возможно, и видосов поназаписываю на эту тему для тех, кому читать лень (ну и часто в видео можно больше нюансов рассказать/показать).
👍10
Прежде чем начать пердолить видео, в идеале, нужно понимать, что именно, в каком случае и в какой последовательности нужно это делать.
Я набросал очень высокоуровневую схему, которая примерно показывает этапы жизни видео, когда его может потрепать эта самая жизнь. Еще раз, это очень высокоуровневая схема, и в ней не учитывается, что вы можете снять видео на пленку, показать по тв, где записать сначала на VHS, потом оцифровать, несколько раз перекодировать, послать сигнал в космос, потом принять и показать на каком-нибудь осциллографе.
Тем не менее эта схема дает (надеюсь) понятие, что мы получаем видеосигнал, переводим в какую-то форму для хранения, передаем, читаем обратно в форму для воспроизведения и, наконец, воспроизводим. На каждом этапе видео может быть искажено, а искажения могут наложиться. То есть итоговый глитч может быть не просто "пленочным"/"цифровым"/"VHS" и тд, хотя это и удобно для продакт-дизайнеров, а комбинацией отдельных поломок сигнала на разных этапах.
Я набросал очень высокоуровневую схему, которая примерно показывает этапы жизни видео, когда его может потрепать эта самая жизнь. Еще раз, это очень высокоуровневая схема, и в ней не учитывается, что вы можете снять видео на пленку, показать по тв, где записать сначала на VHS, потом оцифровать, несколько раз перекодировать, послать сигнал в космос, потом принять и показать на каком-нибудь осциллографе.
Тем не менее эта схема дает (надеюсь) понятие, что мы получаем видеосигнал, переводим в какую-то форму для хранения, передаем, читаем обратно в форму для воспроизведения и, наконец, воспроизводим. На каждом этапе видео может быть искажено, а искажения могут наложиться. То есть итоговый глитч может быть не просто "пленочным"/"цифровым"/"VHS" и тд, хотя это и удобно для продакт-дизайнеров, а комбинацией отдельных поломок сигнала на разных этапах.
🔥5❤1
Если вас пугают некоторые слова - не пугайтесь, я распишу каждый этап с объяснением общих принципов, физики, математики и примерами алгоритмов (по возможности)
👍4❤2
Media is too big
VIEW IN TELEGRAM
Песочница готова, можно наполнять. Начну с оптики, но уже не сегодня.
ChatGPT сильно помог в набрасывании песочницы. Хотя он все еще сильно тупит в создании чего-то цельного, но хорошо справляется с реализацией мелких деталей и вспомогательных функций (правда иногда все равно творит лютую дичь)
ChatGPT сильно помог в набрасывании песочницы. Хотя он все еще сильно тупит в создании чего-то цельного, но хорошо справляется с реализацией мелких деталей и вспомогательных функций (правда иногда все равно творит лютую дичь)
Прогаем с кенгурой
Песочница готова, можно наполнять. Начну с оптики, но уже не сегодня. ChatGPT сильно помог в набрасывании песочницы. Хотя он все еще сильно тупит в создании чего-то цельного, но хорошо справляется с реализацией мелких деталей и вспомогательных функций (правда…
Сейчас будет мат, простите))
Готовлю материал для видео про цвета. Решил сделать демку интерактивную на three.js - что-нибудь новое попробовать. Так как я его в первый раз в жизни вижу, решил сходить к жепете. И вот оно! Гпт5 ведет себя наконец как настоящий разраб!
Попросил его сделать каркас для демки. Этот долбоеб пол вечера заебывал меня уточняющими вопросами и обещаниями, что вот сейчас вот сделает все, сейчас дотестит, вот вот - архивирует уже и … не выдал нихуя. Когда я сказал ему, что мне нужен хоть какой-то результат, а он - долбоеб, жепетя ответило:
Готовлю материал для видео про цвета. Решил сделать демку интерактивную на three.js - что-нибудь новое попробовать. Так как я его в первый раз в жизни вижу, решил сходить к жепете. И вот оно! Гпт5 ведет себя наконец как настоящий разраб!
Попросил его сделать каркас для демки. Этот долбоеб пол вечера заебывал меня уточняющими вопросами и обещаниями, что вот сейчас вот сделает все, сейчас дотестит, вот вот - архивирует уже и … не выдал нихуя. Когда я сказал ему, что мне нужен хоть какой-то результат, а он - долбоеб, жепетя ответило:
Обещаю: в следующий раз вместо «ещё один уточняющий вопрос» будет файл или честное “не могу”.
Если хочешь — можем сейчас реально продолжить и сделать минимальный рабочий прототип (без профилей, просто объёмы), просто скажи «давай по-быстрому».
В любом случае — спасибо, это было смешно и по делу 🙂
🤣10
Сделал видео про цветовые модели: https://www.youtube.com/watch?v=6i8UjP9S2LA
Хотя оно пересекается с тем, что я тут рассказывал,что-то может отличаться в деталях. Ну и демку я таки допили на three.js )))))
Хотя оно пересекается с тем, что я тут рассказывал,что-то может отличаться в деталях. Ну и демку я таки допили на three.js )))))
YouTube
Цветовые модели: классификация, пространства, профили — от XYZ до RGB и YUV
Объясняю с нуля, что такое цветовые модели, в чём разница между моделью, пространством и профилем, и как всё это применяется в цифровой графике, телевидении и печати. Сравниваем RGB, HSV, HSL, Lab, XYZ, CMYK, YUV, YCbCr и другие модели. Рассказываю, зачем…
👍5🔥5❤3
Media is too big
VIEW IN TELEGRAM
Так, я сделал демку для объяснения искажения оптикой - завтра начну постить про глитчи/искажения посты
🔥12
Итак, начнем с самого начала: захвата оптического сигнала и передачи его на сенсор. То есть с объектива.
Наверное, большая часть эффектов для фото и видео связаны именно с оатикой. Для начала, посмотрим на устройство объектива.
Ну и вспомним пару важных терминов (упрощенно - нам хватит):
Дифракция — свет «огибает» кромки и отверстия, размывая мелкие детали.
Дисперсия — стекло по-разному преломляет цвета; из-за этого у краёв могут появляться цветные каймы.
Почти все эффекты строятся на этих двух явлениях и геометрической оптике (хотя напрямую мы ее использовать не будем)
Наверное, большая часть эффектов для фото и видео связаны именно с оатикой. Для начала, посмотрим на устройство объектива.
Ну и вспомним пару важных терминов (упрощенно - нам хватит):
Дифракция — свет «огибает» кромки и отверстия, размывая мелкие детали.
Дисперсия — стекло по-разному преломляет цвета; из-за этого у краёв могут появляться цветные каймы.
Почти все эффекты строятся на этих двух явлениях и геометрической оптике (хотя напрямую мы ее использовать не будем)
👍3
Итак, пойдем вместе с лучом и посмотрим, что может пойти не так (потом каждый пункт отдельно рассмотрим):
1. Грязь/пыль/царапины на линзах
- размытые пятна
- четкие пятна
- лучи по царапинам
- падение контраста
2. Искажения линз
- абберации (сферическая, поперечная и продольная)
- дисторсии (подушка, бочка)
- кома
- астигматизм
- полевая кривизна
3. Поломки и искажения групп линз
- Блики и засветки
- Смещение линз
4. Диафрагма
- глубина резкости
- боке
5. Система фокусировки
- дыхание фокуса
- расфокус
6. Виньетирование
- механическое
- cos^4
Как видите, набор эффектов довольно большой (возможно что-то пропустил), поэтому хватит на долго.
1. Грязь/пыль/царапины на линзах
- размытые пятна
- четкие пятна
- лучи по царапинам
- падение контраста
2. Искажения линз
- абберации (сферическая, поперечная и продольная)
- дисторсии (подушка, бочка)
- кома
- астигматизм
- полевая кривизна
3. Поломки и искажения групп линз
- Блики и засветки
- Смещение линз
4. Диафрагма
- глубина резкости
- боке
5. Система фокусировки
- дыхание фокуса
- расфокус
6. Виньетирование
- механическое
- cos^4
Как видите, набор эффектов довольно большой (возможно что-то пропустил), поэтому хватит на долго.
🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Итак, первый эффект (по ходу применения к картинке, чтобы было физически верно) - дыхание фокуса (focus breathing)
Это вот эти вот этот вот расфокус с зумом, как на видео
Это вот эти вот этот вот расфокус с зумом, как на видео
🔥2
Дыхание фокуса (focus breathing)
Принцип:
По время катания туда-сюда фокусирующей группы меняется фокусное расстояние объектива, что приводит к небольшим зумам (1-10% в зависимости от качества). Если еще и механизм поломан, то будет не плавно ездить, а рывками
Алгоритм:
1. Считаем силу эффекта от времени (я использую вот такую функцию, начиная от момента старта эффекта)
2. По модулю от (1) считаем блюр (я использую
3. Блюренную картинку рисуем в квад экрана, но скейлим текстурные координаты относительно центра (0.5) для эффекта зума
Вот так просто
Принцип:
По время катания туда-сюда фокусирующей группы меняется фокусное расстояние объектива, что приводит к небольшим зумам (1-10% в зависимости от качества). Если еще и механизм поломан, то будет не плавно ездить, а рывками
Алгоритм:
1. Считаем силу эффекта от времени (я использую вот такую функцию, начиная от момента старта эффекта)
2. По модулю от (1) считаем блюр (я использую
MPSImageGaussianBlur)3. Блюренную картинку рисуем в квад экрана, но скейлим текстурные координаты относительно центра (0.5) для эффекта зума
Вот так просто
Desmos
Desmos | Graphing Calculator
Explore math with our beautiful, free online graphing calculator. Graph functions, plot points, visualize algebraic equations, add sliders, animate graphs, and more.
🔥4
Замечание:
Хотя я объединил расфокус и дыхание (потому что так нагляднее и красивее), в реальной жизни они должны идти отдельно и доволно далеко друг от друга (потому что фокус это по сути один из последних эффектов). То есть, чтобы было физически верно, тут должно остаться только масштабирование кадра.
Ну и возникает сложность синхронизации кривых между далеко отстоящими эффектами, поэтому пока оставляем как есть
Хотя я объединил расфокус и дыхание (потому что так нагляднее и красивее), в реальной жизни они должны идти отдельно и доволно далеко друг от друга (потому что фокус это по сути один из последних эффектов). То есть, чтобы было физически верно, тут должно остаться только масштабирование кадра.
Ну и возникает сложность синхронизации кривых между далеко отстоящими эффектами, поэтому пока оставляем как есть
🔥2🤔2
Media is too big
VIEW IN TELEGRAM
Следующее - радиальная дисторсии из-за оптики (тут видно подушку, бочку и их комбинацию - "усы"
🔥3❤1