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

От пионера-самоучки до профессионала: поклонник синемаграфа 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 — CG Magazine

Без сомнений, вы уже встречались с синемаграфами в сети – раз войдя в неё, они не оставили равнодушными пользователей со всего мира. Иллюзия «живой» фотографии была впервые освоена Джейми Бек и Кэвином Баргом совсем недавно – в начале 2011-го, и с тех пор активно используется в индустрии моды и новостей. Секрет «живой фотографии» — в создании идеально зацикленного GIF-файла, для чего нам понадобится Photoshop с функцией Quicktime.

Так выглядит обычное фото:

А так — синемаграф:

Лучшие примеры синемаграфов можно найти на сайте их создателей, они сделаны для New York Fashion Week и выглядят естественно для фотографий — это запечатленный момент. Но не простой, а запечатленный во времени, и повторяющийся бесконечное число раз.

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

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

• Используйте штатив. Фон сцены должен оставаться неподвижным, чтобы синемаграф получился синемаграфом.
• Выберите такое движение, которое бы представляло длительное зацикленное действие. Идеальный синемаграф, наверное, снимался бы на эскалаторе метро. Потому что это размеренно, последовательно и предсказуемо.
• Определитесь с интенсивностью. Иногда цикл с неожиданным действием способен впечатлить больше, чем размеренное движение. Например, анимация резко колыхнувшейся травы, или моргание продолжительно неподвижного взгляда – это действительно эффектно.

Вы всегда можете поиграть с фото, сделанными последовательно. Или с раскадровкой какого-нибудь видео. Я взял кадры с VideoHive. Мне захотелось оживить отражение девчонки с платьем в зеркале, как будто она мысленно решает: идёт ей красный или не идёт?

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

Открываю Photoshop и делаю вот что: Файл > Импортировать > Кадры видео в слои. Выбираем «с начала до конца» и «покадровую анимацию». Пользователям Mac будет полезна эта ссылка.

Каждый кадр изображения будет импортирован как отдельный слой. Некоторые сложные синемаграфы создаются тщательной обработкой каждого кадра, но для нас сойдет работа с группой изображений – в которую не войдет первый кадр, – под одним слоем.

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

Откройте окошко анимации, чтобы видеть последовательность кадров. Сейчас у 99% кадров прозрачный фон благодаря маске слоя, чтобы исправить это, щелкните на первый кадр и включите «видимость выравнивания слоев для первого слоя».

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

…и расположить их сразу после существующей.

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

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

Я «замедляю» девушку при повороте в каждую сторону, чтобы её движение выглядело естественней.

Немного балуюсь с эффектами – хочу создать ретро-тон, потому что это сейчас модно. Ну а еще нужно же учесть ограничение: в палитре GIF-файлов всего 256 цветов. Я тяну слайдер синего тона теней на максимальные 100%, выключаю эффект светимости.

Средние тона – чуть больше голубого и розового.

Света – чуть больше красного, зеленого и синего.

Теперь я добавляю корректирующий слой карты градиента. И настраиваю цвета между темно-синим (#020413), голубоватым (#2b4a61), зеленым (#a8c6a0) и бледно-желтым (#feffe6). Меняем режим слоя на осветляющий.

Увеличиваем контраст корректирующего слоя с помощью кривой.

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

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

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

Синемаграфия. Как создать «Живую фотографию»?

Синемаграфия. Как создать «Живую фотографию»?

Эта краткая статья раскажет о том что такое Синемаграфия, а также вы узнаете  «Как создать Живую Фотографию?». Для начала посмотрите несколько интересных работ по синематографии:

Термин Синематографии  (от англ. «cinemagraph» = cinema + photograph)

ввела молодая американская пара. Он графический художник она модель, фотограф,  стилист. В начале 2011 года в своём блоге From Me To You они ввели новый термин для обозначения анимированной фотографии, который быстро вошел в обиход интернет сообщества.

Синематография – эта анимированная фотография, в которой присутсвуют элементы движения, привнося в обычную фотографию больше содержания и привлекательность. Цель этой техники — обратить внимание на некоторые аспекты образа с помощью локальной анимации. «Живая фотография» — это обычный файл в формате GIF, который создается из заранее отснятого видео или серии фотоснимков, используя программное обеспечение типа

Adobe Photoshop или After Effects. Редактируемый видеоролик или серия снимков преобразуется в последовательный цикл кадров так, что движение объекта кажется бесконечным.

Как сделать живую фотографию, вы можете узнать из видео ниже. Весь процесс можно сделать при помощи двух программ After Effects и Adobe Photoshop, однако автор данного видео предлагает еще одну программу, для подготовки исходного файла. Также мы рекомендуем, ознакомится с DVD обучающими дисками, которые дадут мощный толчок вашему развитию в этих программах.

DVD обучающий диск After Effects

DVD обучающий диск Adobe Photoshop

Добавить комментарий

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

Синемаграф «более чем фотография, но не совсем видео.» Такое определение дала синемаграфу канадская супермодель Коко Роша. Технически, синемаграф просто GIF или формат для обмена изображениями. В принципе, его называют в простонародье анимированным файлом, который весьма распространен в Интернете. Вы, наверняка видели эти картинки с элементами движения на разных сайтах.

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

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

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

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

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

1. Создание вашего видео

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

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

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

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

2. Обрезать

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

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

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

B. Тогда,  открывая  свой клип с File> Open , он будет автоматически открыт в анимации  временной шкалы.

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

4.Выберите раздел Animated

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

Б. Откройте  меню Animation Timeline, а затем выберите Trim Document Duration to Work Area . Это позволит избавиться от дополнительного метража, таким образом вы сможете сосредоточиться на разделе, который вы хотите оживить.

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

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

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

• Select > All
• Edit > Copy
• Layer> New> Layer
• Edit> Paste.

С. Назовите этот слой » Still Moment  «или как вам удобно. Затем вы заметите этот слой в слое Widow.

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

А. Изменените непрозрачность  слоя  Still Moment  на 50%.

Б. Использование скруббера и Eraser Tool на слое Still Moment. Сотрите все вокруг вашей темы. Вы, по сути, создаете отверстие в маске, так что вы можете досмотреть анимацию.
На нашем видео стираем область, где есть чашка, также стираются лица некоторых людей в отдалении и верхушки деревьев.

7.Смотрите Ваш синемаграф

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

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

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

А. В меню Анимация Timeline , выберите Flatten Frames Into Layers . Затем проверьте  окно Layer , и вы увидите новый слой для каждого кадра в анимации (и здесь вы увидите, почему это важно, чтобы ваши анимации были короткими).

Б. Удалите нижний слой с именем Layer 1, который является слоем с импортированного видео.

С. Выделите все слои (кроме первой и последней, так как анимация цикличной, вам не нужно дублировать те слои), затем выберите  Layer> Duplicate Layers.

Д. Переместите все выделенные дублированные слои почти до вершины в окне Layer , пока убедитесь, что   слой Still Moment находится выше всех.

Е. При выделении всех дублированные слоев в обратном порядке, выберите Layer > Arrange > Reverse.

9.Сделайте кадры из слоев

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

А. Откройте меню Animation Timeline  и выберите Convert to Frame Animation.

Б. Вновь открыть меню Animation Timeline и выберите Make Frames From Layers . Это сделает кадр из каждого слоя.

C. В нижнем левом углу  Animation Timeline  , откройте выпадающее меню, которое читает Once ,  и выберите, чтобы проигрывать анимацию  Forever.

Д. Затем выделите все кадры в  Animation Timeline  и откройте выпадающее меню ниже каждого кадра, выберите 0,1 секунды.

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

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

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

• Выберите File > Save for the Web & Devices
• Выберите GIF в правом верхнем меню
• Обязательно установите  цвета> 256
• Выберите ширину на максимум  600px
• В правом нижнем углу, убедитесь, что  Forever  по-прежнему выбран
• Затем нажмите Save  и наслаждайтесь вашей новой синемаграфией

Живая фотография — уроки фотошоп

Урок по созданию «живых» фотографий

Сейчас довольно популярны так называемые «живые» фотографии — синематографии, где часть изображения, словно живая — движется. Действительно, довольно красивые результаты можно получить, если правильно подобрать объект анимации.

Для сообщества 30_day_photo (где одним из заданий является создание как раз такой «живой» фотографии) я написала урок. Очень старалась писать подробно — так, чтобы даже новичок, недавно познакомившийся с фотошопом, сумел создать свою собственную синематографию.

Сначала, вдохновения ради, предлагаю вам посмотреть несколько чудесных «живых» снимков!

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

Итак, что же такое синематография?

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

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

1) Из каждого кадра вырезать область, которая должна двигаться на фото, а остальное — удалить, оставив лишь один кадр невредимым — он и станет фоном для всей анимации. Допустим, вы анимируете то же моргание человека. У вас, скажем, 10 кадров на который человек моргает.В 9-ти из 10-ти кадров вы удалите все, кроме глаз.

