Привет, дорогие и уважаемые читатели!..

Живая фотография — тема, которая привлекает меня давно. От обычной анимации ее отличает то, что в основу ложится видеофайл, а в итоге получается изображение в формате gif, основная часть которого статична, и лишь некоторые элементы сохраняют движение. Потому и назвали это направление cinemagraph (синемаграф) — симбиоз кино и фотографии. Работы профессиональных мастеров выглядят просто ошеломляюще красиво и загадочно.

Такого эффекта можно добиться не только с помощью Фотошоп, но меня интересует работа именно с ним.

Изучая необычные картинки на разных сайтах, я прочла комментарий, попавший в точку: «Осталось только еще, чтобы в газетах такие печатали — и будет полный Гарри Поттер)«.

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

Сегодня речь пойдет о создании вот такой живой фотографии:

(Да-да, он самый, Гарри Поттер!)

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

Можно импортировать и обрезать видео прямо в Фотошопе, но это не очень удобно, и, к тому же, не все форматы видео Фотошоп распознает. Нужно, чтобы видеофайл имел расширение .mov или .avi. Я выбранный эпизод из фильма вырезала в  Corel Video Studio, он длится 5 сек. (Посмотреть).

Для работы с приложениями Adobe отлично подойдет QuickTime —  проигрыватель и собственный видеоформат Apple. QuickTime — это программа для воспроизведения, конвертирования, оптимизации видео- и аудиоданных для загрузки в Интернет.

Итак, я сохранила пятисекундный ролик в формате с расширением .avi, теперь открываю его в Фотошоп Файл => Открыть (File => Open) (Ctrl+O).

1. Настройка скорости смены кадров и их количества.

В палитре Слои видео представлено одним слоем:

Одновременно с открытием видеофайла должна открыться панель Шкала времени (Timeline), если нет — открываем Окно => Анимация (в CS6 — Шкала времени).

Синим выделен наш слой с видео. Над ним — движок перемотки с красной вертикальной меткой и шкала с номерами кадров. Внизу — сведения о видео: количество кадров — 135 (потому что движок стоит на последнем кадре; эта цифра отображает номер кадра, на котором находится движок), скорость смены кадров — 25 к/сек. 135 кадров — это очень много, ведь каждому кадру будет соответствовать слой, и такой огромный документ будет иметь слишком большой вес. Поэтому следует изменить параметр скорости: в верхнем правом углу Шкалы времени нажмем значок контекстного меню и выберем команду Задать скорость смены кадров.

Откроется окошко со значением 25, поставим 7:

2. Коррекция яркости и контрастности видео.

Часто видео выглядит темным в Фотошопе, поэтому создадим корректировочный слой: нажмем кнопку  и выберем Яркость/ Контрастность.

Я увеличиваю яркость до значения 41. Видим изменения на Шкале времени:

Над слоем с видео появился корректировочный слой, и важнее всего — количество кадров сократилось до 37! (Было бы неплохо еще меньше, а то файл с большим количеством слоев довольно трудно сохранить в формате gif). Теперь можем создавать из видео слои.

3. Создание слоев из видео.

В контекстном меню выбираем: Создать СЛОИ из кадров.

(Увы, особенности перевода иногда заводят в тупик: в моей версии Photoshop это звучит «Объединить кадры в клипы«). После этой команды убедимся, что все сделано правильно: на палитре Слои появилось 37 слоев с названием Кадр n, отобразились эти слои и на Шкале времени.

Исходный слой с видео и корректировочный стали невидимы. Они нам больше не нужны, выделяем оба, зажав Ctrl, и перетаскиваем на значок корзины.

4. Перевод видео в покадровую анимацию.

Теперь можно создавать покадровую анимацию из слоев. В нижнем левом углу Шкалы времени нажмем кнопку в виде трех квадратиков или выберем аналогичную команду в контекстном меню Шкалы времени.

Что изменилось? Вид Шкалы времени. Теперь мы видим один-единственный кадр на линейке покадровой анимации длительностью на весь ролик.

5. Создание отдельных кадров из слоев.

Теперь нужно проделать противоположное действие: если перед этим мы создавали СЛОИ из кадров, то сейчас в контекстном меню находим команду Создать КАДРЫ из слоев.

Наконец  Шкала времени приобретает вид привычной покадровой анимации: вот все наши 38 кадров (37 плюс нулевой).

6. Замена скорости кадра и повторяемости цикла.

Самый первый кадр так и остался длительностью всего ролика — 5,43 сек. Нажатием на треугольник в правой нижней части кадра открою меню выбора времени отображения кадра и поставлю «Без задержки«, т.е. 0 сек., как и в остальных кадрах. Внизу шкалы вместо значения параметра цикла Однократно выбираю Постоянно.

