Мокап ликбез — все что нужно знать про мокапы



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

Мокап (или mock-up на английском) — это специальным образом подготовленный файл, в котором можно свой дизайн размещать на реальных предметах. Они нужны, чтобы показать как картинка будет выглядеть в реальной жизни. Обычно это PSD файл со смарт-объектом, на который и вставляется картинка с дизайном. Бывают и просто JPEG картинки, называемые мокапами, но работать с ними сложно, нужно долго искажать картинку и вписывать ее в окружение.

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



То же самое и с шрифтами и с эффектами. Для того, чтобы этого избежать, стоит превращать все элементы в смарт-объекты. Для того чтобы создать смарт-объект, откройте любое изображение в фотошопе. Далее преобразуйте фоновый слой в обычный (редактируемый), для этого двойным щелчком мыши кликните по нему и нажмите ОК либо создайте его дубликат, для этого нажмите комбинацию клавиш Ctrl+J. Затем, щелкнув правой кнопкой мыши по преобразованному/дублированному слою из контекстного меню выберите «Преобразовать в смарт-объект». После того, как Вы это сделали, на миниатюре Вашего слоя появится небольшая иконка, которая означает, что слой является смарт-объектом.



По сути смарт-объект — это контейнер, изменения которого не затрагивают объект внутри. Можно растягивать, уменьшать, применять эффекты не теряя качества картинки или шрифта. По умолчанию кстати все картинки, которые перетаскиваются в ФШ, становятся смарт-объектами.

Редактирование смарт-объектов происходит как редактирование отдельного файла в отдельном окне (создается временный файл в формате .psb, привязанный к основному файлу). Изменение и сохранение этого файла приводит к изменению основной картинки.

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

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

freedesignresources.net/category/free-mockups/

store.mockupzone.com/free-files/

graphicburger.com/mock-ups/

www.mockupworld.co/all-mockups/

www.graphicsfuel.com/category/mockup-templates/

pixelbuddha.net/freebies/tag/mockups

Большая коллекция бесплатных мокапов с Биханса www.behance.net/collection/20880985/Best-Free-Mockup

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



Показывайте свои работы красиво — пользуйтесь мокапами blue_heart

18 комментариев

ievgeniia
  • ievgeniia
Спасибо огромное за статью!!! Теперь точно попробую использовать мокапы) Очень они мне нравятся.
❄ Летта
Конечно попробуй) Это здорово и не так сложно как кажется thumbsup
Ira Dvilyuk
Очень нужная статья, особенно когда на КМ обложки делать надо, большое спасибо!
Dilettante
  • Dilettante
спасибо (в очень далёком пока для меня будущем, но пригодится точно!)
Lumitar
  • Lumitar
Очень нужно и очень вовремя! Спасибо преогромное :)
Daria Miazhevich
Просто море благодарности за этот пост! Благодаря ему мне не пришлось искать эти ссылки, которые я изучила вдоль и поперек и даже нашла то, что было нужно! Это значительно облегчило мне работу. Плюс я поняла принцип работы)
❄ Летта
Уиии я так рада всегда, когда посты приносят пользу! heart
Принцип работы простой, но не очевидный, я в свое время тоже тормозила из-за этого, пока не разобралась что к чему) Кстати если знаешь какие-то бесплатные площадки еще с мокапами — делись, добавлю в пост)
Daria Miazhevich
Не, таких площадок не знаю :)
Филипп
Спасибо за такую фичу, а то делаю сам мокапы, продаю и даже не знаю что так можно)) на шатере то просто продаю как растры без каких либо смарт слоёв. а на креативе можно запилить такую штуку, покупателям понравится больше. чем просто картинка без всего)) Ещё делают мокапы, где все предметы на отдельном слое с тенями. их можно всячески двигать, составлять композицию, убирать, вставлять, менять им материал, цвет и тд. Люди там до таких тонкостей настроек доходят, что страшно становится… в общем ещё учиться и учиться
❄ Летта
Оооо я когда вижу просто фотки на Креативмаркете как мокапы мне прямо хочется рыдать) Просто были моменты, когда я с таким корячилась и это жуть как неудобно. А на Креативе кстати русские с мокапами рулят в основном wink
Филипп
Ну вот я чуял шестым чувством. что что то в моих мокапах не хватает, поэтому и не выкладывал особо до сих пор, но теперь то я знаю чего моим мокапам не хватало, настало время действовать, тем более хороший архив для работы накопился, и что примечательно рендерил я всё со слоями масками. так что не нужно будет обводить предметы руками лассо, всё уже есть))) Кстати это плюс 3д рендеров перед фотками.
❄ Летта
настало время действовать
Золотые слова! Действуй! smile Теперь ты во всеоружии)
Филипп
в общем это судьба, я всё ждал знака свыше, и вот ОН!!! pray smiley
❄ Летта
«Валера, пришло твое время» joy
Ну тебе то вообще просто, раз говоришь по слоям все разложено. Все в смарт-объекты загоняешь, вставляешь надписи в нужные места и искажаешь кое-где, если сложный объект.
Danee
  • Danee
Иногда, когда ищешь нужный мокап, вымораживает их перфекционизм. Очень мало мокапов с реальными сценками, когда предметы лежат хаотично, а не стерильно строго вертикально или строго горизонтально. Что поделать, иногда я люблю хаос. Когда он к месту, конечно.
❄ Летта
Очень мало мокапов с реальными сценками, когда предметы лежат хаотично, а не стерильно строго вертикально или строго горизонтально.
Так просто меньше всего визуальных искажений, поэтому и самый распространенный вариант.
Favete
  • Favete
Добрый день! Я Ольга, автор блога саксессфулстокер, пишу статью про мокапы. Скажите, можно я процитирую ваш список бесплатных ресурсов для поиска мокапов и добавлю ссылку на этот полезный пост? :)
❄ Летта
Привет, Ольга, рада видеть вас здесь)
При наличии активной ссылки на пост я не против)
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.