10-й кадр будет фоном, его мы расположим под остальными. Фон будет видно всегда, а вот кадры с морганием будут попеременно сменять друг друга.2) Все кадры оставляем невредимыми, кроме одного — в нем вырезаем «дырку» в том месте, где хотим видеть движение, и располагаем его выше других.

Допустим, в том же примере с морганием, мы берем один из 10 кадров и удаляем на изображении глазницы (жутковато :))). Перед нами картинка, у которой нет глаз — это фон. Зато через эту «дырку» можно видеть кадры, расположенные под фоном. Фон остается на месте все время, а кадры сменяют друг друга.

Возможно звучит все это немного заморочено, но на деле все окажется простым, вот увидите :)В своем практическом примере я буду разбирать второй случай, мне так удобнее. Но вам может показаться удобнее первый, поэтому не сбрасывайте его со счетов 🙂

Откуда взять эти самые кадры для анимации?

Откуда же взять эти самые кадры, из которых нужно что-то вырезать?Опять же — есть два варианта — можно использовать для создания синематографии видео (снятое самостоятельно, или готовое, взятое из сети), а можно — ряд фотографий.

В первом случае вам нужно будет снять или найти подходящее видео, а потом придется пользоваться специальной программой (или ставить дополнительные кодеки для ФШ) для того, чтобы сохранить часть из этого видео как набор скриншотов, кадров, которые мы в последствии сможем использовать.

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

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

Что именно фотографировать/снимать на видео?

Сложность синематографий в их оптимизации, ведь формат gif, поддерживающий анимацию, может содержать в себе не больше 256 цветов (считаются все оттенки!). Отсюда первое правило создания «живого» снимка:

Правило №1. Не выбирайте объектом вашей анимации предметы ярких насыщенных цветов.

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

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

Человек открыл глаза — человек закрыл глаза. Листик на ветке качнулся и вернулся обратно. Или же ваш объект должен изначально отсутствовать в кадре, потом появляться, а потом снова исчезать. Например, таракан, пробегающий по столу раз за разом. Или капля воды, падающая из крана вниз.

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

Правило №3. Берите маленький движущийся объект (небольшую область анимации). С большим сложнее работать — легче допустить ошибку при съемке. К тому же анимация большого объекта будет немало «весить».

А какой смысл живой фотографии, если ее нельзя никому показать?

Итак, мы с вами обсудили теорию создания синематографии. Переходим к практике 🙂

Этап 1. Фотографируем.

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

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

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

Этот режим означает, что, зажав кнопку съемки, вы сделаете не один кадр, а сразу много — фотоаппарат будет снимать, пока вы не отпустите кнопку (или пока не закончится флешка :))Скорость съемки напрямую зависит от того, какая именно у вас камера.

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

Сколько именно снимков — вы легко выясните, приступив к практике. Конечно, чем дольше длится движение вашего объекта — тем больше кадров вам нужно сделать. Вентилятор делает поворот вокруг своей оси довольно быстро, поэтому мне хватило 30 кадров (и то — при обработке мы часть дублей удалим, чтобы уменьшить вес нашей анимации).

Этап 2. Работаем с получившимся материалом.

Я работаю в фотошопе версии Cs2 и Cs5 (оба — на английском языке), урок буду писать, пользуясь 5 версией. В принципе в новой версии не появилось ничего уникального, связанного с анимацией, но некоторые команды изменили свое расположение.

Поэтому спрашивайте, если что :)Найдите начало и конец движения, в нашем случае — когда вентилятор сделал полный круг. Все кадры после этого можно удалить.Как правило, после двух этих действий у вас останется немного кадров — 10-30.

Перетащите все снимки в один файл — один слой над другим, в том порядке, в котором вы их снимали. Нижним слоем получится начало движения, наверху — конец.

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

Теперь перейдите в режим быстрой маски — кнопка для перехода в этот режим находится внизу панели инструментов:После этого возьмите инструмент «Brush tool» (кисть) и закрасьте с его помощью ту область, где нужно сделать дырку.

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

Для этого щелкнем по кнопке «Add vector mask» на панели «Layers» (Слои):И вы увидите, что около вашего слоя появилась маска с черной областью — это и есть дырка, через которую мы будем видеть слои, расположенные под нашим «фоном»:

Важно: Напоминаю, что я использую этот способ (делаю дырку-маску в самом верхнем слое, а остальные оставляю нетронутыми) потому, что он удобен лично мне, и хорошо подходит для этого конкретного случая, когда вентилятор крутится всегда в одной и той же области, по кругу.Здесь мы сразу видим область, в которой будет происходить анимация. Но бывает и иначе.Когда необходимо сделать более аккуратные выделения (например у нас анимация человека в толпе, и мы не хотим, чтобы другие люди двигались), то удобнее пользоваться вторым способом, который я описывала выше — фон, который останется нетронутым, размещать под всеми остальными слоями. А к ним, в свою очередь, (к каждому слою!) дорисовывать маску нужной формы.

Если этот момент непонятен кому-то — напишите, я могу дописать урок, приведя конкретные практические примеры.

Для этого откроем панель «Animation» (Анимация) с помощью команды «Window — Animation».Панель выглядит вот так:Сейчас перед вами только один кадр — значит анимации нет.Прежде всего нам нужно создать другие кадры. Кадров должно быть столько же, сколько у вас слоев (за исключением фона с маской). У меня 8 слоев, поэтому я должна создать еще 7 кадров.

Это делается с помощью кнопки «Duplicate selected frames» (дублировать выделенные кадры):Я нажала 7 раз на эту кнопку, и вот все мои 8 кадров:Сейчас они все выглядят одинаково, ничего не меняется от кадра к кадру.Нам необходимо выставить правильную видимость слоев для каждого кадра.На всех кадрах должен быть виден наш фон-верхний слой один из оставшихся кадров.Т.

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

Выделите все кадры с помощью кнопок Shift или Ctrl на клавиатуре и из выпадающего списа выберите нужное значение:Я выбрала 0,1 секунды. No delay — значит без остановки.Вот и все! Анимация готова :)Т.е. занимаемся украшательствами 🙂 Этот шаг необязательный в создании синематографии, но совсем без обработки не делается практически ни одно фото.

На моей картинке явно не хватает света. И еще хотелось бы подправить цвета.

Я создаю два корректирующих слоя (убедитесь, что при этой вы находитесь на первой кадре анимации! действия, сделанные на первом кадре анимации — будут распространяться и на все остальные кадры) — Selective color (редактирование цветов) и Curves (кривые) с помощью кнопки «Create new fill or adjustments layer» (создать новую заливку или корректирующий слой), которая находится внизу на панели «Layers» (Слои):Получаем вот такой красивый результат:С помощью команды «Image — Image Size» (Изображение — размер изображения) уменьшаем нашу синематографию до нужный размеров. Я выбрала размер 700 по большой стороне.Для этого пользуемся командой «File — Save for Web & Devises» (Файл — Сохранить для Веб и устройств).В появившемся окне нам предлагают выбрать настройки оптимизации формата gif. Как я и говорила ранее, в формате gif лишь 256 цветов, поэтому качество изображения непременно пострадает, это неизбежно. В каких-то случаях это видно не сильно, в каких-то — довольно заметно. Именно поэтому я давала советы по выбору исходника по цветам.Расписывать все настройки оптимизации я не возьмусь — это материал для отдельного большого урока, извините 🙂 Но, меняя настройки, вы сами сможете увидеть, что лучше в вашем случае — все изменения будут отображаться на превью слева.Покажу лишь какие настройки выставила я:После этого жмете «Save», даете имя, и ваша «живая» фотография готова!Чем лучше вы продумаете свою синематографию, чем тщательнее выберите объект анимации, чем аккуратнее снимете — тем лучше получится результат.Важно: Мы создали синематографию с помощью серийной съемки. Но не у всех фотоаппаратов есть возможность делать быструю серийную съемку. Да и не всегда этот способ удобен. Помните, что вы можете также снимать видео! При съемке видео обязательно ставьте видеокамеру/фотоаппарат на штатив. И не делайте длинных роликов (не больше 10-20 секунд), иначе замучаетесь удалять ненужные кадры.Получившийся ролик необходимо разобрать на кадры, которые потом вы сможете, словно серийную съемку, с которой мы работали, превратить в анимацию. В последних версиях фотошопа есть возможность разложения видео на кадры-слои, это очень удобно. Команда звучит как «Fшle — Import — Video Frames to Layers»(Файл — импорт — Видео кадры как слои). У кого фотошоп старых версий — придется воспользоваться Adobe Image Ready, или сторонней программой для сохранения скриншотов из фильмов.Если кому-то будет интересен данный способ создания синематографий — напишите, я расскажу.

