как сделать живую картинку в фотошопе

Синемаграфия – это файл в gif-формате, который сочетает в себе статичную картинку и анимированную деталь. Идея создания этой техники принадлежит фотографам Джейми Бек и Кевину Баргу, которые использовали ее для обработки своих фоторабот в сфере моды и журналистики. В итоге получалась живая картинка, привлекающая пользователей сайтов больше, чем статичное изображение.

Как сделать синемаграфию в фотошопе?

Уроков, как сделать синемаграфию в Adobe Photoshop, есть много, но они все разнятся между собой, и ни один целиком не подошел мне для реализации. Я покажу самый простой и оптимальный способ, который выбрала для себя. Работа велась в фотошопе версии СС 2015.

Последовательность работы:

• Итак, первое – выбираем для начала несложное видео, где можно вырезать кусочек без резких перемещений главного объекта и обилия подвижных дополнительных. Это условие нужно потому, что мы будем работать не над каждым кадром, а в группе. Закачать его с Youtube можно благодаря Savefrom или аналогичным приложениям.

• Открываем фотошоп. Выбираем рабочую среду – Движение и отмечаем в разделе меню Окно пункт Шкала времени, если он не отмечен. На панели нажимаем кнопку в виде ленты – Добавить объект.

•  Вырезаем из видео небольшой кусок (оптимально – 10-30 кадров, то есть достаточным будет фрагмент продолжительностью в 1 секунду).

• Сохраним его для себя: Файл-Экспортировать-Сохранить для WEB.

• Теперь заново открываем его в Adobe. На панели Шкала времени вы сразу же его увидите по кадрам, как и в слоях. “Слой 1” оставляем не тронутым, а остальные группируем (Зажимаем CTRL и выбираем объекты, а затем CTRL+G).

• Сразу же для этой группы применяем маску: Слои-Слой-маска-Скрыть все.
• Объект, который будет подвижным выделяем белым с помощью Кисти (непрозрачность 100%).

• Вверху на вкладке Слои нажимаем клавишу «Унифицировать видимость», в сплывающем окне подтверждаем – «Синхронизировать».

• Теперь, когда мы нажмем на панели Шкала времени клавишу Проиграть, то увидим эффект синемаграфии. Можно сохранять файл для WEB.

Дополнительно

Если нас что-то не устраивает в получившемся синемаграфе, то можете на панели Шкала времени продублировать кадры, сделать их в обратном порядке или задать время продолжительности для каждого кадра. При сохранении файла можно также изменить размер изображения и задать постоянное повторение анимации. Надеюсь, что у вас получилось и вы поняли принцип работы синемаграфии!:)

Читайте также: 

10 распространенных ошибок при работе в Photoshop

Цифровая живопись: текстурные кисти в Adobe Photoshop

Скачайте бесплатную книгу «Photoshop Tips and Tricks»

 

 

 

adobe photoshopgifвеб-дизайнгифкасинемаграфия

Поделиться:

Предыдущая статьяКак правильно кадрировать при съёмке портретов

Следующая статья Почему с творческими людьми иногда бывает сложно

Про автора

как сделать синемаграфию в фотошопе

Главная страница » Elyan Parker: как сделать синемаграфию в фотошопе

От пионера-самоучки до профессионала: поклонник синемаграфа Elyan Parker овладел искусством живой фотографии и теперь собирается делиться своими знаниями с другими фотографами.

Создав ряд знаковых синемаграфов и работая на крупные бренды, Elyan Parker широко известен как пионер жанра. Сегодня француз поставил своей целью поделиться своими знаниями с другими фотографами и помочь им стать опытными синемаграфистами. Чтобы начать обучение своих учеников, Элиан создал набор Photoshop Cinemagraph Kit , который включает в себя то, что он называет «хаками Photoshop» (состоящим из используемых им инструментов и пресетов), видеоуроки и доступ к частной группе поддержки Facebook. Ниже вы можете прочитать интервью с Elyan, в котором он расскажет о своем наборе для создания синемаграфа в в фотошопе и новой для него роли — роли учителя.

Тег video не поддерживается вашим браузером.

Elyan , что вдохновило тебя начать учить других, как делать синемаграфы?

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

Что является основной мотивацией для фотографов в создании cinemagraph?

Elyan Parker: Я думаю, что многие из моих учеников хотят просто попробовать что-то новое! Они видят большой потенциал этого вида фото/видеосъемки, и они хотят быть частью сообщества. Профессиональные фотографы также заинтересованы в совершенствовании своих навыков и возможности предложить их своим клиентам.

Elyan Parker за работой, снимает закат.

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

