Как сделать движущиеся изображение
Как сделать «живые» фотографии: пошаговое описание, обзор программ и рекомендации
Что такое «живые» фотографии?
Чем отличаются «живые» фото от гифок?
Гифкой мы привыкли называть анимированное изображение, состоящее из нескольких статичных кадров. Все гифки, соответственно, имеют формат GIF.
Ну и, конечно же, сам стиль живых фото подразумевает, что часть изображения будет статична, а часть анимируется, создавая этим самым разрыв шаблона и эффект магии.
Как появилась мода на «живые» фото?
Когда 2 года назад вышел в продажу новый продукт Apple, многих пользователей заинтересовало, как сделать «живую» фотографию на iPhone 6. Мало того что качество камеры гаджета стало значительно выше, так еще добавилась функция мини-видео, которое сохранялось в формате «живого» фото путем совмещения JPG и MOV. Несмотря на мегапопулярность, эта новинка все же имела ряд недостатков:
Как сделать «живые» фотографии?
К счастью, сейчас очень много заинтересованных пользователей не только операционной системы iOS, но и Android, шерстя просторы интернета, могут найти много альтернативных способов для создания лайв-фото.
Если вы обладатель знаменитого «яблочного» смартфона, то обязаны знать, как сделать «живую» фотографию на iPhone. Для этого нужно:
Как редактировать фото
Обновленная версия iOS 11 представила несколько новых эффектов для лайв фото. Если раньше они могли только просматриваться, то сейчас есть возможность отключать звук, закольцовывать «живые» фото или проигрывать их вперед и назад. Также добавлена функция длинной выдержки. Разработчики позаботились не только о том, как сделать «живую» фотографию на айфоне, но и о ее редактировании.
Конвертирование «живых» фото
Мы узнали, как сделать на айфоне 7 «живые» фотографии. Но как адаптировать этот формат для других операционных систем? Для этого Live Photo нужно конвертировать. Если вас интересует вопрос о том, как сделать видео из «живых» фотографий, то ответ простой: достаточно загрузить приложение Live Gif. Оно стоит чуть больше 100 рублей и, как вы уже догадались по названию, умеет форматировать лайв фото в формат GIF или видеофайл. После определенных манипуляций в данном приложении, материал станет пригодным для публикации в социальных сетях. Также можно использовать приложение Motion Stills от Google, он действует по похожему принципу.
Как «оживить» фото JPG?
Допустим, у вас есть любимая фотография, которую вам захотелось «оживить». Такое возможно сделать в «Фотошопе» или в специальном приложении Plotagraph. Данная программа имеет панель инструментов и, что немаловажно, справочную информацию, которая поможет разобраться, как сделать «живые» фотографии на айфоне. Данное приложение платное, стоит примерно 400 рублей. Как оно работает?
MaskArt
Данное приложение бесплатное и без водяных знаков. Оно простое в использовании, но умеет создавать эффектные лайв фото из видео. Как с ним работать?
Данное приложение работает только на гаджетах Apple.
Loopsie для «Андроида»
Многие сейчас задались вопросом о том, как сделать «живые» фотографии на «Андроиде». Очень просто, для данной операционной системы тоже разработали ряд приложений. Есть дешевые и очень дорогие (200$), существуют и бесплатные.
Приложение «Лупси» условно бесплатное. Спустя несколько дней использования демоверсии появляется водяной знак.
Сняв видео, программа запускает процесс стабилизации, он скрывает дрожь в руках и другие технические неровности.
Далее выбираем режим «Анимирование» и проводим по той области, которую хотим «оживить». На этом этапе можно выбрать и стиль воспроизведения: с начала до конца или туда-обратно. «Живое» фото готово. Теперь им можно поделиться в Facebook или Instagram.
Live Photo в «Фотошопе»
На данном этапе многие заинтересовались, есть ли возможность создать модное изображение в программе «Фотошоп». Да, это несложно, но работа предстоит более кропотливая, чем в специальных приложениях для смартфонов.
Теперь давайте разберемся, как сделать «живую» фотографию в «Фотошопе».
Первым делом открываем фото, например, в формате JPG. Анимированный эффект можно создать из одной или нескольких фотографий. В любом случае главный объект и фон должны находится на разных слоях.
Если у вас одно фото, которое вы планируете «оживить», то можно сделать это следующим образом:
Следующим этапом будет сам процесс «оживления», перед которым рекомендуется уменьшить размер картинки, чтобы в дальнейшем она легче проигрывалась и не тормозила.
Как видите, создано много программ и условий, чтобы проявлять себя творчески. Не стесняйтесь открывать что-то новое, возможно, именно ваше творческое детище станет следующим модным трендом!
«Живые» фотографии: что это и как их делать
Сегодня разнообразим вашу Инста-ленту с помощью «волшебных» фотографий и покажем, как интересно презентовать товар.
Анна Зорина
Read more posts by this author.
Анна Зорина
Статья обновлена. Первая публикация: 24 января 2018 года
Время идет – контент становится более динамичным, чтобы мгновенно привлекать внимание. Но сфокусируется ли пользователь на предлагаемом вами товаре или услуге? Этот вопрос решают «живые» фотографии – это такие статичные изображения, на которых двигается только часть кадра.
из Инстаграма @toutifr из Инстаграма @flixelphotos из Инстаграма @flixelphotos«Живые» фото, равно как и анимированные фотографии, встречаются в соцсетях не так часто хотя бы потому, что не все умеют их делать.
Чем отличаются «живые» фото от бумерангов, гифок, анимации или видео
В «живых» фотографиях внимание сразу акцентируется на одном конкретном предмете — это идеальный способ заинтересовать пользователя каким-либо товаром. Гифки и видео не дают такого эффекта. Анимирование фотографий скорее украшает и привлекает, нежели акцентирует внимание.
Кроме того, гифки сложно заливать в Инстаграм, а для съемки полноценного видео нужен полноценный сценарий и много других заморочек. «Живые» фотографии делаются с телефона буквально за минуты, без каких-либо навыков.
из Инстаграма @flixelphotos из Инстаграма @flixelphotosКак самому сделать «живые» фото
Не будем томить и приступим к главному. Синемаграфия делается с помощью фотошопа, но это сложно, особенно для тех, у кого нет опыта работы в этой программе. Есть способ проще — использовать одно из специальных приложений.
Для пользователей iOS:
Cinemagraph Pro
Компания Flixel, создатель приложения, здорово ведет свой Инстаграм: можно подписаться и черпать там идеи.
Cinegraph
Cinemapic
Для пользователей Android:
Cinemagraph
Часто «живыми» фото называют любое фото с движением. Мы же называем так фото, сделанное из видео. А не наоборот – когда на фото накладываются эффекты, создающие имитацию движения.
Базовый принцип создания синемаграфии
Покупаем приложение и продумываем видеокадр. Сначала снимите видео, а уже потом делайте из него живое фото. Заранее продумайте свет и расстановку предметов. Снимайте со штатива — это важный момент, иначе финальное видео поплывет.
Снимаем видео. Сделайте его достаточно длинным, чтобы было из чего выбрать кадр, с которым вы будете работать.
Обрабатываем видео в приложении. На нужный нам кадр накладывается некая пленка. Эту пленку сотрите в том месте, которое должно ожить.
Не стирайте слишком большую поверхность, чтобы видео не поплыло.
Заливаем видео в Инстаграм. Для этого сохраните проделанную работу в формате видео.
Открыть GIF
Экстра фишки. Если вам нужна дополнительная обработка, воспользуйтесь другими приложениями, например, платной версией VSCO. В ней примените фильтры и поработайте с цветокоррекцией. Надписи и логотип добавьте в Splice или Hohot, блестки на фото с помощью Canva – сделайте анимированные фотографии.
Подробнее о том, как анимировать фотографию или сделать анимированный коллаж из фотографий читайте в статье «Идея для поста. Анимация» в блоге SMMplanner.
Каким аккаунтам подходят «живые» фото
В первую очередь «живые» фотографии отлично продают предметку: ювелирные украшения, обувь, одежду. Замечательно смотрится такой контент и в сфере общепита или в аккаунтах, связанных с едой. Блюда и правда словно оживают на фото (представьте себе движущийся пар над чашкой кофе или бегущие пузырьки шампанского).
Твой Сетевичок
Все о локальных сетях и сетевом оборудовании
5 лучших приложения, чтобы заставить фото двигаться
Картинка, которая двигается, — новый тренд в «Инстаграме» и на других развлекательных социальных платформах. Часть фото статична, а другая часть подвижна, например, область с небом, морем, машинами на дороге — всё что угодно. Как самостоятельно создать такую картинку-видео с помощью обычного мобильного приложения?
Топ-5 приложений для движущихся фото для «Андроида» и «Айфона»
Расскажем о нескольких мобильных программах, которые позволяют быстро сделать оригинальное изображение: какая-то его часть будет двигаться и тем самым завораживать внимание. Приложения работают по одному из двух принципов: часть картинки замораживается в редакторе (если это видео) или оживляется (если это просто фото).
Программы также сохраняют движущиеся фото в разных форматах — «гифках», просто видео, анимированные PNG и в других.
Loopsie
Эта программа подходит для «Андроида». Она полностью бесплатная. Сначала вы снимаете предварительно короткое видео в этом же приложении, потом в редакторе делаете неподвижной определённую область на ролике. Получается изображение с определённой движущейся областью. Программа удобная, с интерфейсом на русском языке.
Огромный плюс в копилку утилиты — она не ставит водяные знаки.
Какие ещё у программы функции:
Скачать программу можно с «Плей Маркета».
«StoryZ Живые фото»
У программы тоже понятный и удобный интерфейс, как и у предыдущей, но она работает по принципу оживления статичного фото. Можно заменить какой-то один элемент фото на видео. Это могут быть облака, вода, дым и прочее. Эта функция называется «Движение».
В этой же программе есть ещё одна аналогичная функция — «Анимация». Вы выбираете элемент (область будущей анимации) на фото и задаёте векторы стрелочками — направления, в которых будут двигаться выделенные элементы.
Кроме того, в этом редакторе можно снимать, сохранять видео в разрешении до 4К, а потом делиться ими с друзьями через это же приложение. Что ещё радует: в этом софте есть набор обучающих видео, то есть вы точно освоите все функции, которые предлагает приложение. Программа подходит для «Андроида».
Скачать её можно с «Плей Маркета».
Plotaverse
Это приложение подходит и для «Айфона», и для «Андроида».
Скачать его можно из App Store по этой ссылке либо с «Плей Маркета».
Жирный минус утилиты — она платная, стоит 379 рублей. Но оно того стоит.
Какие у программы возможности и плюсы:
Cinemargraph
Ещё один вариант для Android. Работает по тому же принципу, что и Plotaverse. Программа бесплатная, сохраняет движущееся фото в формате GIF. Что входит в функционал:
применение фильтров; добавление фото в социальные сети прямо из приложения; регулировка частоты кадров картинки в «гифке»; настройка качества движущегося фото; фокусировка на предмете при съёмке.
Cinemagraph Pro
Для «Айфона» есть программа, похожая по названию на предыдущую, — Cinemagraph Pro. Но это не одно и то же приложение — разработчики разные. Она бесплатная и с множеством функций: от фильтров и добавления текста на картинку до обучающих видео. Но за использование придётся «заплатить» водяным знаком на обработанной «фотке». Убрать его можно только за подписку.
Программа работает по принципу заморозки определённых участков снятого только что видео — как в Loopsie для «Андроида».
Здесь можно редактировать движущееся фото: делать его ярче, увеличить свет, сатурацию и многое другое. Можно выбрать разрешение для отредактированного видео, а также его формат. Можно сразу подогнать размер, разрешение и формат файла под определённую социальную сеть или мессенджер (Instagram, Twitter, SnapChat и другое).
Как сделать движущееся фото
Рассмотрим, как сделать анимированное изображение на примере программы Loopsie, рассмотренной выше:
Программа запустит стабилизацию видео. После этого можно переходить к редактированию. Выберите опцию анимации. Закрасьте пальцем ту часть картинки, которая должна двигаться. Укажите тип движения: от начала и до конца либо туда-обратно, как в «Бумеранге». Сохраните движущееся фото себе на телефон либо сразу поделитесь им в социальных сетях: в приложении вы сразу увидите иконки для «Инстаграма», Facebook, WhatsApp.
Если у вас «Андроид», самый простой вариант — использовать Loopsie: снимаете видео и замораживаете часть картинки на видео. Если у вас есть фото, которые вы хотите оживить, используйте программу «StoryZ Живые фото». Для «Айфона» подойдут приложения Plotaverse, Cinemagraph Pro. Первая из них платная.
Как создать анимацию в Photoshop. Пошаговая инструкция
Анимация уже давно превратилась в инструмент улучшения юзабилити. Она помогает взаимодействовать с интерфейсом и привлекает внимание к самому важному.
Анимация — это последовательное отображение кадров друг за другом. Каждый кадр немного изменяется, поэтому кажется, что картинка движется.
Чтобы создать простой веб-баннер или презентацию, необязательно разбираться с многочисленным софтом. Для этого подойдут и встроенные средства Photoshop. Это лишь небольшая доля возможностей программы, а раскрыть их все на практике поможет курс «Photoshop с нуля до PRO».
Пишет про дизайн в Skillbox. Рисует макеты и верстает страницы для клиентов.
C чего начать
Первым делом нужно определиться с тем, что мы будем анимировать и какого результата планируем достичь.
Для создания анимации я взял один из ярких проектов с Behance и перерисовал его в Photoshop. Выровнял по контент-сетке, подобрал размеры и поместил каждый элемент в отдельный слой. В результате у меня появился отрисованный в PSD-формате первый экран сайта, который я и анимировал.
«Шкала времени»
Перед созданием анимации необходимо подготовиться — включить отображение «Шкалы времени», которая помогает управлять кадрами в анимации.
Открываем вкладку «Окно» и ставим галочку напротив строки «Шкала времени».
Внизу окна в Photoshop должна появиться широкая строка, с помощью которой управляют кадрами в анимации.
Чтобы создать первый кадр, нажимаем «Создать анимацию кадра» на «Шкале времени».
Как первый кадр появится, можно приступить к созданию движения.
Промежуточные кадры
В Photoshop анимируют двумя способами:
Сначала я анимирую изображение балалайки. Для плавного появления изображения использую инструмент «Вставка промежуточных кадров». Чтобы Photoshop самостоятельно анимировал элемент, необходимо задать два состояния для элемента — начальное в первом кадре и конечное в следующем.
Поэтому добавляем ещё один кадр в «Шкалу времени» с помощью кнопки «Создать копию кадров».
После добавления нового кадра переключаюсь на первый и убираю видимость слоя с балалайкой. Также можно задать непрозрачность слоя 0%.
На следующем кадре проверяю, виден ли слой с балалайкой.
После работы с изображением балалайки настраиваю появление текстовой строки. В первом кадре я выделяю текст «Soul sings» и сдвигаю его вправо за пределы макета. С текстом «3 strings» поступаю так же — сдвигаю влево, пока он не исчезнет.
Как анимировать картинку
Установите и запустите программу Adobe Photoshop. Через меню «Файл» откройте вкладку «Импортировать» и кликните по пункту «Кадры в видеослои». Выберите анимацию для помещения на вашем изображении или фотографии (предварительно нужно записать или скопировать название файла данной картинки), и впишите в свободной строке появившегося окна название файла.
Дождитесь, пока программа не разделит анимацию на кадры и слои. Выберите инструмент «Волшебный ластик» (в виде иконки ластика со звездочкой) и почистите фон на каждом кадре и слое, кликая по ним мышкой. Для этого нужно щелкнуть инструментом по рабочему окну на фоне изображенной картинки. Если изображение очень маленькое и обладает множеством мелких деталей, можно увеличить ее с помощью комбинации Сtrl + колесико мышки вверх. Так вы сможете заметить, какие элементы изображения были удалены, а какие остались нетронутыми.
Разверните на весь экран изображение, на которое нужно добавить анимацию. Зажмите на клавиатуре левый Shift, чтобы выделить все слои. Перетащите все слои анимации на ваше изображение. В окне анимации нажмите правую кнопку мыши и в контекстном меню кликните по пункту «Создать кадры из слоев». Таким образом все слои будут разделены на кадры. Первый из них со статичной картинкой вам больше не понадобится, и его смело можно удалить.
Подгрузите на каждый кадр свою картинку, добавляя поочередно слой, затем кадр и нужное изображение. Разумеется, лучше следить за тем, чтобы все слои и кадры при этом соответствовали друг другу. В завершении выставьте необходимое время задержки (например, 0,15 секунд) и задействуйте анимацию. Проверьте получившийся результат.
Если вам нужна картинка с мигающей анимацией всего из нескольких кадров (например, для баннера), можно сделать это еще проще. Для начала создайте пустой слой, выбрав в главном меню функции «Слой» и «Новый». Можно также кликнуть по кнопке слева от изображающей корзину иконки.
Выберите инструмент «Заливка» (G). Выберите нужный вам цвет и кликните по изображению. Оно полностью изменит свой цвет. Укажите в качестве типа наложения «Перекрытие» и поставьте непрозрачность картинки. При этом нижний слой с расположенным на нем исходным изображением будет проступать сквозь верхний. Регулируя степень прозрачности верхнего слоя, поставьте нужную степень затемнения всего изображения. По желанию создайте еще один слой с белой заливкой. Далее настройте анимацию указанным выше способом.