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

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

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

Изучив 25 основ в нашей последней статье по дизайну UX, давайте посмотрим, как это работает в действии. В частности, мы смотрим на UX дизайн сайтов электронной коммерции.

Как эти веб-сайты используют хитрые UX-дизайн, чтобы побудить своих посетителей покупать?

1. Асос

Я часто использую пример Asos, но для этого есть веская причина. Их дизайн UX блестящий.

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

asos2

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

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

ASOS

2. Зара

Сайт Zara – это мастер-класс по простоте. Чистый, интуитивно понятный и ограниченный. Это ода закону Хика: принцип дизайна, который ограничивает выбор навигации и дает пользователю четкие, но ограниченные возможности.

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

Зара

3. Abof

Abof (All About Fashion) использует невероятно хитрый UX-трюк на своем сайте. Откройте домашнюю страницу, и она не похожа на традиционный сайт электронной коммерции. Вместо этого это больше похоже на блог. Он полон сочного контента, который вдохновляет аудиторию.

abof

Затем в своих рассказах и статьях они выделяют одежду в известной рубрике «Покупай историю». В нашей предыдущей статье о UX мы говорили о важности создания отношений с вашей аудиторией. Abof отлично справляется с историями и контентом.

abof 2

Только когда клиенты вдохновляются, они пытаются что-то продать.

На странице продукта у них есть полезные заметки «Советы по стилю», которые являются прекрасными примерами «микро-взаимодействий» – маленьких самородков, которые охватывают и привлекают вашу аудиторию..

около 3

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

4. Бергхаус

Berghaus – это марка верхней одежды, но вы узнаете об этом уже в течение первой секунды после приземления на их сайте..

Berghaus

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

Единственный недостаток? Более сильный призыв к действию действительно заключит сделку здесь.

5. Apple

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

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

Снимок экрана 2016-07-28 в 8.43.00 утра

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

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

яблоко 2

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

6. Беллрой

Как относительно новый продавец электронной коммерции, ваша первая задача – показать клиентам, как вы отличаетесь от всех остальных. Bellroy делает это идеально с их ассортиментом компактных кошельков.

колокольня 3

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

Bellroy 4

7. Аренда взлетно-посадочной полосы

Rent The Runway имеет довольно уникальную концепцию: вы одалживаете платье или наряд на несколько дней, а не покупаете его. Это отлично подходит для свадеб или мероприятий, где вы не хотите носить одежду, которую вы никогда не сможете надеть снова.

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

аренда взлетно-посадочной полосы

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

аренда взлетно-посадочной полосы 2

Так просто, но так обнадеживает.

8. Амазонка

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

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

Амазонка

Это по-прежнему лучший пример эффективности проверки в Интернете. В основе UX-дизайна электронной коммерции лежит процесс покупки и оформления заказа. Чем ровнее, тем лучше. И это не становится более гладким, чем заказ в один клик!

9. пасутся

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

клевок

Это простой мастер-класс в UX-дизайне..

10. TopShop

У магазинов, которые продают много товаров, гораздо сложнее, когда дело доходит до дизайна UX. Как вы организовываете каждую пару джинсов и представляете их?

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

Topshop 2

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

11. Протест

У протеста может быть самая большая и толстая навигация в Интернете.

п

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

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

12. Новый взгляд

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

Новый взгляд 2

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

Новый облик

13. Карандаш, 53

Если вы собираетесь продать стилус почти за 60 долларов, вы действительно должны его продать! К счастью, «Карандаш», 53, делает отличную работу, используя ряд приемов UX-дизайна.

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

карандаш 2

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

Карандаш

14. Farmdrop

В нашей последней статье о UX-дизайне мы объяснили, насколько важно сопереживать своей целевой аудитории и общаться с ними. Farmdrop делает это, ставя свою миссию впереди и по центру.

ферма

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

15. Сид Машберн

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

иконки

16. Медленные часы

Это часы одной рукой. Это довольно уникальная концепция, поэтому она требует пояснения! Slow Watches делает это действительно хорошо с полноэкранным объяснением видео.

медленные часы

Наряду с объяснением концепции, они также обсуждают свою философию, стоящую за ее созданием (отлично подходит для связи с клиентом), и используют красивые изображения, которые подчеркивают и ориентируют их на идеальную аудиторию..

17. Топка

Когда ваши предметы не попадают в обычные категории, проявите творческий подход Firebox специализируется на необычных подарках и непочтительных предметах. Их топ 50 чартов – идеальный способ исследовать их самые популярные продукты.

картинки

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

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

18. Lazy Oaf

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

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

лентяй

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

Что не делать!

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

1. Дом Фрейзер

Это один из крупнейших универмагов в мире, но они делают одну огромную ошибку, как только вы загружаете их сайт.

Сразу же вы попадаете во всплывающее окно на всю страницу с просьбой подписаться на их новостную рассылку..

Hourse of Fraser

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

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

2. Wal Mart

У Wal-Mart непростая задача. Они продают почти все, так как же вы классифицируете это и делаете его простым? Ну, я не уверен … но не так …

Wall Mart

К сожалению, это просто беспорядок категорий, которые почти невозможно найти то, что вы ищете.

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

3. Ray-Ban

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

Тем не менее, они делают то, что делают многие сайты электронной коммерции, что действительно раздражает клиентов. Эта:

лучевой запрет

Вы, наверное, видели такую ​​страницу сто раз. Это не так уж плохо, но на самом деле создает еще один барьер для продажи.

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

Если вы новый клиент, вы можете проверить гостей, но все, что вы сделали, – дайте им еще одну кнопку, чтобы нажать. Еще один шанс нажать.

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

Великолепный UX-дизайн – это все тонкие настройки, которые облегчают жизнь ваших клиентов. Эти 18 сайтов делают это отлично.

Какие функции вы будете использовать на своем сайте?

Kim Martin
Kim Martin Administrator
Sorry! The Author has not filled his profile.
follow me