Творческих успехов вам!

Источник: https://sunny-alison.livejournal.com/76598.html

Синемаграфия: как сделать живую картинку в Photoshop

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Источник: http://say-hi.me/design/sinemagrafiya-kak-sdelat-zhivuyu-kartinku-v-photoshop.html

Техника Cinemagraph — оживляем фотографию

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

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

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

Cinemagraph — гибрид фото и видео

Ludmila Vilarinhos / Foter / CC BY

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

Такие фотоизображения чем-то напоминают обычную анимацию, сделанную с помощью использования формата растрового изображения GIF. Как известно, гифки делают возможным визуализацию любого движения. Подобная техника анимации на самом деле появилась еще в конце 80-х годов.

Однако в случае с GIF-анимацией мы имеем дело, как правило, с достаточно неровными, резкими движениями.

Cinemagraph же создает плавное, волшебное движение, благодаря которому картинка буквально «оживает» на глазах. Зритель, глядя на фотографию, выполненную с помощью техники Cinemagraph, сразу же концентрирует свое внимание на движущейся области. Это дает возможность фотографу акцентировать внимание людей на определенной детали картинки.

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

Сегодня этот тандем создает невероятно красивые и сложные фотоизображения в технике Cinemagraph.

Впрочем, очевидно, что в самой технике создания «живых» картинок нет ничего нового – мастера графики применяют подобные приемы уже на протяжении многих лет.

Однако благодаря Интернету Cinemagraph стала достоянием широкой общественности, и оригинальная идея «движущихся» изображений заинтересовала многих простых любителей фотографии.

Ведь данная техника способна оживить скучные фотографии, сделав их более динамичными и реалистичными в глазах зрителя. Использование техники Cinemagraph может пригодиться для того, чтобы немного «оживить» пейзажные фотографии, портретные и групповые снимки.

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

Как сделать Cinemagraph в фотошопе

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

mendhak / Foter / CC BY-SA

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

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

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

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

1. Устанавливаем камеру на штатив и запускаем видеосъемку сцены. Убедитесь в том, что штатив установлен на твердой поверхности, чтобы исключить малейшие колебания фотоаппарата. Нужен качественный, короткий видеоролик примерно на десять – тридцать секунд. Для получения нормальной детализации и хорошего качества снимать лучше всего в формате 1080p с частотой 25 кадров в секунду. Отснятые видеофайлы должны быть формата MOV или AVI, чтобы их можно было без проблем в дальнейшем открыть в редакторе.

1. Открываем видеофайл в фотошопе (Import > Video Frames to Layers). Здесь Вам предлагается импортировать весь файл на кадры или только выбранную часть видеоролика. Чтобы не слишком загружать свой компьютер, лучше выбрать второй вариант и в дальнейшем вырезать именно тот момент, когда происходит интересующее Вас движение.

moniqca / Foter / CC BY-ND

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

1. Следующий этап – работа со слоями. В урезанном Вами файле выберите слой, который будет обозначать статичные детали будущей «живой» фотографии. Следует продублировать этот слой и разместить поверх всех остальных. Вы будет редактировать этот базовый слой, чтобы выделить движение посредством векторной маски. То есть Вам необходимо «замаскировать» те элементы, которые будут двигаться на фотоизображении в соответствии с Вашим замыслом. Например, можно маскировать волосы модели или листья деревьев – все зависит от того, что Вы придумали в начале. Теперь нужно протестировать, что получилось на Вашем базовом слое, с помощью окна анимации. Тут Вы можете заметить отдельные недостатки движения и те изменения, которые нужно будет сделать в слоях, чтобы добиться более реалистичного или динамичного эффекта.

1. Наиболее типичная проблема при создании подобных анимированных фотоизображений – это не самое плавное движение. Вам, вероятно, нужно будет поэкспериментировать с кадрами и слоями, чтобы сделать движение на итоговой картинке плавным. Выделите все кадры, скопируйте и вставьте их после оригинальных. Далее в меню анимации используйте опцию Reverse frame. Сглаживание перехода также можно достичь путем обратного кадрирования с временной задержкой на первом и последнем кадрах. Собственно, плавный переход и является той особенностью, которая отличает Cinemagraph от обычной анимации.

1. На этом Ваша работа не закончена. В фотошопе можно немного поработать с цветами, поиграть с корректирующей маской. Дело в том, что при преобразовании файла в GIF наполненные ярким цветом кадры могут немножко поблекнуть. Чтобы этого не случилось, желательно применить различные color-processing эффекты для всех слоев. Если Вы собираетесь опубликовать итоговую картинку на каком-либо веб-ресурсе, то, возможно придется несколько уменьшить размер изображения (Image > Image Size), поскольку многие сайты не очень дружны с файлами GIF значительного объема. После этого Вы уже готовы сохранить анимированное изображение в GIF. На выходе у Вас получается оригинальное «ожившее» фото.

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

Сегодня существуют специальные программы для создания фотографий с эффектом движения, которые существенно упрощают весь процесс. Например, программа  Cinemagraph Pro.

«Живые» фотографии – действительно очень интересная техника, которая уже успела очаровать многих. Во всяком случае, на просторах Интернета появляется все больше фотоизображений с подвижным объектом или областью.

Вы также можете попробовать свои силы в этом активно развивающемся жанре.

Источник: http://www.fotokomok.ru/texnika-cinemagraph-ozhivlyaem-fotografiyu/

Живая фотография

Сегодня мы попробуем немного преобразить какую-нибудь фотографию. А именно сделаем более живой. Урок очень простой и думаю он ни у кого не вызовет трудностей. Основывается урок на использовании инструмента Pen Tool (Перо) либо Polygonal Lasso Tool (Полигональное лассо) плюс несколько несложных операций. Итак приступим.

Шаг 1

Выбираем исходное изображение и открываем в Photoshop. Выберите такое изображение, на котором есть какой-то объект крупным планом. Я выбрал вот это изображение.

Выбираем в меню File>Open (Файл открыть) либо используем сочетание клавиш Ctrl+O и открываем наше изображение.

Шаг 2

Выберем область фотографии, которая останется нетронутой. Выбираем инструмент Rectangular Tool (Прямоугольная область) и выделяем то, что должно остаться.

Шаг 3

Сохраним наше выделение в каналах, чтобы потом мы могли его использовать. Для этого перейдите на вкладку Channels (Каналы) и нажмите на кнопочку Save Selection as Channel (Сохранить выделение как канал).

Шаг 4

Выделим наш объект (цветок). Выделять можно не весь, а только ту часть, которая не входит в то что мы выделили в предыдущем шаге.

Шаг 5

Скопируем то что только что выделили на новый слой. Для этого образуйте выделение из пути (если выделяли пером) и нажмите Ctrl+J. И то что было выделено окажется на новом слое.

Чтобы образовать выделение из нашего контура переходим на вкладку Paths (Контуры) и удерживая клавишу Ctrl кликаем по пиктограммке нашего контура.

В результате у вас получится 2 слоя.

Шаг 6

Скопируем слой с оригинальным изображением. Нажмите Ctr+D, чтобы убрать выделение (если оно есть). Затем CTr+J чтобы создать дубликат.

Шаг 7

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

Для этого перейдем в палитру Channels (Каналы) и удерживая клавишу Ctrl кликнем по пиктограммке созданного нами канала в шаге 3.

Затем нажимаем Ctrl+Shift+I для, того чтобы инвертировать наше выделение и нажмем Del (только убедитесь что вы выбрали скопированный слой). Слой с оригиналом можно теперь отключить.

Шаг 8

Теперь выберем оба слоя удерживая клавишу Shift . Затем немного трансформируем эти слои. Для это нажмите Ctrl+T и удерживая клавишу Ctrl тягайте за угловые маркеры пока не добьетесь нужного результата. У вас должно получится примерно вот так.

Шаг 9

Создадим какой-нибудь фон. Я сделаю просто серый фон, но вы можете сделать как вам захочется). Нажимаем Ctrl+D, чтобы убрать выделение (если оно есть) и заливаем его выбранным цветом Alt+Del.

Шаг 10

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

Результат

Источник — diwo.by

Источник: https://pixelbox.ru/zhivaya-fotografiya

Урок по художественной обработке фотографии

© 2012 Annie. All rights reserved.

Рада приветствовать Вас на этой странице! Этот урок посвящен художественной обработке женского портрета.

Урок ориентирован на человека мало-мальски владеющего инструментами и понятиями Adobe Photoshop.

Это обучающий урок, он знакомит с основами художественной обработки: 1) Работа с цветом 2) Работа с кожей 3) Работа со светом Более сложные уроки именно о серьезной ретуши я планирую писать в дальнейшем. Наш оригинал:

Наш результат:Детали:

Итак, начнем.
Я фотографирую в raw-формате и для конвертации моих снимков использую Adobe Photoshop Lightroom. Процесс конвертации для показа в данном уроке я пропустила, но считаю важным сказать, что при конвертации был немножко изменен Баланс Белого (далее ББ): я сделала его теплее, так как снимок осенний, нашему глазу не просто привычно видеть теплее, но и в силу времени года, окружающей обстановки хочется видеть теплые тона. Было добавлено немного заполняющего света и понижена (слегка) контрастность. Снимаю я тоже с пониженной контрастностью — это дает мне больше возможностей при обработке.

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

Источник: http://annies.ru/urok-po-hudozhestvennoy-obrabotke-fotografii

Как сделать движущееся фото — NEZLOP.RU

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

Что такое движущееся фото

У этого вида изображений есть и другие названия — живое фото, двигающаяся картинка. Но называть их принято синемаграф. Они были выдуманы двумя любителями фотографии — Кевином Баргом и Джейми Беком в 2011 году. При незначительных изменениях они создают иллюзию просмотра видео.

Синемаграф Дождь

Их создают при помощи наложения нескольких изображений или кадров и обрабатывают в графическом редакторе. Готовый синемаграф представлен в GIF-формате. Анимированная часть изображения повторяет несколько кадров, в то время как остальная картинка остаётся неподвижной.

В некоторых программах для просмотра движущегося фото можно увидеть смену кадров и их количество.

Кадры живого фото при просмотре на ПК

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

Читайте также: Определить шрифт по картинке.

Как сделать движущееся фото для Андроид

Живое фото мы будем делать в мобильном приложении из Play Market. Нам понравился редактор Enlight Pixaloop. В его возможности входит анимации разных частей на фото. Вы сможете оживить море на своей фотографии на отдыхе, сделать плывущее небо или любые движения тела.

Запустите приложение Pixaloop

Приложение предлагает настройку фото при помощи четырёх основных функций:

• Анимация элементов;
• Указание направления движения;
• Якоря частей, которые будут статичными;
• Заморозка области на фото.

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

1. При первом запуске закройте предложение платной подписки и перейдите в главное меню. Здесь нужно нажать на кнопку Новые работы. Откроется галерея, где нужно выбрать фотографию для синемаграфа;

   Нажмите кнопку Новые работы в Pixaloop

2. В меню выбираем кнопку Анимация. В приложении все кнопки работают по принципу залипания. Нажав один раз, действует выбранная функция, пока ещё раз не нажать на ту же кнопку;

   Выберите в меню кнопку Анимация

3. Выберите кнопку Якорь. Поставьте точки на границе между движущейся и статической областями. Если поставили якорь не там где нужно, нажмите на кнопку Удалить в меню. И выберите тот элемент на картинке, от которого нужно избавиться;

   Проставьте точки-якоря для разграничения областей анимации и статической в Pixaloop

4. Теперь нажмите на кнопку Путь. Мы анимируем участок с небом. И показываем программе, куда следует двигаться облакам;

   Кнопка Путь указывает направление анимации

5. Чтобы посмотреть, что у вас получилось, проиграйте анимацию при помощи кнопки Play справа;

   Кнопка для проигрывания результата в приложении Pixaloop

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

Для загрузки готовой живой фотографии нажмите вверху на кнопку Экспорт.

Нажмите на кнопку Экспорт, чтобы скачать движущееся фото

Укажите время проигрывания кадров и качество изображения. И нажмите снова на кнопку Экспорт. Готовый синемаграф можно будет найти в галерее после скачивания.

Интересное по теме: Нарисуй за 20 секунд или умри — играть онлайн.

Живое фото для Айфона

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

1. Теперь в меню выберите кнопку Ripple в виде капельки;

   Нажмите в приложении на кнопку Ripple

2. В галерее телефона выберите фото;
3. Далее выбираем кнопку Mask;

   Нажмите на кнопку Mask в меню приложения

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

   Выберите область, которая не будет анимирована

6. Кнопкой Stabilize можно разделить статическую и движущуюся область при помощи красных точек;

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

7. Теперь выберите кнопку Motion и инструмент Series и небольшими стрелками укажите направление движения каждого объекта на фотографии;

   Нажмите на кнопку Motion и выберите Series

8. Под основным блоком с картинкой находится кнопка Play для предпросмотра анимации;
9. Чтобы сохранить, нажмите вверху на квадрат со стрелкой вверх и выберите кнопку Save Draft (сохранить в память смартфона) или Save & Share (поделиться).

   Выберите один из способов скачивания живой фотографии

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

Делаем синемаграф в Photoshop

Картинки, на которых двигается фото можно создать в графическом редакторе Фотошоп. В отличие от предыдущих способов, где за основу берётся неподвижные картинки, в Adobe Photoshop мы будем применять короткое видео. Чтобы уже из него сделать красивый синемаграф.

Съёмка видео для создания синемаграфа

Желательно заранее подготовить коротенький ролик, где будут двигаться необходимые вам объекты.

1. Добавьте видео в Фотошоп. Для этого нажмите на кнопку Файл и выберите ролик;

   Добавьте видео в Фотошоп

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

   Обрежьте ненужную часть видео для движущегося фото

3. И при помощи ножниц, которые расположены тут же на панели слева обрезаем нужный участок;
4. Немного растяните видео на таймлинии, чтобы с ним удобнее было работать. Теперь выберите самый лучший кадр, который будет основой движущегося фото;
5. Выделите весь слой изображения при помощи горячих клавиш Ctrl + A. После чего нажмите на Ctrl + C, чтобы скопировать и Ctrl + V, чтобы вставить ещё один такой же слой поверх существующего. В итоге на таймлайне появится его копия, но уже как статический файл — основа изображения;

   Создание статического видео для живого фото в Фотошоп

6. Теперь нажмите на кнопку киноплёнки, расположенную возле таймлинии и выберите пункт Создать группу видео. Вверху появится новая пустая дорожка;

   Нажмите в меню на пункт Создать группу видео

7. На неё переместите статический файл, то есть нашу основу картинки;

   Переместите изображение на новую дорожку на таймлинию в Фотошопе

8. На панели инструментов Фотошоп выберите Ластик. Им нужно стереть на статической фотографии область, которая будет двигаться. При стирании не трогайте лицо или остальную неподвижную область;
9. Почти готово, теперь нужно сохранить полученное изображение. Нажмите кнопку Файл, выберите пункт Экспортировать, Сохранить для Web;

   Сохранение движущейся картинки в Adobe Photoshop

10. В выпадающем окне в пункте Анимация нужно выбрать значение — Постоянно и нажать ниже Сохранить.

    Выберите пункт Постоянно, чтобы зациклить движущуюся картинку

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

Это интересно: Бесплатные аналоги Фотошоп на русском языке.

Официальный сайт синемаграфа

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

Официальный блог синемаграфа

В сети есть и русскоязычный фан-сайт, на котором можно найти такие же картинки. А также узнать о том, как создать их в своём устройстве при помощи Фотошоп.

Где скачать много движущихся картинок

Можно не только создать, но и скачать готовые изображения в Интернете. Множество живых фото находится в обычном поиске картинок Гугл или Яндекс. Попробуйте в одном из поисковиков задать вопрос: «синемаграф». Теперь выберите раздел Картинки.

Движущиеся фото в Яндекс.Картинки

В обоих поисковых системах подобные фото обозначаются значком Gif.

Чтобы посмотреть такую картинку в действии, нужно выбрать её курсором мыши или тапом в смартфоне. А чтобы скачать, выберите ПКМ и нажмите на пункт Сохранить изображение как. Среди этих картинок можно найти подходящие обои для рабочего стола ПК или смартфона. Нужно только не забыть подобрать нужный размер.

Например, для большинства ноутбуков подойдут картинки с разрешением 1366×768. А чтобы узнать, какое разрешение установлено на вашем ПК, нажмите на рабочем столе ПКМ и выберите Параметры экрана. При создании движущейся фотографии можно также подобрать для неё размер, чтобы использовать в качестве обоев.

Как сделать живой рисунок. Как сделать живую воду

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

Живая фотография в Инстаграме

На данный момент существует 3 способа для создания подобных фотографий. Два из них характеризуются простотой, а один предстает достаточно сложным.

Самый простой способ доступен только для владельцев устройств на iOS и macOS . Им нужно установить программу . Вероятно для Android имеются аналоги, однако мы не смогли найти программу с достойным софтом. Эта программа позволяет заснять короткое видео и закрасить ту область, которая будет оставаться подвижной. Всё остальное будет оставаться в статичном состоянии. В этой же программе можно использовать всевозможные фильтры, поэкспериментировать с яркостью и иными параметрами.

Создание живой фотографии в Photoshop

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

Всю работу по созданию живой фотографии мы осуществляем в программе Photoshop. Видео может быть обрезано отдельным софтом либо же при импорте.