Elyan Parker: В общем, я думаю, что фотографы должны понимать, что им есть чему поучиться. В нашем динамичном мире вы должны быть вечным студентом, поскольку это единственный способ стать профессионалом. Что касается фотографов, которые хотят делать синемаграфию, редактирование видеоряда в Photoshop — для них это настоящее открытие! Это не сложно, но требует акклиматизации. Для них я специально создал то, что я называю «Cinemagraph Hack». Для создания простейшего Cinemagraph все, что вам нужно сделать, это перенести отснятый материал в Photoshop, и Cinemagraph Hack сделает большую часть работы за вас! Для создания более продвинутых синемаграфий вы можете использовать этот хак вместе с пошаговым руководством.

Если бы вы могли дать только один совет фотографам, которые хотят создавать синемаграфы, что бы это было?

Elyan Parker: Я думаю, что они не должны рассматривать синемаграфию как нечто, угрожающее фотографии, а как умение фотографироваться в 21-м веке. Они должны просто попробовать и повеселиться!

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

Тег video не поддерживается вашим браузером.
Один из самых знаковых синемаграфистов Elyan.

Elyan Parker: Я вижу, как растет количество синемаграфов в Инстаграм. Как все больше людей интересуется — как делать синемаграфию. Когда-то развлечение становится частью цифрового искусства. Я ясно вижу, что это направление развивается. У фотографов будет больше возможностей рассказать историю своими динамичными изображениями. Это может развиться в синемаграф, параллакс или даже в 3D-фотографию. Цифровая фотография станет намного более технически «наворочанной», но откроется дверь в гораздо большее пространство для творчества.

В этом видео Elyan Parker рассказывает о своем комплекте экшнов для создания синемаграфии в программе Adobe Photoshop.

 

Статья создана базе материалов блога синемаграф-коллекции Gallereplay

Как сделать синемаграф в Photoshop и After Effects

Фотографии Джо Гунавана | Fotosiamo.com

Если вы никогда не слышали о синемаграфе, то это неподвижная фотография, в которой есть анимированный элемент. По сути, это анимированные GIF-файлы. Обычно анимация тонкая, но сделанная эффективно, она просто добавляет немного сюрреализма в изображение. Это может даже немного навязчиво видеть неподвижное изображение, внезапно двигающееся, но это часть привлекательности. Это термин, придуманный коллегами-художниками Кевином Бургом и Джейми Беком.

По данным Business Insider, использование синемаграфии в фотографии может становиться все более и более популярным, поскольку мы наблюдаем все большую конвергенцию между пленкой и кадрами. Некоторые коммерческие онлайн-рекламодатели уже добавили синемаграфию в свою рекламу. В этой статье мы покажем вам два отличных видеоролика, которые научат вас создавать синемаграф как в Photoshop, так и в After Effects.

Как сделать синемаграф в Photoshop и After Effects

Если вам интересно, как сделать синемаграф, посмотрите это видео. Это стоит посмотреть.

Другие примеры синемаграфов можно посмотреть здесь:

• Синемаграфы
• Рэйчел Зои в Блумингдейлс

Как создать синемаграф с помощью Photoshop менее чем за минуту

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

Эксперт по Photoshop Говард Пински объясняет, как создавать потрясающие синемаграфы с помощью Photoshop менее чем за минуту:

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

[ОБРАТНАЯ ПЕРЕМОТКА: ГИФТЫ ПОКАЗАНЫ В ГАЛЕРЕЕ СААТЧИ? В НИХ ЕСТЬ БОЛЬШЕ, ЧЕМ ВЫ ДУМАЕТЕ]

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

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

Фотосиамо

Джо — модный и коммерческий фотограф из Лос-Анджелеса, Калифорния. В своих фотографиях он сочетает креативность и резкость с ярким стилем освещения и эмоциями.

Как сделать синемаграф для новичков в Photoshop

Синемаграф — это «больше, чем фотография, но не совсем видео». По крайней мере, так их охарактеризовала супермодель Коко Роша.

Фото Кевина Берга и Джейми Бека

Технически синемаграф — это просто GIF или формат обмена графикой. По сути, это короткий анимированный файл, который в наши дни повсюду в Интернете. Вы, наверное, видели их на Tumblr, Reddit или 4Chan. Может быть, вы даже помните их, когда они взрывались на Myspace (или это только этот парень :).

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

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

Художник-график Кевин Бург и фотограф Джейми Бек придумали термин кинематограф, когда вместе работали над историей для Недели моды в Нью-Йорке. С тех пор этот формат стал довольно популярным. Существует даже ряд приложений и программного обеспечения для мгновенного создания собственного синемаграфа без каких-либо навыков работы с Photoshop (давай, обманывай, если хочешь!). 😉 Однако, если вы хотите индивидуальный внешний вид, вам придется потрудиться.

