1. Вкусы не обсуждаются
2. Перед тем как заказывать графический дизайн ...
3. Ключевые вопросы
4. Кто сделает для вас хороший графический дизайн?
5. Как вы находите нужных людей?
6. «Давайте будем серьезными, когда речь заходит о деньгах», - писал Томаш Карватка.
7. За что вы платите при заказе графического дизайна?
8. У вас действительно небольшой бюджет и вы не можете позволить себе специалистов?
9. Что искать? - совет специалиста
10. # 1 Это точно интернет-магазин?
11. № 2 Основная цель - выполнение заказа
12. # 3 Согласованность во всем проекте
13. # 4 Соответствие корпоративной визуальной идентичности и специфике бизнеса
14. # 5 Отзывчивость (RWD)
15. # 6 Не балансируйте открытую дверь
16. # 7 Иерархия действительности
17. # 8 Композиция, четкость, читабельность
18. № 9 Навигация
19. # 10 Место для рекламных акций
20. # 11 Фотографии продукта
21. # 12 Акцент на "призыв к действию"
22. # 13 Внимание к деталям
23. Проект это еще не все
24. И конечно - графический дизайн должен иметь что-то!

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

Первая часть статьи посвящена типичным дилеммам, связанным с заказом графического дизайна. Я также предлагаю, как подготовиться к этому процессу. Во второй части я представляю советы экспертов (от Ideacto, Webmagic, Edisonda, Siteimpulse, WitFlow, StronyDlaFirm.eu), которые предлагают, на что обратить внимание при разработке / заказе графического дизайна для интернет-магазина.

Вкусы не обсуждаются

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

Перед тем как заказывать графический дизайн ...

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

Ключевые вопросы

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

• Какое цветовое решение вам больше всего нравится - светлое или темное? Подумайте, какие сайты привлекли ваше внимание. Они хранятся в темных или светлых тонах? Это хорошая отправная точка для определения общего «климата» вашего будущего интернет-магазина.
• Какие именно магазины и сайты вам нравятся? Запишите их. Они позволят вам познакомить вашего будущего подрядчика с дизайном вашего вкуса и чувством эстетики.
• Какими должны быть цвета, ведущие в графическом дизайне вашего интернет-магазина? Запишите их. Помните, что слишком много используемых цветов может создать впечатление беспорядка, а графика становится слишком пестрой (однако это зависит от отрасли, потому что, например, в магазине детских игрушек многие цвета могут хорошо работать). Это хорошо, чтобы основать макет на нескольких основных цветах. Здорово, если они совпадают с общими цветами компании, которые есть в логотипе и на рекламных материалах. Это повысит узнаваемость бренда и будет соответствовать визуальной идентичности компании.

Читайте интересные статьи о:
Важность цветов в рекламе - блог Landingi
Теория цветов и психология цветов - с переходом в мир бизнеса
Значение цветов - инфографика

Кто сделает для вас хороший графический дизайн?

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

Как вы находите нужных людей?

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

«Давайте будем серьезными, когда речь заходит о деньгах», - писал Томаш Карватка.

И так как мы говорим о затратах .... Действительно хороший графический дизайн будет стоить дорого. Я не хочу никого пугать здесь, но ... это правда. Если вы ожидаете, что за 100 злотых брутто кто-то создаст для вас уникальный макет интернет-магазина, он «потеет» и поместит его в код платформы - вы ошибаетесь. Почему я пишу об этом? Потому что, к сожалению, многие так думают. Я преувеличиваю? Нет. Я видел такие предложения в Интернете. Я подозреваю, что никто не принимает такие заказы, потому что они несерьезны. И они бесчеловечны. Сможете ли вы проработать дюжину или несколько десятков часов за такую ​​ставку? Это займет так много времени. Много долгих и трудоемких часов. Будь человеком.

За что вы платите при заказе графического дизайна?

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

У вас действительно небольшой бюджет и вы не можете позволить себе специалистов?

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

Что искать? - совет специалиста

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

# 1 Это точно интернет-магазин?

Ссылаясь на исследование Uxerii Положительный прием сайта в 71% зависит от того, знаем ли мы, заходя на данную страницу, какова ее цель и для чего она используется. «Мы часто заходим на сайт и не знаем, для чего он используется и что он продает - это ошибка. Очень важны элементы «призыва к действию», а также информация (она может быть графической, анимированной) о том, что сайт делает и что он предлагает ».

Петр Зданович, UI / UX дизайнер, Webmagic.

№ 2 Основная цель - выполнение заказа

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

«Интернет-магазин - это особый тип веб-сайта, который, независимо от отрасли, целевой группы и предложения, имеет одну цель - преобразование пользователей в заказы. В случае электронной коммерции все визуальные элементы подчинены так называемым воронка преобразования, то есть путь, по которому мы хотим, чтобы пользователь следовал. Графический дизайн, понимаемый как создание (своего рода «связывание»), должен быть инструментом брендинга, но он имеет здесь второстепенную задачу и не должен мешать основной задаче. Этот принцип должен сопровождаться разработкой каждого отдельного элемента - чтобы не отвлекать пользователя от того, что важно ».

Конрад Кабан, Управляющий директор, Siteimpulse

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

Полина Сивец, дизайнер UX, WitFlow

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

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

# 3 Согласованность во всем проекте

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

• домашняя страница,
• страница продукта,
• страницы процесса покупки от корзины до подтверждения размещения заказа,
• список товаров (все виды, доступные в магазине - например, список, миниатюры),
• страница контактов,
• Регистрационная форма.

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