Пошаговая инструкция:

1. Загружаем видео в программу. Для этого действуем по следующей цепочке: «Файл» — «Импорт». Далее выбирает «Кадры видео в слои», после чего находим требуемое видео. Каждый файл будет отображаться как отдельный слой.
2. Выбираем те кадры, которые статичны, а остальные объединяем посредством горячих клавиш Ctrl+G. Далее нажимаем «Слои» — «Слой-маска» и «Скрыть всё».
3. На статичном первом слое необходимо закрасить белым цветом ту область, которую хотите оставить подвижной.
4. Должен открыться раздел анимации, в противном случае, придется открывать самостоятельно. Сделать это можно следующим образом: открываем окно, далее на рабочей области нажимаем параметр анимация. Здесь отображаются кадры будущей живой фотографии. Большинство из кадров имеет прозрачный фон, избавиться от которого можно выделив первый и унифицируя видимость. Появится новое диалоговое окно, где нужно выбрать пункт синхронизации.

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

Теперь ваши живая фотография готова!

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

Как известно человек состоит из 80% воды. Свойства воды необходимы чтобы человеческий организм жил. Люди уже мало употребляют воду из-под крана, а больше пользуются фильтрами для очистки воды. Такая очищенная жидкость точно не нанесет вреда человеку. Больше всего полезна Живая вода в домашних условиях, ее можно сделать самому. Если вы поклонник правильного питания, смотрите как сделать настоящий .

Для изготовления живой воды рассмотрим 3 способа изготовления полезной воды. Нам понадобятся следующие материалы:

Способ №1

Рассмотрим самый простой и доступный способ, который сможет сделать каждый.

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

Способ №2

Этот способ получения живой воды является самым эффективным, и он основан на использовании кремния. Кремний можно купить в аптеке. Налейте в банку 3 литра воды и добавьте примерно 300 камней кремния. Накройте банку чистой марлей и дайте настояться воде двое суток. После чего перелейте воду в другую чистую емкость, так чтобы черный осадок остался на дне в прежней банке – это и есть вредные вещества, они нам больше не понадобятся. Теперь следует воду слегка подморозить. Когда образуется небольшой слой льда, проделываем в нем отверстие и переливаем в другую емкость. Лед также можно выбросить, в нем образовались изотопы водорода.

Способ №3

В третьем последнем способе также замораживаем воду. Она должна замерзнуть на 2/3 от объема. Когда вода замерзла, тут все наоборот, выливаем не замерзшую воду, а лед. Из получившегося растаявшего льда получится настоящая живая вода. Такая вода очень полезна для организма.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Как сделать живое фото в Instagram на Андроиде и Apple?

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

Самый простой способ доступен владельцам следующих устройств:

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

• Владельцы Android могут поискать аналоги данного приложения, однако они не представляют собой однотипный вменяемый софт.

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

Как сделать живое фото в Инстаграм в Photoshop?

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

План действий:

Если в исходном видеофайле нет сложных предметов/объектов, процесс создания живого фото не займет много времени. Но если вам важна детализация кадров, этот способ вряд ли устроит. Опытные специалисты акцентируют на том, что работа с живыми фото посредством редактора Фотошоп ограничивает пользователя в возможностях. Это больше подходит для «баловства» с примитивными кадрами.

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

Для более качественного результата можно применить Adobe After Effects. Это позволит стабилизировать «дрожащие» кадры, но займет массу времени. Если исходный ролик снят без соблюдения рекомендаций, над ним придется долго попотеть.

Зачем нужна синематография?

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

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

Если вы до сих пор смутно представляете себе, что такое синематография, вспомните фильмы о Гарри Поттере. Движущиеся картины вызывали восторг у многих зрителей. Живое фото в Instagram – это нечто сходное. Даже самые креативные и провакационные снимки (статичные) все чаще проигрывать синемографу. Это прекрасное решение, чтобы привлечь как можно больше внимания к коммерческому контенту на страничке.

Убрали гифки в Инстаграме? Синемаграммы оставили!

Почему живые фото становятся популярнее gif-анимации? Ответ достаточно прост: не все социальные сети поддерживают данный формат файла. Качественные GIFки могут весить достаточно много.

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

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

Мне нравится 0

Живые фото в Инстаграм — интересная фишка. Примеры таких живых фото, сделанных с помощью приложения Плотаграф, смотрите в официальном аккаунте Инстаграм @plotaverse . Эти живые фото сделаны из фотографий, но можно делать их и из видео.

Хотите больше идей для фото в Инстаграм? Подпишитесь на нас в Pinterest !

Как сделать такое живое фото и можно ли с помощью айфона или смартфона на андроиде? Можно! Нужно будет установить одно из (или оба) приложений: Plotagraph и Cinemagraph. Их основное отличие — Плотаграф делает живое фото из обычной фотографии, а Синемаграф — из видео. Синемаграф конечно будет реалистичнее, но и Плотаграф даёт интересный эффект. Лично мне Плотаграф нравится даже больше, т.к. можно использовать и делать из них красоту.

Plotagraph — это оживление части фотографии векторами.

Приложение для iPhone — Plotagraph+ https://itunes.apple.com/us/app/plotagraph-photo-animator/id1244669793
Для Андроид приложения пока нет, но вы можете скачать программу для Windows по этой ссылке http://download.plotagraphapp.com . Нужна будет регистрация на официальном сайте.

После готовое видео-плотаграф можно будет загрузить на Андроид и оттуда в Инстаграм.

Принцип работы в приложении для iPhone и для компьютера одинаковый.

1. Загружаем фото в приложение. Лучше и реалистичнее всего будут выглядеть живые фото, где двигается вода/облака. Вода — это не только море, можно и кофе в кружке, фонтан и т.д.
2. Рисуем стрелочки по направлению движения в той зоне, где нужно «оживить» изображение. Чем короче стрелочки, тем реалистичнее будет итоговый эффект.
3. Ставим ограничительные точки там, где изображение должно остаться неподвижным.
4. Для предпросмотра можно нажать треугольник внизу.
5. Делаем экспорт получившегося живого фото и сохраняем (формат — видео.mp4).
6. Скидываем на телефон и загружаем в Инстаграм. Получившееся видео — это и есть «живое фото»

Как сделать живое фото Синемаграф из видео на айфоне/андроиде

Живое фото из видео будет реалистичнее. Потому что принцип работы — вы замораживаете отдельные участки, а не оживляете. Т.е. движение на фото будет полностью реальным.

Такой эффект можно сделать в приложении для iPhone или Android — Cinemagraph.

Первое, что нужно сделать — подумать, каким будет видео. Какую часть кадра вы заморозите, какой эффект получится? Самый очевидный вариант — вода, река. Ещё можно сделать изображение движущегося отражения в зеркале, разделить движущуюся толпу пополам (одна двигается, вторую заморозить). Лучше всего, если вы будете снимать со штатива или поставив телефон на подставку.

В примере на видео мы решили «оживить» стену. Двигали камеру вверх-вниз и после оживили только ту часть, где стена. Результат неидеален, но смысл понятен.

1. Открываете приложение, направляете камеру на предмет съёмки.
2. Нажимаете и удерживаете круглую кнопку внизу.
3. Пальцем закрашиваете те участки, которые будут «живыми». Наверху есть кнопки, чтобы изменить размер кружка, которым закрашиваете, и степень прозрачности.
4. Галочка — готово, дождитесь обработки видео.
5. Можно поделиться получившимся видео (это и будет «живое фото) сразу в Инстаграм или на почту/послать в мессенджеры.

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

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

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

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

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

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

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

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

Для начала вам понадобится:

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

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

1.Shoot Your Video

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

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

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

В этом примере я собираюсь изолировать чашку с кофе в дороге.

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

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

C. Shoot:

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

2. Обрезать

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

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

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

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

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

4.Выберите раздел анимации

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

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

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

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

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

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

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

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

A. Измените непрозрачность слоя Still Moment на 50% .

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

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

7. Наблюдайте за своим синемаграфом

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

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

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

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

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

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

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

E. Когда все дублированные слои все еще выделены, измените их порядок, выбрав Layer> Arrange> Reverse.

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

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

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

B. Снова откройте меню временной шкалы анимации и выберите «Создать кадры из слоев». Это сделает кадр из каждого слоя.

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

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

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

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

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

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

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

B. Не забудьте установить Colors> 256 .

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

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

E. Затем нажмите Сохранить и наслаждайтесь новым синемаграфом.

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

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

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

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

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

Готовы начать? Поднимите стул, откройте Photoshop и выполните эти семь простых шагов, чтобы создать свой собственный синемаграф!

1.Выберите свой видео файл

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

Для этого урока я использую видео, которое мы сняли для тура Jenga, на простом синем фоне. (Вы получите тот же файл, если подпишетесь на курс «Тенденции дизайна»!)

