{"id":14271,"url":"\/distributions\/14271\/click?bit=1&hash=51917511656265921c5b13ff3eb9d4e048e0aaeb67fc3977400bb43652cdbd32","title":"\u0420\u0435\u0434\u0430\u043a\u0442\u043e\u0440 \u043d\u0430\u0442\u0438\u0432\u043e\u043a \u0438 \u0441\u043f\u0435\u0446\u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0432 vc.ru \u2014 \u043d\u0430\u0439\u0434\u0438\u0441\u044c!","buttonText":"","imageUuid":""}

«У вас не сайт, а боль»: как мы перестали быть олдскульными и увеличили количество сделок

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

Старый дизайн мы подсмотрели у логистов

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

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

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

2017 год, наш дизайн

А это дизайн компании Eride в 2017-м:

Логика практически одна и та же

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

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

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

В итоге многие страницы сайта прожили с нами 2,5 года – до последнего редизайна.

Ниже страница расчета стоимости MacBook. До сих пор не обновились: очень трудный движок внутри, надо много всего предусмотреть, чтобы ничего не потерять.

С 2017-го в другие страницы сайта мы постепенно добавляли мелкие элементы и вносили правки.

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

Страницу расчета стоимости iPhone обновить успели. Старый вариант:

Новый вариант калькулятора:

Ну красиво же? 

Вариант «старого» логотипа сделали за 1 час в фотошопе, выбрали самый подходящий по смыслу и запустили:

Так все начиналось

А так стало через какое-то время:

Уже чуть лучше

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

Другое дело!
Стрелка в обе стороны осталась с нами. Она символизирует быстроту обмена – наше основное преимущество.

Почему мы решили поменяться

Со старым дизайном мы жили с 2017 до 2020 года, пока к команде не присоединился человек, который в свободное время занимается венчурными проектами. Он консультирует нас по стратегическим вопросам и помогает в переговорах с крупными брендами.

Однажды на встрече он сказал: «Ребята, я настаиваю, чтобы вы сделали новый дизайн. Ваш настолько олдскульный, что мешает мне делать интро своим коллегам. Очень важно иметь современную обертку, которая соответствует трендам времени. А у вас боль, а не сайт!».

После услышанного мы возмутились и удивились. Неужели наш дизайн может кому-то настолько не нравиться? Тысячи глобальных компаний вроде Авито, Amazon или eBay абсолютно не беспокоятся по поводу дизайна, зато вкладываются в умные механизмы скоринга, в улучшение пользовательского опыта, конверсию и удовольствие от покупки.

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

Концепция

Разработка концепции заняла около двух месяцев. Наше единственное пожелание было — сохранить логику пользовательского пути.

Дизайнер обрисовал задачу так: «Обновление стиля с заданными константами в виде метафоры логотипа и приведение коммуникации к общему знаменателю».

Важно было пересмотреть структуру и найти универсальное решение для добавления любых типов устройств, так как сервис предоставляет возможность избавиться почти от любой техники Apple или Samsung.

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

Ниже визуальные примеры того, что было:

Было: главная страница
Было: главная страница, нижний экран

А вот что стало в 2020-м году:

Стало: главная страница
Стало: главная страница, нижний экран

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

Старый шрифт
Новый шрифт

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

В процесс дизайна мы почти не вмешивались. Нам предложили три варианта в рамках одной концепции. Мы выбрали самый простой и лаконичный.

От этого варианта отказались: слишком видимая приоритизация техники

И от этого варианта отказались: темный, непонятный, совсем не про нас

В результате остановились на существующем варианте, который зарелизили примерно на 70%. Остальное в процессе.

И еще раз. Было:

Стало:

Новая страница iPad

Было:

Старая страница PlayStation

Стало:

Что в итоге

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

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

Тем не менее, надеемся, что сейчас мы достигли общего знаменателя: и сбалансированного дизайна, и удобного технологичного решения.

Конверсии не упали – наоборот, выросли. Вряд ли это полностью связано с новым дизайном. Думаем, что это совокупность факторов всего 2020-го, которые в целом повлияли на наш бизнес. В прошлом году рост количества сделок показал + 300%.

Предлагаем вам оценить наш путь не только на уровне нравится/не нравится, а пройти до конца – и написать в комментариях, что смущает, а что зашло в новом дизайне.

0
76 комментариев
Написать комментарий...
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Ревизор

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

Ответить
Развернуть ветку
Сергей Алексейчиков

Да-да, первое, что подумалось — расскажите дизайнеру о шрифтовых пАрах.

Ответить
Развернуть ветку
Елена Богатырева

Дизайнер читает. Если найдет аргумент прокомментировать, услышим *почему*

Ответить
Развернуть ветку
Дюша Метёлкин

Оценил свой крутой и довольно редкий по нынешним временам МБП. Примерно раза в два, два с половиной меньше рынка. 