Ярослав Брикович, графический дизайнер, Ideacto.

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

Marcin Kręcioch, креативный директор Edisonda

# 4 Соответствие корпоративной визуальной идентичности и специфике бизнеса

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

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

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

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

«Все должно быть сбалансировано и адаптировано к отрасли. Например, в магазине, где продаются гробы, нельзя использовать Comic Sans и яркие цвета ».

Петр Зданович, UI / UX дизайнер, Webmagic

# 5 Отзывчивость (RWD)

Убедитесь, что графический дизайн хорошо выглядит на разных экранах. Интернет-магазин должен хорошо выглядеть на настольных компьютерах с большими экранами, на ноутбуках, планшетах и ​​смартфонах. В настоящее время это не должно быть дополнительным предложением при заказе графического дизайна. Это основа и ДОЛЖНА ИМЕТЬ . Статистический польский интернет-пользователь уже использует 4 устройства, подключенных к Интернету. (согласно исследованию TNS) , «Дизайн должен хорошо смотреться на мобильных устройствах. Иногда это требует дополнительного проекта для мобильных устройств. Здесь очень важно, что это не урезанная функциональная версия настольной версии ».

Петр Зданович, UI / UX дизайнер, Webmagic

«RWD (адаптивный веб-дизайн) - это не расточительность, а стандарт. Если вы создаете магазин, он должен быть адаптивным, то есть адаптированным для отображения на мобильных устройствах, таких как планшет или смартфон. Магазин, созданный по такой технологии, автоматически подстраивает свой внешний вид под разрешение экрана, на котором он отображается. Это важно, потому что более половины подключенных к сети устройств являются мобильными устройствами ».

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

# 6 Не балансируйте открытую дверь

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

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

Marcin Kręcioch, креативный директор Edisonda

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

Конрад Кабан, Управляющий директор, Siteimpulse

# 7 Иерархия действительности

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

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

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

Ярослав Брикович, графический дизайнер, Ideacto.

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

Marcin Kręcioch, креативный директор Edisonda

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

Полина Сивец, дизайнер UX, WitFlow

# 8 Композиция, четкость, читабельность

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

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

Ярослав Брикович, графический дизайнер, Ideacto.

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

Marcin Kręcioch, креативный директор Edisonda

«Особенностью хорошего графического дизайна является простота , определенный минимализм (в соответствии с популярным подходом KISS - Keep It Simple, Stupid), который в электронной коммерции даже важнее, чем другие типы веб-сайтов - например, веб-сайты компании».

Конрад Кабан, Управляющий директор, Siteimpulse

№ 9 Навигация

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

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

Marcin Kręcioch, креативный директор Edisonda

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

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

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

Полина Сивец, дизайнер UX, WitFlow

# 10 Место для рекламных акций

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

«Пусть покупатель тратит деньги в вашем магазине. Используй продажи и перекрестные продажи. Не забудьте разработать место для продвижения цены (например, снижение цены на продукт на 30%), количественного (например, теперь для каждого комплекта поддонов бесплатно), специальных действий (например, день бесплатной доставки) и связанных продуктов, отображаемых на подстранице продукта. , Благодаря этому вы увеличите количество заказов, распродаж и кросс-продаж ».

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

# 11 Фотографии продукта

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

Читайте статью о фотографиях в интернет-магазине

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

Петр Зданович, UI / UX дизайнер, Webmagic

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

Marcin Kręcioch, креативный директор Edisonda

# 12 Акцент на "призыв к действию"

Это имеет ключевое значение при разработке кнопок. Если кнопка связана с важным действием, выполняемым пользователем (например, добавлением товара в корзину или размещением заказа), содержание, содержащееся в ней, может оказать большое влияние на то, делает ли пользователь то, что мы от него ожидаем, или нет. «Поощряйте потенциальных клиентов к действию - что в данном случае является покупкой. Сделайте все, чтобы пользователь не отложил транзакцию «на потом» или чтобы не было недостатка в информации, необходимой для совершения покупки. С каждым продуктом, убедитесь, что потенциальный покупатель сделал правильный выбор, и предложите ему купить товар. Вы можете использовать такие фразы, как: «Последние товары, купить сейчас!», «Купить сейчас. Мы рекомендуем! », Не обманывайтесь покупкой, теперь, покупая этот товар, вы уверены, что он оригинальный!» И т. Д.

Дамиан Макура, управляющий директор, StronyDlaFirm.eu

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

Полина Сивец, дизайнер UX, WitFlow

# 13 Внимание к деталям

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

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

Marcin Kręcioch, креативный директор Edisonda

Проект это еще не все

Графика должна быть добавлена ​​в т.н. mockupy. Это контуры отдельных страниц, которые взаимодействуют с пользователем. Это позволяет моделировать операции магазина на основе проекта. Я рекомендую выбирать компании, которые в состоянии представить работу будущего магазина на макетах. Благодаря этому вы можете быстро уловить трудности в навигации, проблемы с интуитивно понятным управлением магазином или другие ошибки, которые снижают общее удобство использования интернет-магазина. Внесение исправлений на этапе проектирования намного дешевле и эффективнее, чем внесение изменений в работающую систему.

И конечно - графический дизайн должен иметь что-то!

В конце я хотел бы обратить ваше внимание на неопределенный аспект проекта - ЭТО ЧТО-ТО ! Это сложно описать, определить, но если вы видите проект, вы чувствуете, что в нем есть ЭТО ЧТО-ТО - это здорово!

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

Похожие

Комментарии