Выбирая идеальное видео для синемаграфии, вы должны помнить о нескольких вещах:

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

Получив видеофайл, вы готовы загрузить его в Photoshop.

2. Импортируйте видеофайл

Открыв Photoshop, перейдите в Файл> Открыть . Выберите файл, и вы увидите, что видео отображается как слой. Если он не отображается автоматически, убедитесь, что вы также видите временную шкалу, выбрав «Окно »> «Временная шкала ».

Вы заметите, что видеофайл автоматически помещается в группу «Группа видео 1.» Вы можете оставить его там, но если вас беспокоит наличие только одного слоя в группе, не стесняйтесь вытащить слой видео и удалить группу! Это необязательно.

3. Очистите временную шкалу

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

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

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

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

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

4. Создайте маскирующий слой

.

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

Если вы нажмете кнопку воспроизведения, вы заметите, что теперь вы не можете видеть ни одно видео, потому что еще более позднее находится наверху. Пришло время добавить маску, которая позволит нам выбрать точное движение, которое мы хотим показать!

Добавьте маску слоя, выбрав опцию в нижней части панели слоев или выбрав Layer> Layer Mask> Reveal All.

5. Изолируйте механизм

Убедитесь, что у вас выделена маска слоя (а не сам слой), а затем возьмите инструмент «Кисть».Как и в случае с любой другой маской, кисть с черным цветом скроет маску (раскрывая содержимое нижележащего слоя), а кисть белым цветом откроет маску (скрывая содержимое из нижележащего слоя).

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

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

6. Экспорт в формате gif

Когда вы будете довольны своим синемаграфом, пора его экспортировать! Просто перейдите в Файл> Экспорт> Сохранить для Интернета (устаревшая версия) . Здесь есть множество вариантов, с которыми вы можете поэкспериментировать, но два наиболее важных из них:

1. Сохранить как gif (находится в верхней части диалогового окна)
2. Установите для параметров цикла значение «Навсегда» (находится в нижней части диалогового окна)

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

И все! Вы только что создали свой собственный синемаграф, чтобы поделиться им со всем миром. Как все обернулось? Мы будем рады узнать в комментариях.

Бонус: бесплатный шаблон Photoshop и видео!

Когда вы зарегистрируетесь на наш бесплатный курс Design Trends 2019, вы получите доступ к видеофайлу, используемому в этом руководстве, и пользовательскому шаблону Photoshop, демонстрирующему упрощенный метод создания синемаграфов!

Как использовать файл Photoshop

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

Начните с демаскирования всех слоев, кроме «Базового материала». Это оригинальный файл фильма, с которого мы начали. Если вы нажмете кнопку воспроизведения, вы сможете увидеть, сколько движется рука, чтобы встряхнуть доску Jenga!

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

Затем мы решили сосредоточиться только на сегменте видео, который хорошо сочетается друг с другом, чтобы создать этот вневременной эффект. Однако мы оставили там весь файл, чтобы вы могли видеть его целиком!

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

И все! У вас есть синемаграф, который можно разместить на вашем сайте.Расскажите в комментариях ниже: Что вы собираетесь создать с помощью этого тренда?

---

Запишитесь на наш бесплатный курс по электронной почте!

Электронный курс с файлами Photoshop, учебными пособиями и множеством идей!

Мы изучаем последние и величайшие тенденции в дизайне веб-сайтов с помощью бесплатного курса электронной почты — и вы приглашены! От глючных графических эффектов до макетов сеточных карточек CSS — мы углубляемся в тенденции 2019 года, чтобы рассказать, почему они работают и как вы можете реализовать их на своем собственном сайте.

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

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

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

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

Тэмми Джоске

Как создать синемаграф в Photoshop CC

Создать план

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

Настройте оборудование

Не секрет, что большая часть съемки красивых фотографий зависит от правильного оборудования. Для получения наилучших результатов синемаграфии штатив в значительной степени необходим. Чем прочнее и тяжелее штатив, тем лучше. Что касается самой камеры, главное требование для создания синемаграфа — это то, что она способна снимать видео. (Не хватает денег? Камера вашего смартфона — честная игра!)

Захват видео

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

Редактировать, редактировать, редактировать

После того, как ваше видео было снято, пора открыть его в Photoshop, чтобы можно было начать процесс редактирования. Когда вы делаете синемаграф, именно здесь начинается самое интересное.

Прежде чем вы начнете, важно убедиться, что в Photoshop включен режим просмотра временной шкалы. Вы можете сделать это, перейдя в Window , а затем в Timeline .

Во-первых, вы хотите продублировать ваше видео, чтобы вы работали с двумя слоями в Photoshop.На этом этапе может быть проще создать зацикленное видео для работы. Чтобы создать эффект петли, вам нужно установить шкалу времени на Repeat Forever . Photoshop на самом деле дает вам возможность установить скорость вашего видео. У вас есть возможность поэкспериментировать с этим и найти скорость, которая облегчит редактирование.

Следующим шагом будет дублирование вашего слоя. Есть несколько способов дублировать ваш слой, но один из самых простых — это простая команда копирования и вставки.На панели слоев выберите нужный слой и просто нажмите Ctrl (на ПК) или команду (на Mac) + C, чтобы скопировать, затем Ctrl (на ПК) или команду (на Mac) + V, чтобы вставить. После копирования слоя вы должны увидеть Video Group 1 и Video Group 1 Copy . Конечно, вы можете переименовать эти слои, если хотите — это на ваше усмотрение.

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

После того, как вы выбрали кадр, который хотите навсегда заморозить во времени, вы можете щелкнуть правой кнопкой мыши на самом верхнем слое; в этом случае, скорее всего, это будет Video Group 1 Copy, и выберите Rasterize .

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

Завершающие штрихи — и экспорт!

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

Когда приходит время экспорта, важно сохранить его в правильном разрешении и формате. Мы рекомендуем экспортировать в формате .MOV или .MP4.

Для Instagram мы обнаружили, что лучшие разрешения экспорта для высококачественного поста были:

• Квадратные синемаграфы: соотношение сторон 1: 1 (1080 пикселей x 1080 пикселей)
• Портретно-ориентированные синемаграфы: соотношение сторон 4: 5 (1350 x 1080 пикселей)
• Синемаграфы с альбомной ориентацией: макс. Соотношение сторон 1: 91: 1 (1200 x 628 пикселей)
• Синемаграфы Story: соотношение сторон 16: 9 (1080 пикселей x 1920 пикселей)

Мы рекомендуем файл небольшого размера, если вы собираетесь публиковать его в социальных сетях (а вам следует это сделать!).

Поделитесь своим шедевром

Если создание синемаграфов в Photoshop кажется делом любви, вот и хорошие новости: было доказано, что синемаграфы безумно увеличивают вовлеченность. Фактически, в рекламных кампаниях, в которых использовались синемаграфы, вовлеченность увеличилась на 110%. Как только вы научитесь создавать синемаграф, их будет легко включить в свое присутствие в Интернете. Вы можете использовать синемаграф безгранично. Это также отличный способ добавить движения в ваше онлайн-портфолио фотографий!

Другие способы создания синемаграфа

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

Некоторые из наших любимых вариантов включают Cinemagraph Pro, Loopsie и Vimage. Независимо от того, какую программу вы выберете для создания синемаграфии, мы уверены, что вы в кратчайшие сроки создадите золотое кино!

Если вы ищете другие проекты Photoshop, подобные этому, мы составили список из 61 потрясающих руководств по Photoshop, которые вы можете попробовать!

Хотите узнать о других интересных способах оживить веб-сайт своего онлайн-портфолио?
Полное руководство по созданию инфографики
Является ли пейзажная фотография секретом для большего числа подписчиков в Instagram?
The IRL GIF: как превратить ваши фотографии в книжку-книжку

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

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

Шаг 1. Пленка и импорт

Снимайте видео с помощью камеры (или телефона) на штативе. Это важно, так как вы должны быть уверены, что в получившемся фильме нет дрожания. Затем в Photoshop выберите «Файл»> «Импорт»> «Видеокадры в слои». Вы увидите подобное диалоговое окно. Убедитесь, что установлен флажок «Сделать анимацию кадра».

Шаг 2. Выберите рамки

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

Больше после прыжка! Продолжайте читать ниже ↓
Члены бесплатного и премиум-класса видят меньше рекламы! Зарегистрируйтесь и войдите в систему сегодня.

Шаг 3. Преобразование Photoshop

Когда вы импортируете фильм в Photoshop таким образом, он создает покадровую анимацию с каждым кадром, установленным на 0,03 секунды (так, что 30 кадров составляют примерно одну секунду). Здесь я импортировал 16 кадров, которые вместе длятся чуть более полсекунды.