Редизайн решит все проблемы, ок :)

Ответить
Развернуть ветку
Елена Богатырева

Проблемы решаем, а редизайн помогает. 

Ответить
Развернуть ветку
1 комментарий
Igor Reverb

Посчитал аймак 2019, 580x, 2tb, 32 ram, в идеальном состоянии - от 65к.
Вы угараете?

Кстати, в опросе отсутствует модель видеокарты, а это очень важно.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
1 комментарий

Комментарий удален модератором

Развернуть ветку
Igor Reverb

Стрелка в логотипе, которая ещё и удлиняется анимацией, говорит вовсе не о простоте и быстроте сделки, а об обратном.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Елена Богатырева

С чем *обратным* у вас ассоциация? 

Ответить
Развернуть ветку
2 комментария
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Елена Богатырева

Добрый вечер. 1. Мы выкупаем в линейке Huawei только флагманские модели, остальные совсем не ликвид. 2. Как написали, некоторые разделы до сих пор переносим на новый дизайн, процесс небыстрый ... спасибо за *в целом неплохо* :)

Ответить
Развернуть ветку
28 комментариев
Александр Егизаров

А вот с телефона не просто будет пользоваться. Могу полноценно видеть только продукты в верхней линии...
Но что совсем непонятно это почему iMac спрятан в разделе Macbook. Для Apple Pencil есть отдельная категория, а чтобы посмотреть предложение по стационарному iMac надо догадаться что он спрятан среди ноутбуков. Я бы на вашем месте это поправил...

Ответить
Развернуть ветку
Елена Богатырева

Это баг, поправим. Про iMac в разделе макбуков была определенная логика. 

Ответить
Развернуть ветку
4 комментария
Фанат Bioware

Редизайн это шикарно, а что говорят метрики? Насколько выросли конверсии? Насколько снизилось количество отказов?

А то я бы не сказал что прошлая версия выглядит совсем плохо. 2017 был не так давно и решения тех лет еще не сильно устарели.

Ответить
Развернуть ветку
Елена Богатырева

Согласны, что с 2017 года решения не устарели. Это была одна из позиций,  и история сама именно про это. А метрики растут, но тут дизайн вряд ли имеет определяющее значение 

Ответить
Развернуть ветку
1 комментарий
Неумный комментатор

Я вообще не увидел никакой нужды в редизайне.

Ответить
Развернуть ветку
2 комментария
Евгений Кирюхин

Выглядит хорошо, только прошлый шрифт выглядит читабельней, новый какой-то чересчур вытянутый и странный

Ответить
Развернуть ветку
Елена Богатырева

Ровно такое же впечатление было сначала. Но иногда тренды работают вперед нас, мы должны их  понять. Шрифт вроде теперь даже нравится. 

Ответить
Развернуть ветку
Алексей Медведев

Покажите когда доделаете. Вообще, лично для меня, концепт интересный очень. Всё как мне нравится)) 

Ответить
Развернуть ветку
Елена Богатырева

👌

Ответить
Развернуть ветку
Artem Sovetnikov

После "дизайн мешает мне продавать" читать стало тоскливо

Ответить
Развернуть ветку
Елена Богатырева

Жаль. Статья не про это. 

Ответить
Развернуть ветку
Vladimir Batenev

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

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

Ответить
Развернуть ветку
Елена Богатырева

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

Ответить
Развернуть ветку
Vladimir Batenev

какие нахрен достижения ;) дно пробито

Ответить
Развернуть ветку
Vladimir Batenev
В прошлом году рост количества сделок показал + 300%.

спасибо налоговой bo.nalog.ru
гляну всенепременно и возьму слова про отсутвие пруфов обратно, только к чему тянуть... кладите сюдой.

з.ы. я не душный, меня такие как вы с"""ка трижду уже кинули
ё:) 

Ответить
Развернуть ветку
Vladimir Batenev

Сообщение удалено

Ответить
Развернуть ветку
Vladimir Batenev

Сообщение удалено

Ответить
Развернуть ветку
Sysmet

Dropbox же

Ответить
Развернуть ветку
Евгений Востров

Крутой редизайн, но полоса прокрутки режет глаз) И про шрифтовые пары тоже правильно отметили, под кнопки и описательный текст просится обычный шрифтец, типа roboto или inter

Ответить
Развернуть ветку
Илья Ефимов

Она вообще уже немного морально устарела и если что, лучше её внизу располагать.

Ответить
Развернуть ветку
1 комментарий
Александр Львов

На большом мониторе слишком резиново получилось

Ответить
Развернуть ветку
Елена Богатырева

Главное, рейтинг 5 :)

Ответить
Развернуть ветку
Yevgeniy Khaimin

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

Ответить
Развернуть ветку
73 комментария
Раскрывать всегда