Прежде чем мы начнем, существует бесчисленное множество способов создания синемаграфов, но это руководство предназначено для тех, кто использует Photoshop с базовыми навыками.

Для начала вам потребуется:

• Штатив
• Видеокамера
• Photoshop (в этом уроке используется CS5 Extended)
• Quicktime Player

Как сделать свой собственный синемаграф: 9 0009

1. Стрелять Ваше видео

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

A. Выберите объект:

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

В этом примере я изолирую кофейную чашку на дороге.

B. Изолировать субъекта:

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

C. Съемка:

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

2. Обрезка

Если вы используете более длинный клип, используйте программу для обрезки отснятого материала, прежде чем открывать его в Photoshop. я использовал Quicktime Player 10.3  , чтобы обрезать, выбрав Правка > Обрезать. Затем я экспортировал отснятый материал с разрешением 1080p , выбрав File > Export > 1080p .

3. Откройте видео в Photoshop

A. Прежде чем импортировать клип в Photoshop, убедитесь, что вы используете рабочее пространство Motion , выбрав Window > Workspace > Motion .

B. Затем   откройте   клип с помощью Файл > Открыть , и он автоматически откроется в  Анимация   Временная шкала .

C. В правом верхнем углу временной шкалы анимации откройте раскрывающееся меню и выберите Параметры документа.  Затем уменьшите частоту кадров до 10–15 кадров в секунду . Я выбрал 12 кадров в секунду для своего. Это поможет предотвратить слишком большой размер файла.

4. Выберите анимированный раздел

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

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

5. Выберите неподвижный момент

A. На шкале времени анимации используйте ползунок, чтобы выбрать кадр, который вы хотите заморозить. Это будет «маска» для вашей анимации.

B. Выбрав кадр, оставьте ползунок там, затем создайте новый слой, выбрав:

•   Выбрать > Все
• Правка > Копировать
• Слой > Создать > Слой
• Правка > Вставить .

C. Назовите этот слой « Still Moment » или как-нибудь еще, что вы запомните. Затем вы заметите этот слой в Layer Widow .

6. Создайте маску

A. Измените Непрозрачность слоя Неподвижный момент на 50% .

B. Используя скруббер и Eraser Tool на слое Still Moment , сотрите область вокруг объекта. По сути, вы создаете дыру в маске, чтобы вы могли смотреть остальную часть анимации.

Для себя я стер все области, где катится чашка, а также стер лицо моей девушки и верхушки деревьев.

7.

Посмотрите свой синемаграф

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

8.  Создать слои из кадров

Вам нужно преобразовать кадры вашего видео в слои. Затем вы продублируете слои и перевернете их, чтобы получилась бесшовная петля.

A. В меню временной шкалы анимации выберите Сведение кадров в слои . Затем проверьте Окно слоев , и вы увидите новый слой для каждого кадра в вашей анимации (и здесь вы увидите, почему важно, чтобы ваши анимации были короткими).

B. Удалить нижний слой с именем Слой 1, , который является слоем с вашим импортированным видео.

C. Выделите каждый слой (кроме первого и последнего; так как анимация будет повторяться, вам не нужно будет дублировать эти слои), затем выберите Слой > Дублировать слои.

D. Переместите все выделенные дублированные слои почти наверх в Окне слоев , но убедитесь, что слой Неподвижный момент находится сверху.

E. Когда все дублированные слои все еще выделены, измените их порядок, выбрав «Слой» > «Упорядочить» > «Обратить».

9. Создание кадров из слоев

Теперь у вас есть все кадры для бесшовного цикла, но вам нужно преобразовать их обратно в кадры и настроить параметры.

A. Откройте меню временной шкалы анимации и выберите Преобразовать в покадровую анимацию.

B. Снова откройте меню Animation Timeline Menu и выберите Make Frames From Layers. Будет создан кадр из каждого слоя.

C. Затем в левом нижнем углу временной шкалы анимации откройте раскрывающееся меню с надписью Once,  и выберите воспроизведение анимации, Forever.

D. Затем выделите все кадры на временной шкале анимации и откройте раскрывающееся меню под каждым кадром и выберите 0,1 секунды .

Совет для продвинутых: для более плавного движения настройте скорость анимации, уменьшив ее начало, середину и конец до 0,2 секунды .

10. Сохраните для Интернета и наслаждайтесь

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

A. Выберите Файл > Сохранить для Интернета и устройств .

A. Выберите GIF в верхнем правом меню.

B. Обязательно установите Colors > 256

.

C. Выберите максимальную ширину  600px .

D. В правом нижнем углу убедитесь, что Forever по-прежнему выбран.