Шаг 4. Экспорт GIF

Выберите «Файл»> «Экспорт»> «Сохранить для Интернета (устаревшая версия)» и установите тип файла GIF. Чтобы добиться сглаженного результата, установите для параметра «Дизеринг» максимальное значение 100% и установите для GIF бесконечный цикл.Возможно, вы также захотите уменьшить размеры — я установил 600 пикселей для управляемого файла. Вот результат.

Шаг 5. Отредактируйте кадры

Созданный мной GIF-файл был слишком длинным и отрывистым — этот большой всплеск в конце был слишком знаковым событием. Решением здесь было удалить некоторые кадры в начале и в конце на временной шкале, уменьшив анимацию до пяти кадров.

Шаг 6: Зациклить кадры

Чтобы избежать скачка в месте повторения пленки, вам нужно зацикливать ее назад и вперед.Чтобы сделать это с пятью кадрами, выберите кадр 4 и, удерживая Option / Alt, перетащите его до конца (справа от кадра 5), чтобы сделать копию этого кадра. Проделайте то же самое с кадрами 3 и 2, и в итоге вы получите восемь кадров.

Шаг 7. Новый GIF

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

Шаг 8: Дублирование и маска

Дублируйте нижний слой и перетащите его в верхнюю часть стопки слоев (хотя на самом деле вы можете продублировать любой из слоев).Используйте Layer> Layer Mask> Reveal All, чтобы создать пустую маску, затем закрасьте льющуюся воду и нижний стакан черным на этой маске, чтобы скрыть слой. Теперь, когда вы проиграете анимацию, вы увидите, что верхний стакан остается неподвижным, когда вода льется в нижний.

Шаг 9. Любые другие вопросы

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

Шаг 10: экспорт окончательного GIF

Глядя на тестовые гифки, которые я экспортировал ранее, казалось, что вода льется слишком быстро — это выглядело безумно. Чтобы замедлить его, выберите все кадры и измените время с 0,03 секунды на более низкую скорость — я использовал 0,1 секунды, что дает гораздо более приятный результат.

Создайте синемаграф из видео в Photoshop и учебник в виде анимированного gif

Синемаграф, также называемый «живыми фотографиями», в последнее время вернулся в моду (извините, они не новы).На самом деле я написал учебник о том, как это сделать, еще в 2005 году в моей книге «Как сделать Wow для Интернета» из издательства Peachpit press, тогда я на самом деле назвал его «Оживление картинки». Пришло время сделать их в Adobe Photoshop с помощью видео. Это действительно полезно для заголовка веб-сайта, рекламы, публикации в Facebook или киоска, потому что вы можете создать гифку и установить ее на бесконечный цикл и получить видео с бесконечным циклом при довольно небольшом размере файла.

Синемаграф — это когда у вас есть фотография, но ее части движутся.Это делается путем маскировки фотографии с зацикленным видео под ней. Мы сделаем это из видео, этот урок работает только в Photoshop CS6 (расширенный) и Photoshop CC. Посмотрите мое видео, в котором шаг за шагом показано, как это сделать. У меня есть несколько дополнительных советов, в том числе:

• Как использовать направляющие для лучшего соответствия петле
• Как легко увидеть, что вы маскируете из видео
• Как экспортировать как анимированный gif
• Как чтобы поместить гифку в facebook

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

Модель здесь была Tiffany, и я снял это (Canon 5D MkIII) на Eaves Ranch, Санта-Фе, Нью-Мексико

Примечание. Если у вас нет Photoshop CS6 Extended (для поддержки видео) или Photoshop CC, этот учебник не будет работать для вас, извините, но функции видео до этого были другими, но вы могли бы адаптироваться учебное пособие для работы в более ранних версиях, но я не могу предложить поддержку по этому поводу.

После того, как вы создали синемаграф, вы можете экспортировать его как видео или как gif. Используйте «Сохранить для Интернета», чтобы экспортировать GIF, и убедитесь, что вы установили цикл «навсегда».

Вы можете загрузить эту гифку на свой веб-сайт, см. Пример здесь

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

Создайте КИНОГРАФ в Учебнике Photoshop и сделайте GIF

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

Этот урок будет работать в Photoshop CS 6 или CC. Более ранние версии имеют другие движки анимации. Теперь, чтобы поместить сюда видео, вы просто выбираете «Файл», «Открыть», а затем вы просто выбираете видео, и оно откроется на временной шкале.Откройте видео в Photoshop и убедитесь, что шкала времени видна. Окно> Временная шкала (работает только в Photoshop CS6 Extended или CC) Итак, как видите, у нас здесь 16 секунд; это слишком долго.

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

Обрезаем видео, щелкая и перетаскивая конец и начало. У нас есть пара секунд, и это все, что нам нужно.

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

Теперь, если вы хотите узнать больше о видео, у меня есть два реальных полных учебных пособия по работе с видео в Photoshop. У меня тут бесплатный, есть еще парочка углубленных курсов.

Создание фильмов в Photoshop

Видео в Photoshop

Щелкните меню справа от шкалы времени и выберите «Циклическое воспроизведение».Теперь, сделав это, мы сможем взглянуть на наш цикл. Поэтому, когда он дойдет до конца, он вернется снова, поэтому убедитесь, что он включен. А затем, когда мы нажимаем Play, обратите внимание, что он будет проходить до конца, а затем играем снова. Так что давайте просто посмотрим, и мы ищем только внезапные скачки.

Это хорошее базовое видео для использования. Следующее, что нам нужно сделать, это зафиксировать это в фотографии, и это очень просто. Дублируйте слой видео.Таким образом, вы можете нажать Ctrl J или Command J на ​​Mac для прыжка или просто перетащить значок нового слоя, и это будет дублировать это видео.

Теперь мы не хотим, чтобы это было видео. Мы хотим, чтобы этот верхний слой был изображением, поэтому просто щелкаем правой кнопкой мыши и выбираем «Растрировать слой».

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

Обязательно перетащите изображение влево, чтобы оно выровнялось в начале.

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

Скрыть верхний слой

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

Примените маску слоя к верхнему слою (слою изображения).

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

Выберите черный для цвета переднего плана, возьмите кисть, непрозрачность установлена ​​на 100, и я на самом деле даже просто отключу давление пера. Я хочу просто иметь твердую непрозрачность.

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

При предварительном просмотре видео скройте слой настройки оттенка и насыщенности.

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

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

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

Экспорт как анимированный gif

Теперь я покажу вам, как экспортировать это как анимированный gif. Выберите «Экспорт», и мы перейдем в «Сохранить для Интернета».

Измените размер на ширину 650, потому что, возможно, я хочу разместить это в блоге WordPress.

Убедитесь, что вы выбрали gif, а не jpg.

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

Установите максимальное значение 256 цветов. Мы очень хотим это сделать, и какие бы настройки у вас ни были.

Посмотрите на параметры зацикливания.Мы хотим изменить это значение на Forever, потому что вы хотите, чтобы это повторялось бесконечно.

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

Итак, вы видите, вот как это будет выглядеть. Будет неплохо смотреться. Будет хорошо играть.

Мы просто нажмем «Сохранить» и назовем это cinemagraph.gif. Хорошо, и это наша последняя гифка.

Размещение анимированного gif на Facebook

Вы не можете загрузить анимированный gif прямо на Facebook.Если вы хотите поделиться им на Facebook, вам нужно будет загрузить его на свой веб-сайт и вставить URL-адрес изображения (ссылка на него с вашего веб-сайта). Если у вас нет веб-сайта или вы не хотите его размещать, есть другие решения. Самым популярным из них является бесплатный веб-сайт giphy

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

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

До встречи в КАФЕ!

Колин

У меня есть больше руководств по анимации в Photoshop здесь

P.S У меня есть несколько премиальных курсов, которые научат вас видео в Photoshop. Это

Видео в Photoshop (руководство для дизайнеров и фотографов) и

Создание фильмов в Photoshop (видео с электронной книгой)

---

Что такое синемаграф? (И как легко сделать себя!)

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

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

Мы также рассмотрим пошаговое руководство по созданию захватывающих синемаграфов.

Что такое синемаграф?

Синемаграф был описан Ошо Коко как «больше, чем фотография, но не совсем видео.”

Синемаграф — это нечто среднее между неподвижной фотографией и движущимся видео. Большая часть кадра полностью неподвижна, как на фотографии. Но в кадре есть один движущийся элемент. Это фото движется.

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

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

Вы можете подумать, что синемаграф — это красивое слово для GIF. Но это не так. GIF — это некачественная анимация, которую мы часто видим в мемах. Они похожи, но синемаграф использует качественные изображения и видео.

Синемаграфы создаются путем объединения короткого видео с одним неподвижным кадром. Затем они объединяются при постобработке с помощью Adobe Photoshop или Flixel.

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

