Кейс-пьеса. Проектирование и дизайн сайта

Заказчик пришёл за дизайном лендинга, а получил - экспертную доработку, улучшение структуры каталога и новый интерфейс интернет-магазина. И дизайн, конечно…

Было 2 варианта:

Углубляемся в тему и детально изучаем услугу. И сразу предлагаем заказчику идеи по улучшению проекта.

Если коротко, мы увидели 2 направления в услуге, которые нужно было разделить, по нашему мнению:

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

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

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

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

Впоследствии наши “опасения” подтвердились, но об этом в следующих сценах… После заключения договора и начала работы над проектом.

Поэтому сначала родилось 3 решения.

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

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

Сделали варианты с жёлтым и оранжевым цветом. Это цвета, которые напрямую ассоциируются с картонными изделиями, лучше всего подчеркивают их. Тёплые цвета также настраивают потенциального покупателя на положительную волну и мотивируют к заказу.

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

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

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

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

Когда пользователь заходит в меню, он путается и не понимает, какие категории уже просмотрел, а какие нет, отличаются они или нет. В каталоге нет логики и не продуман путь клиента.

По факту получился двухуровневый каталог. И только в паре категорий — 3 уровня. Также визуально выделили разделы «Упаковка на заказ», «Упаковка в наличии» и «Печать на упаковке», вынесли их в пункты меню.

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

Информации очень много. Разместить её в полном объёме, не перегрузив карточку — действительно задачка со звёздочкой. Но мы справились:

Таким образом, из текстовой информации на карточке осталось название товара и текст на главных кнопках «В корзину» и «Купить в 1 клик».

Поработали с текстом как по содержанию, так и по расположению на странице:

После этого прототипы страниц Категории и Товара отправили на согласование заказчику.

Разработали дизайн страниц Категории и Товара в стилистике главной страницы сайта.

Заказчик оценил дизайн и решил продолжить в том же духе стиле. Нам предстояло сделать редизайн страниц:

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