Мокап как пишется

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

Для начала нам нужно википедиевское объяснение понятия мокапа (да и всех остальных дизайнерских понятий стадии готовой работы). Будем идти последовательно, начиная с идеи и заканчивая готовым продуктом

Эскиз

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

Схема (каркас)

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

Прототип

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

Дизайн-макет

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

Что же такое Мокап (mockup)?

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

Примеры мокапа:

Mockup (макет) Boeing 2707 в музее авиации им. Гиллера

Mockup (макет) Американского шатла в полную величину

Mockup (макет) интерьера, выполненный в настоящую величину и сфотографированный.

Мокапы применяются в производстве, архитектуре, программировании, текстиле, военном деле и прочих сферах. Танк без двигателя и внутренностей, выполненный в полном размере из пластика и выглядищий как настоящий; кухня, с открывающимися дверцами, стеклами и выдвижными ящичками, но выполненная в миниатюре; дизайн интерьера, выполненный в 3D Max во всех деталях, очень похожий на фотографию — всё это mockup, то бишь макеты.

Из всего вышесказанного мы можем вычленить одно:

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

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

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

Мокап — это изображение готовой работы (фотография или реалистичная иллюстрация), выполненная в формате psd и имеющая смарт-слой, в котором можно заменить тот или иной рисунок на своё изображение, получив, таким образом, демонстрацию работы в реалистичной фотографии (или иллюстрации)

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

Может пора признать, что мы подразумеваем под словом «Мокап»? У меня всё! Мнения и негодования оставляйте в комментариях. Пока.

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

Для чего дизайнеру мокап

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

Дизайнеру мокапы позволяют:

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

Какие бывают мокапы

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

Печатная продукция

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

Книги. Объемы продаж зависят не только от известности автора и актуальности темы, но и от дизайна обложки. Мокап книжного издания позволит оценить, насколько книга будет выделяться на витрине.

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

Корпоративная атрибутика

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

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

Вывески

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

Гаджеты

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

Где брать готовые мокапы

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

• freepik.com. Огромный ресурс, где представлено более 40 млн мокапов, многие из которых бесплатны. Есть премиум-подписка, которая позволяет скачивать неограниченное количество файлов в течение определенного времени.
• elements.envato.com. Удобный каталог с готовыми шаблонами, возможностью поиска с использованием фильтров и неограниченным количеством файлов для скачивания.
• mockupworld.co. На данном сайте мокапы можно искать как по разделам, так и через строку поиска. База с шаблонами постоянно обновляется.
• cssauthor.com. Сайт-агрегатор, на котором представлены мокапы со ссылками на ресурсы их авторов.
• mockuplove.com. Ресурс обновляется редко, но помимо мокапов на нем представлено и большое разнообразие шрифтов.
• zippypixels.com. Для скачивания готовых шаблонов на сайте необходимо зарегистрироваться. Ресурс предлагает массу бесплатных мокапов, но фильтры работают не всегда корректно, поэтому перед скачиванием обращайте внимание на цену.

Как подобрать подходящий мокап

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

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

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

Инструменты для создания мокапов

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

• 3Ds Max позволит создать рендер объекта с нуля;
• Adobe Photoshop даст возможность проработать модель с учетом перспективных искажений, наложить тени, блики, отрегулировать резкость изображения и т. д.

Как вставить свой дизайн в мокап в Adobe Photoshop

Если готовый шаблон уже скачан, то нужно найти его в архиве и открыть в Photoshop. Как и в других похожих шаблонах, изображение разделено на слои. Пользователю нужно найти именно тот слой, на котором находится модель для редактирования. Как правило, его название — Your design here («Ваш дизайн здесь») или Your image here («Ваше изображение здесь»). Чтобы внести изменения, нужно дважды кликнуть мышкой на иконку слева от имени этого слоя, и тогда объект для редактирования откроется в новом окне. Теперь можно вносить свои изменения — добавить PNG-макет, текст, логотип и т. д. Далее сохраняем работу в этом окне через «Сохранить» или Ctrl + S. После этого нужно открыть основной проект, в котором вы увидите внесенные изменения.

Бесплатный переводчик онлайн с английского на русский

Хотите общаться в чатах с собеседниками со всего мира, понимать, о чем поет Билли Айлиш, читать английские сайты на русском? PROMT.One мгновенно переведет ваш текст с английского на русский и еще на 20+ языков.

Точный перевод с транскрипцией

С помощью PROMT.One наслаждайтесь точным переводом с английского на русский, а для слов и фраз смотрите английскую транскрипцию, произношение и варианты переводов с примерами употребления в разных контекстах. Бесплатный онлайн-переводчик PROMT.One — достойная альтернатива Google Translate и другим сервисам, предоставляющим перевод с английского на русский и с русского на английский.

Нужно больше языков?

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

Русский[править]

Морфологические и синтаксические свойства[править]

мокап

Существительное, неодушевлённое, мужской род (тип склонения ?? по классификации А. А. Зализняка).

Корень: —.

Произношение[править]

Семантические свойства[править]

Значение[править]

1. макет продукта, который используется дизайнерами для более наглядной демонстрации созданного дизайна ◆ Отсутствует пример употребления (см. рекомендации).
2. нематицид ^? ◆ Для борьбы с нематодой применяли системные нематициды темик и мокап, но в связи с их высокой токсичностью для теплокровных препараты были сняты с испытаний. Н.В. Цицин, «Защита растений от вредителей и болезней», 1980 г.

Синонимы[править]

1. Макет
2. Набросок

Антонимы[править]

Гиперонимы[править]

Гипонимы[править]

Родственные слова[править]

Этимология[править]

От mock up — макет

Фразеологизмы и устойчивые сочетания[править]

Перевод[править]

Библиография[править]

Для улучшения этой статьи желательно: Уточнить парадигму словоизменения, используя более конкретный шаблон словоизменения Добавить описание морфемного состава с помощью {{морфо-ru}} Добавить транскрипцию в секцию «Произношение» с помощью {{transcriptions-ru}} Добавить примеры словоупотребления для всех значений с помощью {{пример}} Добавить гиперонимы в секцию «Семантические свойства» Добавить хотя бы один перевод в секцию «Перевод»