Привет, это Antro. Собрали материалы о клиентском опыте, UX и проектировании интернет-магазинов в самое подробное руководство на площадке. С его помощью можно довести интернет-магазин до идеала и дизайнерам, и маркетологам, и собственникам.Мы специализируемся на интернет-магазинах, поэтому делимся опытом, как правильно их проектировать. В каждом нашем проекте опираемся на данные профильных дизайнерских институтов и собственные исследования. Для этой статьи подготовили подборку из собственных материалов о CX и UX: в них мы рассказываем, что сделать до дизайнерской работы, как переделать интернет-магазин, создать его с нуля, где посмотреть хорошие примеры.Как разобраться, что вам нужно от дизайнаПрежде чем начинать разработку дизайна, стоит определить, чего вы хотите с помощью него достичь. Мы считаем, что дизайн в конечном итоге должен превращаться в прибыль для компании, поэтому смотрим на него как на часть клиентского опыта.Исследования показывают, что похожим образом на бренды смотрят и покупатели: 37% пользователей готовы отказаться от компании уже после первого негативного опыта, а 46,1% покупателей определяют надёжность сайта по его привлекательности.Теорию для целеполагания мы разобрали в двух статьях:Когда UX недостаточно: как CX и EX влияют на успех продукта;Почему UX важен: как рассчитать рентабельность инвестиций в дизайн.После того, как определите, какой эффект хотите от дизайна, стоит определить потребности аудитории. Зачастую для этого мы проводим собственные исследования. В нашей практике есть кейсы, как с помощью такого исследования сэкономили клиенту несколько сотен тысяч и несколько миллионов рублей. Статьи о том, как подготовиться к разработке:Виды пользовательских исследований: глубинное интервью, часть первая;Где искать респондентов и как приглашать на исследование: глубинное интервью, часть вторая;Метод персон в UX: зачем нужен, почему работает и как применять.Стоит построить путь пользователя к вашему продукту — CJM. Или не стоит. Разобрались в двух статьях, за которые получили серебро Tagline Awards 2022:Как строить CJM: 7 нюансов, которые снижают эффективность, часть 1;Как строить CJM: не даём карте лечь в стол, часть 2.Во всех теоретических статьях мы делаем схемы, графики и другие иллюстрации: так материалы становятся понятнее и интереснееКак изменить действующий интернет-магазинПредставим: вы уже продаёте товары в интернете, они качественные и по рыночной цене, но продаж мало. В этом случае стоит оценить, насколько эффективно работает дизайн приводит пользователя к покупке.Мы подробно рассказали, в каких случаях и как редизайнить интернет-магазины четырёх статьях:Делаем редизайн интернет-магазина с умом. Где брать идеи и как их проверять;Делаем редизайн интернет-магазина с умом. Преимущества и недостатки постепенных изменений;Делаем редизайн интернет-магазина с умом. Плюсы и минусы разных команд и как выстроить работу;Делаем редизайн интернет-магазина с умом. 10* ошибок и как их исправить;Делаем редизайн интернет-магазина с умом. 10* ошибок и как их исправить (часть 2).Статьи по разработке пишем строго по науке: не фантазируем об идеальном дизайне, а подкрепляем всё измеримыми показателямиЧто продумать в дизайне интернет-магазинаМы создали самый просматриваемый цикл статей о дизайне интернет-магазинов на vc.ru. Всего вышло 6 статей:Как влияет дизайн магазина на пользователей | Дизайн интернет-магазина: что учесть, чтобы не облажаться?;Навигация в интернет-магазине | Дизайн интернет-магазина: что учесть, чтобы не облажаться, часть вторая;Каталог: фильтрация и карточки | Дизайн интернет-магазина: что учесть, чтобы не облажаться — часть третья;Дизайн страницы продукта | Дизайн интернет-магазина: что учесть, чтобы не облажаться, часть четвёртая;Разбор корзины на сайте | Дизайн интернет-магазина: что учесть, чтобы не облажаться, часть пятая;Страница оформления заказа | Дизайн интернет-магазина: что учесть, чтобы не облажаться — часть шестая.В материалах про магазины стараемся доказывать примерно всё. Иллюстрация из второй статьи циклаПохожий цикл, но для мобильной версии:Почему в мобильной версии больше трафика, но меньше продаж | Мобильная версия магазина: как довести пользователя до покупки, часть первая;Мобильная навигация: как оформлять «хлебные крошки» и карусели | Мобильная версия интернет-магазина: как довести пользователя до покупки, часть вторая;Функции и must-have контент для мобильного футера | Мобильная версия интернет-магазина: как довести пользователя до покупки, часть третья;Фильтры и сортировка в мобильной версии | Мобильная версия интернет-магазина: как довести пользователя до покупки, часть четвёртая;Что писать в карточке товара и какие функции добавлять в мобильный каталог | Мобильная версия интернет-магазина: как довести пользователя до покупки, часть пятая;О контенте в карточке товара и обратной связи | Мобильная версия интернет-магазина: как довести пользователя до покупки, часть шестая.Статьи сопровождаем собственными примерами. Выше — иллюстрация с нашим проектом из первой статьи про мобильную разработкуКак довести интернет-магазин до идеалаНа пользование интернет-магазином влияют сотни мелочей. Например, 75% пользователей касаются телефона только одним пальцем — им будет неудобно, если элементы будут расположены в дальних частях экрана.В дизайне мы предусматриваем максимум таких деталей. Описали это в нескольких статьях:Как в интерфейсе учесть привычки клиента, чтобы привести его к покупке — разобрали статистику и исследования о поведении пользователей в интернет-магазинах;Как не потерять покупателя в начале пути. Разобрали вход и регистрацию в интернет-магазинах — на примерах популярных маркетплейсов рассмотрели авторизацию в eCommerce;Возвраты в eCommerce: причины и механики сокращения — около 25% онлайн-покупок возвращают в магазин. Разобрались, почему это происходит, и как снизить процент;Доступный дизайн: как сделать интерфейс удобным для пожилых — В период с 25 до 60 лет способность использовать сайты снижается на 0,8% в год. Рассказываем, как облегчить интерфейс сайта для возрастных пользователей;Что учесть в разработке интернет-магазина на Bitrix, чтобы не переплачивать за исправление ошибок — рассказываем о мелочах, которые стоит предусмотреть на Bitrix. С помощью памятки можно оценить свой дизайн или проверить работу подрядчика.Мелочи разбираем очень придирчиво: на каждое решение показываем соответствующее исследованиеКак натренировать насмотренностьМы разбираем успешные и неудачные практики интернет-магазинов в нашей хулиганской рубрике «прожарка». В ней мы под микроскопом разглядываем десктопные и мобильные версии сайтов компаний, подкрепляем исследованиями и советами.Прожарки в хронологическом порядке:Дизайн-прожарка: что не так с редизайном «М.Видео»;Дизайн-прожарка: проблемы интернет-магазина ASOS;Дизайн-прожарка: что не так с мобильной версией AliExpress;Дизайн-прожарка: разбираем десктоп AliExpress;Дизайн-прожарка 2.0: интернет-магазин «Связной», так ли всё хорошо?;Дизайн-прожарка 2.0: препарируем десктопную и мобильную версию ВкусВилла;Дизайн-прожарка 2.0: что не так с «Петровичем»?.В двух (анти)прожарках мы сосредоточились на хороших практиках:Дизайн-антипрожарка: какие функции стоит перенять у Ozon;(Анти)прожарка «Золотого Яблока»: можно ли дизайн магазина взять за пример?.Подписывайтесь на наш телеграм-канал, чтобы больше читать про CX и UX. В нём мы пишем про разработку и исследования в дизайне, рассказываем о своей работе и собираем интересные новости сферы.
Подборка огонь, сохранил
Спасибо за поддержку!
После этой статьи дизайнеров можно увольнять)
Не торопитесь :) Это статья-засечка, впереди ещё более интересные и крутые штуки
весь отдел, смело можно отправлять куда по дальше)
Спасибо за подборку!!!
спасибо за поддержку 😉