Вставка изображения в видео

[greenhill]

Привет всем!
Не подскажите как реализовать такое: http://www.tackfilm.se/
А конкретно, вставка в в видео изображение
Очень надо
Спасибо!

[Tails]

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

Просто всё это сделано настолько супер акуратно, что создаёться впечатление будто картинка действительно в "самом видео".

Вижу только такой вариант, и имхо - это задродство :)

[greenhill]

Очень надо реализовать..
Может кто подскажет еще варианты?

[Tails]

а да, и ещё после загрузки, картинка отрисовываеца в битмапу

Добавлено через 2 минуты
greenhill очень врядли есть другие варианты, ну подождём что скажут гуру Флеши :)

[ShockWave512]

да, маску + контейнер для фоты, синхорнизировать с видео, необязательно покадрово, но пока не станет реалистично

- еще есть дикий вариант - рендерить с наложением на видео прям на сервере, и сохранять каждый ролик отдельно, но ресурсы нужны приличные, да и програмить на серваке тяжелее чем в клиенте

[greenhill]

получается я запускаю видео, а поверх него мувик-контейнер, в который будет погружаться фотка?

[Tails]

Нет, это точно - по новай отрендеренное видео, настолько реально наложить блики на фотку - невозможно. Наверн это какаято новая возможность последних флэшэй 4 или 5.

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

[greenhill]

А как его по-новой отрендерить?

[Tails]

greenhill
Рендер прямо на сервере или в самой флеше - для меня из области фантастики :)
ShockWave512
- еще есть дикий вариант - рендерить с наложением на видео прям на сервере, и сохранять каждый ролик отдельно, но ресурсы нужны приличные, да и програмить на серваке тяжелее чем в клиенте
Просветите нас, раскажите поподробнее.

[rainbowrussia]

Почти уверен что это наложение картинки поверх видео + пару слоев сверху. Проверить легко - посмотреть что загружается с сервера после аплоада фотки. Если загружается одно и то же - значит накладывается флешем сверху, если каждый раз разное - значит рендер на сервере. Не вижу ничего сложного наложить флешем поверх видео - надо лишь потратить некоторое время на запись координат + подбор эффектов (шум, тени).
Была еще типа этого флешка - там вводили свое имя и оно появлялось в виде татуировки в видеоклипе.

upd. В пользу версии о наложении говорят файлы из кеша с содержимым типа

...
1402.0 : +854.84, +1090.81
1403.0 : +853.82, +1090.47
1404.0 : +852.79, +1090.13
1405.0 : +851.76, +1089.80
...


а так же XML:


<root>
<frame num="1651">
<blur>2,2</blur>
<vingette>4</vingette>
<color>13,-30,-70,-5</color>
<rgb>0,0,-6</rgb>
<scene>scene1</scene>
<fade>false</fade>
</frame>
<frame num="1964">
<blur>2,2</blur>
<vingette>0</vingette>
<color>0,20,-60,0</color>
<rgb>-6,0,0</rgb>
<scene>scene2</scene>
<fade>false</fade>
</frame>
<frame num="2082">
<blur>0,0</blur>
<vingette>0</vingette>
<color>27,-22,-35,0</color>
<rgb>-13,-6,0</rgb>
<scene>scene3</scene>
<fade>false</fade>
</frame>
<frame num="2157">
<blur>2,2</blur>
<vingette>2</vingette>
<color>5,-40,-62,0</color>
<rgb>0,6,0</rgb>
<scene>scene4</scene>
<fade>false</fade>
</frame>
<frame num="2318">
<blur>2,2</blur>
<vingette>0</vingette>
<color>-27,-2,-52,-7</color>
<rgb>13,0,-19</rgb>
<scene>scene5</scene>
<fade>false</fade>
</frame>
<frame num="2390">
<blur>2,2</blur>
<vingette>0</vingette>
<color>8,5,-70,-37</color>
<rgb>13,0,-19</rgb>
<scene>scene5</scene>
<fade>false</fade>
</frame>
<frame num="2944">
<blur>3,3</blur>
<vingette>8</vingette>
<color>43,-47,-57,0</color>
<rgb>-13,-13,-13</rgb>
<scene>scene7</scene>
<fade>false</fade>
</frame>
<frame num="3003">
<blur>2,3</blur>
<vingette>0</vingette>
<color>45,-62,-55,0</color>
<rgb>0,0,0</rgb>
<scene>scene8</scene>
<fade>false</fade>
</frame>
</root>