Слева: Ашрафул Арефин — Справа: Аня Анти

История синемаграфов

Чтобы стать свидетелями появления синемаграфов, нам нужно вернуться в 2011 год. Это была Неделя моды в Нью-Йорке, и два художника были настроены сделать заявление.

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

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

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

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

Photoshop — самый распространенный инструмент для создания синемаграфов. Но теперь вы можете получить приложения для синемаграфии для своего смартфона. Например, у вас есть Cinemagraph Pro для iOS. И Zoetropic для Android. Доступны и другие приложения, но эти два отлично подходят для начала.

Для чего используются синемаграфы?

Бек и Бург использовали свои синемаграфы, чтобы воплотить в жизнь свою модную фотографию.Мода — отличное место для начала. Использование естественного движения одежды и волос — отличный способ оживить фотографию.

Но они не ограничиваются модой. Синемаграфы можно использовать во многих стилях фотографии. Например, вы можете остановить время с помощью синемаграфов уличной фотографии.

Такие художники, как Ашрафул Арефин и Аня Анти, используют синемаграфы, чтобы привнести таинственность в свои фантастические фотографии. Элементы движения усиливают сказочную атмосферу в их работе.Они похожи на то, что можно увидеть в фильмах о Гарри Поттере.

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

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

Как создавать синемаграфы

Сейчас существуют приложения, специально разработанные для создания синемаграфов.Есть варианты для телефонов Android и iOS, которыми легко пользоваться.

Но вам не нужно какое-то специальное программное обеспечение для создания синемаграфов, чтобы создать свою собственную. Все, что вам нужно, это Adobe Photoshop и камера, которая может записывать видео. Если они у вас есть, вы можете следовать нашим инструкциям по созданию синемаграфии в Photoshop.

Выберите движущийся предмет

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

Анимация должна быть безупречной. Начальная и конечная точки движения должны быть одинаковыми. Как и в примере ниже, бегун входит в рамку с одного края и выходит с противоположного. Бегун отсутствует в начале и в конце цикла.

Используйте штатив, чтобы держать сцену устойчивой

При съемке видео необходимо держать камеру полностью неподвижной.Любое движение камеры разрушит иллюзию хорошего синемаграфа.

Лучше всего установить камеру на штативе. Положите камеру на плоскую поверхность, если у вас ее нет. Но все же существует риск тряски или тряски.

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

Подготовьте камеру, и мы шаг за шагом расскажем, как создать собственный синемаграф в Photoshop.

Шаг 1. Откройте видеофайл в Photoshop

После того, как вы отсняли видео, откройте файл в Photoshop. Вы можете либо перетащить файл в программу, либо перейти в меню «Файл»> «Открыть». Откроется панель инструментов видео, и ваш экран будет выглядеть, как на снимке ниже.

Шаг 2. Установите начальную и конечную точки вашего видео

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

Когда вы узнаете, где они находятся, перетащите левую и правую стороны к красной линии. Это обрежет ваш видео файл.

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

Шаг 3. Создайте новый слой

Теперь вам нужно создать новый слой над папкой группы видео.

Шаг 4: Закрасьте части, где будет ваш объект

На новом слое выберите видимый цвет и установите непрозрачность на 100%.Затем закрасьте любые части изображения, которые вы хотели бы видеть в конечном продукте. На изображении ниже вы можете увидеть, как мы закрасили путь нашего объекта.

Не нужно относиться к этому шагу слишком дорого. Краска не появится на вашем финальном синемаграфе.

Шаг 5: Установите неподвижные части вашего синемаграфа

Сделайте слой с краской невидимым (щелкните глаз рядом со слоем) и нажмите Shift + Option + Command, чтобы создать новый слой.Вы должны сделать свой слой невидимым, прежде чем создавать другой слой.

Теперь вы можете решить, как будут выглядеть «неподвижные» части вашего синемаграфа. После этого нажмите Shift + Option + Command + E, чтобы преобразовать ваш новый слой в видимый слой штампа.

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

Шаг 6: Выберите слой с нарисованным путем объекта

Удерживая кнопку Command, щелкните по нарисованному слою (который по-прежнему должен быть невидимым).

Это выберет область, которую вы закрасили.

Шаг 7. Создайте маску слоя

Щелкните на видимом слое штампа (со статическим изображением) и создайте новую маску слоя. Теперь нажмите кнопку воспроизведения.

Если ваш синемаграф делает противоположное тому, что вы хотите, вы на правильном пути! (Не волнуйтесь, это не розыгрыш.)

Чтобы получить желаемый результат, щелкните эту новую маску слоя (поле рядом с видимым слоем штампа) и нажмите Command + I.

Это обратит эффекты и даст вам желаемый результат.

Шаг 8. Сохраните и экспортируйте синемаграф

Чтобы не потерять всю свою работу, сохраните ее перед экспортом. Когда синемаграф будет готов, вы можете преобразовать его в GIF. Перейдите в Экспорт> Сохранить для Интернета. Убедитесь, что вы выбрали GIF в раскрывающемся списке, которое находится прямо под Preset.

Если вы не хотите, чтобы GIF останавливался, выберите «Навсегда» рядом с параметром «Зацикливание». Вы также можете изменить размер своего GIF-изображения, чтобы упростить загрузку в Интернет.

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

И вот готовый результат! Как только вы привыкнете к процессу, вам понадобится максимум 10 минут, чтобы создать потрясающие синемаграфы.

Заключение

Синемаграфы привлекают внимание. Это все еще движущиеся фотографии.Это не видео и не гифки. Они нечто уникальное и особенное. Они привносят в ваши образы изумление и интригу. Как будто они созданы по волшебству.

Но синемаграфы проще, чем вы думаете. С момента своего создания в 2011 году их стало легко и доступно создавать.

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

Вы хотите улучшить свои навыки редактирования, освоив Lightroom? Тогда ознакомьтесь с нашей электронной книгой «Легкое редактирование с помощью Lightroom».

Как сделать синемаграф из неподвижного изображения без Photoshop

Простые советы по созданию анимированных изображений

Что такое синемаграф? Это неподвижная фотография, на которой происходит незначительное и повторяющееся движение, образующее видеоклип. Синемаграфы создаются путем съемки серии изображений или записи видео и превращения их в непрерывный цикл последовательных кадров с помощью программного обеспечения для редактирования изображений.Это делается таким образом, что частичное движение объекта (например, свисающая нога человека или развевающиеся волосы) воспринимается как повторяющееся или продолжающееся движение в отличие от неподвижности остальной части фотографии.

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

Шаг 1. Создание фотографии с прозрачным фоном

Так как же сделать синемаграф? Для начала вам нужно вырезать область, которую вы хотите оживить, из исходной фотографии и добавить ее на прозрачный фон. Вы можете сделать это в любом редакторе изображений, но мы выбрали PhotoWorks, поскольку он невероятно прост в использовании. Запустите программу и нажмите Инструменты> Изменить фон . Возьмите кисть Object и отметьте область, которую вы хотите сохранить, зеленым цветом.Затем переключитесь на кисть «Фон» и укажите на область, которую хотите удалить. PhotoWorks автоматически творит чудеса. Нажмите «Далее», затем выберите Сохранить с прозрачным фоном и сохраните отредактированное изображение как PNG для дальнейшего использования в создателе слайд-шоу.

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

Вырежьте желаемую область фотографии и сохраните ее с прозрачным фоном

Шаг 2 — Смешайте исходное изображение и вырез вместе

Пришло время объединить исходное изображение и фото, которое вы отредактировали, в создателе анимированных слайд-шоу. Мы рекомендуем вам использовать SmartSHOW 3D. В отличие от большинства основных приложений для создания слайд-шоу, эта программа позволяет работать со слоями и масками. Добавьте исходную фотографию в раскадровку и нажмите Изменить слайд .Обязательно растяните изображение, чтобы избавиться от черных границ. Затем нажмите Добавить слой> Фотография и аккуратно поместите картинку с прозрачным фоном поверх первой фотографии.

Примените маску градиента ко второй фотографии для лучшего вида

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

Шаг 3. Анимируйте неподвижную воду на своем изображении

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

Анимация фотографии с прозрачным фоном с использованием ключевых кадров

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

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

Чувствуете вдохновение и у вас есть много свежих идей? Загрузите SmartSHOW 3D с помощью кнопки ниже, чтобы начать создавать синемаграфы из ваших фотографий прямо сейчас:

Для Windows 10, 8, 7, Vista, XP

Вам нужно еще немного великолепных идей для синемаграфии? Ниже мы собрали несколько примеров анимированных фотографий, которые вы можете использовать в своих проектах.

🎬 Синемаграф, вдохновленный природой

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

🎬 Движущийся портрет, похожий на Гарри Поттера

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

🎬 Анимированная фотокарточка на день рождения

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

No related posts.