Synthesis

За прототип взяли функционирующий сайт продукта и работали небольшими итерациями. Изменяли визуал, пользовательский опыт и параллельно внедряли новые идеи в продукт

о проекте

Synthesis — магазин по продаже технологичной одежды, практичной и минималистичной.

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

запрос

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

цели 

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

• собрали текстовый прототип для каждой страницы
• обсудили референсы и стиль для новой концепции
• обсудили наброски для новых страниц сайта

процесс

интервью

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

Во время интервью мы составили текстовые прототипы страниц. Обсуждали и фиксировали:

• что хочется изменить в текущих версиях страниц
• какие новые блоки мы добавим, и как примерно их представляем себе
• и какие есть особенности у блоков.

Обсудили референсы и визуальный стиль для новой дизайн-концепции. Также обсудили наброски для новых страниц сайта

дизайн-концепция

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

Дизайн-концепция получила блочную структуру и схожесть с интерфейсом операционной системы

Помимо визуальных изменений проработали структуру главной страницы:

• отобразили категории товаров магазина с крупными фотографиями, по которым можно определить качество изделий
• показали пример товара из каждой категории, чтобы сформировать ожидание для пользователей по стоимости изделий

• спроектировали интерактивный блок личного кабинета прямо на главной странице

• рассказали об условиях доставки и оплаты

• и показали программу лояльности

страница товара

• внедрили наглядный выбор цвета изделия
• показали количество наличия каждого размера
• спроектировали 3D-просмотр одежды на модели

Отдельно о подборе

После интервью с клиентом нам было известно, что частый запрос от пользователей — непонятно, какой размер мне подойдет? А будет хорошо сидеть? Или как мешок?

Стандартные маркировки размера S, M и L на эти вопросы не давали ответов. Поэтому совместно с клиентом мы решили разработать систему подбора размера по индивидуальным параметрам — росту и весу человека.

также проработали:

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

визуальный дизайн

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

корзина и оформление заказа

• спроектировали корзину в формате «шторки»

внедрили возможность добавления размера для примерки прямо в корзине и объяснили человеческим языком пользователю — «Закажите два размера и не оплачивайте товар, если он не подошел вам»

• на странице оформления заказа упростили весь интерфейс и оставили самое важное для этого этапа

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

итоги

Мы разработали новую дизайн-концепцию и обновили визуальный стиль. Улучшили пользовательский опыт:

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

отзыв клиента

Нам оставили очень теплый отзыв и пообещали советовать наше агентство!