[ShockWave512]

Просветите нас, раскажите поподробнее.
если это не ирония/стёб :)

- делаем кодированую анимацию картинки (её движения, допустим хмл с покадровым положением)
- делаем анимированую маску по-верх картинки, чтоб уже с тенями и бликами и прочими эффектами, рендерим с прозрачностью в секвенцию
- делаем сам фон, основное видео (не важно есть там картинка)
- при получении картинки рендерим опять таки с прозрачностью в последовательность (данные о положении берем из первого пункта)
- затем все эти три слоя сводим в одно видео, кодируем под флеш, выдаем клиенту

примерно так
например на С#/ASP.NET - не вижу технических препятствий
пс. про PHP не скажу, но думаю и там на ура можно последовательности png-шек рендерить и склеивать

[Tails]

ShockWave512
спасибо.

rainbowrussia
Тоже почти уверен что это наложение. Почти - пототому, что в кадре где девушка в синей бейсболке едет на машине, и открывает свой бумажник, есть эта фотка, и по ней проходит 100% реалистичный блик, ну вообще некак не похожий на флешный, или отрисованный. Как это сделано ? настолько реально отрисовано от руки и наложено на фотку ? или может поверх контенера есть ещё одно видео, только с прозрачным фоном ? (последовательность пнгэшэк например).

[rainbowrussia]

есть эта фотка, и по ней проходит 100% реалистичный блик, ну вообще некак не похожий на флешный, или отрисованный. Как это сделано ? настолько реально отрисовано от руки и наложено на фотку ? или может поверх контенера есть ещё одно видео, только с прозрачным фоном ? (последовательность пнгэшэк например).

Вариантов масса - ролик с альфой, последовательно png наложеных сверху, как угодно можно сделать. как и в случае с панорамой в соседней теме тут не столько проблема во флеше, сколько в предварительной подготовке материала.

Лично мне ближе вариант flv ролика с альфаканалом, плюс XML с номерами кадров, положением фотки, масштабом, искажениями (геометрия + цвет). Но выуженый оттуда xml склоняет меня к мысли что тут используется flv + swf ролик сверху, в котором сделаны все наложения и на нижний слой грузится фотка.

upd. В общем так оказалось flv внедрено в swf, тени и шумы уже добавлены, альфаканал. Загружается список координат, искажений и тд, и загруженная фотка подставляется под видео в нужные координаты, под нужным углом и с нужным цветоэффектом. На сервере она никак не обрабатывается, а лишь сохраняется для последущего воспроизведения по уникальной ссылке. Вот сам swf - http://qstream-down.qbrick.com/15207/tracker-512-en.swf

[Tails]

rainbowrussia
тогда остался лишь один вопрос - как зделать flv видео с альфа каналом, чтобы потом под него подложить фото ?

[ShockWave512]

ну в Adobe Media Encoder есть птица - кодировать альфа канал, после обеда попробую свести два видео в риалтайме, снизу обычное, сверху с альфой

[rainbowrussia]

rainbowrussia
тогда остался лишь один вопрос - как зделать flv видео с альфа каналом, чтобы потом под него подложить фото ?

Я не большой специалист по части обработки видео, но, думаю, есть два пути. Первый - как в прогнозе погоды - снять видео, заменив место для фотографии на контрастный цвет - ярко зеленый например, ну а дальше в видеоредакторе отметить его как цвет для наложения. Второй - вручную каждый кадр обрабатывать в фоторедакторе, добавляя альфаканал. Я не знаю снимался ли этот ролик специально для этого сайта или взят из какого-то фильма. А уже дальше либо embeded flv с альфаканалом (для первого способо), либо flv + наложение картинки и эффектов поверх.

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

[ShockWave512]

альфа канал делается без проблем
http://oxanaratone.narod.ru/alpha_test/alpha_test.html
http://oxanaratone.narod.ru/a2/alpha_test.html

нижнее HD 720, верхний ролик VP6 Sorenson c включенным альфа каналом
прозрачный считался из Adobe After Effect
оба теста тяжкие, может из-за h264 720p c плотным движением снизу, ну не суть сам факт возможности есть
сори за рыхлые хари на видео

[Tails]

ShockWave512
Ну теперь всё ясно, спасибо, тема раскрыта.