Теперь, если нажать кнопку воспроизведения, мы сможем наблюдать покадровый показ видео, превращенного в анимацию. Такие ролики («гифки») нередко можно увидеть в интернете. Но мы еще не добились основного эффекта синемаграфии: неподвижности фона!

7. Фиксация фона и создание маски.

Из всех кадров нужно выбрать тот, который мы хотели бы зафиксировать — обычно это первый или последний кадр. Мне подходит последний. Если бы мы выбрали первый, то следовало бы перенести соответствующий ему слой (самый нижний) наверх, выше всех слоев, чтобы он заслонил все остальные слои, служа статичным фоном.

Нужно заметить, что один кадр внутри анимации я удалила, поскольку на нем окно выглядело слишком черным. После этого количество кадров уменьшилось: последний стал 37-м. Становлюсь на последний кадр (37) и делаю активным последний слой («Кадр 37″). Как раз в этом кадре соответствующий слой становится видимым. Делаю копию слоя: перетаскиваю его на значок  Новый слой (New Layer).

Слой «Кадр 37″ сделаю временно невидимым, нажав значок глаза слева от него. Находясь на слое «Кадр 37 копия», нажму на кнопку  Добавить маску (Add mask) внизу палитры Слои. Основной цвет должен быть черный, фоновый — белый (чтобы быстро установить эти цвета, достаточно нажать клавишу D). Теперь черным цветом необходимо закрасить те области, в которых будет сохранено движение. В моем случае это  зона окна. Выделяю область окна с помощью инструмента Прямолинейное Лассо (Polygonal Lasso Tool) (L). Значение растушевки на Панели параметров задам 1 пикс. Выделив большую часть окна, удерживаю Shift, чтобы включить режим добавления (Add to selection), и продолжаю выделять маленькие прямоугольники окна. Когда выделение готово, выбираю инструмент Заливка (Paint Bucket Tool) и кликаю по выделению. При этом происходит закрашивание выделенной области черным цветом, а раз мы работали с маской слоя, то помним — черный цвет делает слой невидимым. Выделенная область исчезла:

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

8. Сборка кадров.

 Все еще находясь на последнем кадре анимации, делаем видимым слой Кадр 37 (он под слоем с маской). Тем самым обеспечиваем последнему кадру нормальный, а не «дырявый» вид, а то маска слоя создала пустое окно.

Теперь нужно сделать так, чтобы последний слой (с маской) был видимым во всех кадрах анимации. Становимся на первый кадр на Шкале времени, зажимаем Shift и кликаем предпоследний кадр: все, кроме последнего, кадры теперь выделены синим цветом. Кликаем по значку глаза на последнем слое (с маской), делая его видимым во всех кадрах анимации нашей будущей синемаграфии.

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

9. Сохранение живой фотографии (синемаграфии).

 Остается только сохранить анимацию в формате gif. Для этого идем в Файл => Сохранить для Web (File => Save for Web) (Alt+Shft+Ctrl+S) и выбираем формат файла GIF.

Модель редукции цвета — адаптивная; модель дизеринга — шум. Качество: бикубическая, глаже. (Шум стоит добавлять именно в изображениях, созданных из видео, это сглаживает картинку). Если линейные размеры документа велики, можно их уменьшить в окошках Размер изображения.

Поддерживая анимацию, формат gif, к сожалению, выдает невероятно мало цветов: максимум 256. И,  если при сохранении мы выставим максимальное количество цветов, документ получится очень большим. Мне пришлось оставить 128 цветов. Качество картинки, конечно, снизилось. Рекомендуется перед сохранением тонировать изображение так, чтобы  не было большого разброса в цвете. Я сделала это так: выше всех слоев добавила корректировочный слой Фотофильтр с серым цветом плотностью 50%.

Любуемся полученной живой фотографией!

Это был самый простой вариант синемаграфии, в котором движущийся объект имеет четкие границы и находится постоянно на одном месте. Для создания эффекта движения достаточно добавить маску всего лишь к одному, самому верхнему слою. Такой способ может подойти к вращающемуся колесу, циферблату часов, крыльям мельницы, отражению в витрине, вентилятору . Даже к глазам, которые открываются и закрываются, если только лицо неподвижно. Какие примеры еще придут вам в голову?.. Ах да, белка в колесе! У кого-нибудь есть подходящее видео?)

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

Спасибо за внимание самым стойким, дочитавшим до конца).

Попробуйте создать собственные живые фотографии — это так увлекательно!

Для вдохновения можно посмотреть примеры других работ вот здесь.

Успешной работы!