Mock up ("мокап") - це Навіщо потрібен і як його зробити?

"Мокап" – це вузькоспеціальний термін, яким користуються в основному дизайнери. У прямому значенні слово мокап означає макет . З його допомогою професіонал створює тривимірну візуалізацію чого завгодно, наприклад упаковки або поліграфії. Часто він використовується в рекламі. Простий приклад: мережа швидкого харчування «Макдональдс». Апетитний гамбургер на зображенні – не фотографія, а візуальна ідеалізація того, що хочеться купити і з'їсти. Якщо пропонований товар знаходиться всередині середовища, то виглядає краще і вигідніше, ніж звичайний скріншот (знімок).

Що це?

Мокап – це макет, який використовується дизайнерами для того, щоб продемонструвати замовнику товар чи продукт. Наприклад, майбутню візитну картку, обкладинку компакт-диска, фотоальбом, листівку, зміст або зовнішній вигляд книги. Завдяки цьому способу замовник візуально оцінює запропонований фахівцем дизайн в робочому середовищі. Виходить не просто плоска фотографія, а вже накладений макет на продукт. Mock up дозволяє побачити кінцевий результат в реальності. Він спрощує взаємодія замовника і дизайнера. Візуальні макети дозволяють тестувати продукцію на стадії розробки, вносити зміни, поправки до друку. Mock up хороший тим, що це нескладна, маловитратна за часом робота, якою можуть навчитися всі без винятку. Для того щоб досконало оволодіти цією технікою, важливо мати уявлення про дизайн, почуття смаку, стилю, заходи, знання про сумісність кольору, уміти працювати в графічних редакторах. Під час освоєння мокапа перегляньте роботи відомих дизайнерів, вчіться на чужих прикладах і помилки.

Навіщо він потрібен?

Мокапи потрібні професійним дизайнерам, фрілансерам, художникам, які працюють на замовлення і створюють дивовижно гарні роботи. Пізніше вони презентуються клієнтові в кращому вигляді. Мокап створюється з метою продемонструвати історію малюнки або написи, що покращує продукт і допомагає споживачам зробити вибір на його користь. Технічно мокапи – PSD-файли з підтримкою смарт-об'єктами (шари у програмі "Фотошоп", які дозволяють вставити дизайн в потрібне місце). Мокапами можуть бути і фотографії. Наприклад: блокнот, що лежить на столі, або візитка. Мокап можна зробити самостійно, купити або безкоштовно скачати готовий.

Як його створити?

Мокап – це макет з нуля. Зробити ідеальну роботу легко з допомогою відомої програми "Фотошоп". Наприклад, якщо потрібно створити логотип або напис на візитку, краще всього скористатися готовими файлами. На спеціальних ресурсах є безліч фотографій з порожніми візитками, що лежать на столі. Слід відкрити фотографію в Photoshop і файл з готової написом. Її потрібно грамотно помістити на візитку так, щоб створювалося відчуття реальності. Для цього використовуються всі доступні інструменти програми. Для такої роботи потрібно початкове знання графічного редактора. Якщо не знаєте, як зробити мокап самостійно, вивчите теорію, а також постійно тренуйтеся. Існує особливий алгоритм самостійного створення мокапа. Хочете продемонструвати замовнику напис або цитату? Приготуйте фотоапарат і предмети для сцени: блокнот, гарний нейтральний фон. Виставите правильне освітлення, розташуйте об'єкти і зробіть кілька знімків.

Сфери застосування

Тепер читачі знають, що мокап – це макет візитки, журналу, книги, листівки, на який дизайнер накладає конкретну картинку, фотографію або напис. Цей процес допомагає візуалізувати роботу (наприклад, зробити напис на картці) і дозволяє замовникові зрозуміти, як буде виглядати результат. Мокап застосовується в створенні сайтів, веб-додатків, поліграфії, рекламних банерів, вивісок, меню і багато іншого. Часто до нього звертаються дизайнери інтер'єрів, коли готують проект приміщення.

Мокап сайту

Створити мокап сайту зі знанням справи можуть лише професійні веб-дизайнери. Причина проста – фахівці не впадають в паніку, якщо замовник вимагає доопрацювання яких-небудь деталей. Мокап допомагає дизайнеру побачити ідею, розвивати і вдосконалювати її в подальшому. Веб-каркас – це схематичний план інтернет-сторінки. Спочатку дизайнер малює від руки на аркуші паперу. Це потрібно, щоб ефективніше використовувати інструменти графічних редакторів. Каркас сайту створюється в чорно-білому кольорі, що дозволяє розробнику намітити розташування головних елементів: логотипу, меню, контенту, рекламних блоків. Після каркаса дизайнер розробляє прототип сайту: колір і стиль. На допомогу приходять одинадцять корисних інструментів. Вони виручать при створенні всіх деталей сайту. Зверніть увагу на програми InVision, UXPin, Marvel App, Gliffy, OmniGraffle, Moqups, Axure, JustinMind, Mockingbird, HotGloo, Mockplus. Наприклад, Mockplus – простий інструмент дизайнера. Він допомагає створити каркас, перейти від чорно-білого варіанту до кольорового. Даний інструмент дозволяє використовувати більше двохсот компонентів, які значно спрощують створення сайту. На допомогу дизайнеру приходять і інші програми. З їх допомогою легко створювати елементи сайту, опрацьовувати деталі, вчитися. Найпоширеніший і простий спосіб отримати навички – зробити мокап візитки.

Графічний редактор

Photoshop – одна з програм, яка приходить на допомогу дизайнера при створенні різних проектів і макетів. Мокапи для Фотошопу – це готові PSD-файли. Завантажити їх можна на платних, безкоштовних ресурсах або ж зробити самостійно. Найпростіше знайти готовий мокап і застосувати для демонстрації основної роботи. Спробуйте зробити напис для буклету або листівки. Придумайте ідею, визначтеся з кольором. Зробіть начерк від руки на аркуші паперу. Потім втілити задум у графічній програмі. Легкий і популярний варіант серед новачків – це мокап візитки. Відкрийте завантажений файл, напис і текст. Перейдіть до готового мокапу, натисніть на значок "Смарт-об'єкт" (це повинно бути зображення візитної картки), виберіть у меню "Редагувати вміст". Відкриється В новій вкладці об'єкт, готовий для зміни. Далі активуйте створену напис або текст і перенесіть на поверхню візитки. Напис можете трансформувати, змінити розмір, вибрати найбільш підходяще місце її розташування. Збережіть проект.

Джерела

Немає нічого складного в створенні мокапов. Вони спрощують основну роботу дизайнера, економлять сили й час. Якщо є бажання, створіть власну базу таких файлів і займіться їх продажем. Але для цього знадобиться хороший фотоапарат, навички зйомки, предмети, знання освітлення, почуття добре розвиненого смаку і стилю. Джерелами зображень можуть стати ресурси, які за певну плату продають готові картинки для демонстрації дизайну чого-небудь. Якщо немає вільних коштів для купівлі мокапов, дизайнеру пропонується велика кількість безкоштовних джерел. Там з легкістю можна знайти для скачування тисячі красивих картинок на будь-яку тематику. Мінуси готових мокапов: однотипність, відсутність індивідуальності, шаблонність. Плюси – доступність, краса, мінімалістичність, максимальний реалізм, зручність. Якщо займаєтеся дизайном професійно, обов'язково майте напрацьовану базу мокапов. Вона повинна підкреслювати стиль автора, вигідно демонструвати предмет продажу, залучати замовника.