Решения микро UX на сайтах интернет-магазинов. Удачные кейсы
Любой сайт должен быть удобным, информативным и полезным. А еще неплохо, чтобы он нравился, был интересен посетителю, формировал уникальный пользовательский опыт. Именно для этого существуют Микро UX. Это маленькие милые элементы сайтов, интеpaктивные атомы веб-дизайна. Их цель — стимулировать положительные эмоции юзера. Решения микро UX всегда выражают заботу создателей сайта о посетителях. Заботу на уровне мельчайших деталей.
Минутка теории
Уникальный потребительский опыт (User Experience, UX) можно получить, если четко обозначить, зачем покупателю нужен именно этот продукт (тактики макро UX). Также пользователя подкупают приятные детали юзабилити и элементы интерфейса (микро UX). В большинстве своем деятели Ecommerce концентрируются на подходах макро UX — нюансах разработки проекта, выведения на рынок новых товаров и т. д. Подходы микро UX обеспечивают то, что входит в понятие удачный дизайн сайта — эмоциональную привязку к проекту с помощью фишек веб-дизайна. В последние годы они становятся все более популярными. Детальнее о разнице между микро и макро UX рассказали авторы книги «How to Design Experiences: Macro UX versus Micro UX Approach».
| Критерии | Макро UX | Микро UX |
| Подход к созданию уникального потребительского опыта | Создание концепции товара | Создание элементов для улучшения потребительского опыта |
| Цели | Объяснить, почему пользователю нужен товар | Объяснить, как пользователь будет использовать этот товар |
| Начало работы | Определение потребностей целевой аудитории | Определение фишек дизайна продукта |
| Тип влияния | Концепция продукта, его функциональное использование | Рецепция дизайна товара |
| Этапы | Необходимо на всех этапах работы с продуктом | Необходимо для поддержки продукта только на некоторых этапах |
| Особенности реализации | Высокий уровень абстpaкции. Постановка общих целей и задач | Только конкретные дизайнерские решения |
| Результат | Эффективное достижение уникального потребительского опыта | Эффективное достижение уникального потребительского опыта с минимальными затратами |
А теперь — хорошие дизайны сайтов.
От редакции: этот пост впервые опубликовали в журнале в 2015 году. С тех пор внешний вид перечисленных сайтов, конечно же, изменился, а некоторые и вовсе перестали существовать. Но решения Микро UX все равно интересные и полезные. Поэтому мы решили обновить пост, который продолжает оставаться в нашем топе по просмотрам.
Первое приближение
Среди hover-эффектов на сайте винтажной мебели WrightWood стоит выделить «увеличительное стекло», которое позволяет рассмотреть детали любой модели на отдельном экране. Для увеличения фрагмента достаточно направить на него курсор.
Hover-эффекты — всплывающие подписи, подсказки, плавные переходы, трaнcформация, ротация, увеличение, смещение и другие эффекты, применяемые к элементам веб-сайта при наведении на них курсора мыши. Хороший дизайн сайта обязательно должен включать в себя эти элементы.Интеpaктивный продукт в действии
Танцующие пункты меню сайта American Apparel рекламируют новые коллекции обуви.
Узнать, что внутри
Гаджет Pencil 53 — стилус для iPad в деревянной оболочке. При вертикальном скроллинге сайта стилус «разбирается» и «собирается» заново.
Сила инерции
Картинки продуктов на сайте Apple продолжают движение вверх или вниз уже после того, как пользователь завершил скроллинг. Иллюстрации словно «подстраиваются» к особенностям монитора.
Обратная сторона медали
Ребята из SohoFixed модернизируют и продают ретро-велосипеды. Они решили не перегружать главную своего сайта лишним текстом — здесь только фото уникальных двухколесных механизмов. При наведении курсора на конкретную модель картинка «переворачивается», и пользователь может узнать подробности.
Днем и ночью
Фишка британского бренда часов Nite — в тритиевой подсветке, которая чаще применяется в военной технике. Чтобы посмотреть, как будут выглядеть часы в темное время суток, нужно нажать на кнопку «активировать ночной режим».
«Голодная» корзина
Создатели сайта ThreadLess сместили элемент микро UX к последней стадии воронки продаж. После добавления первой покупки анимированная «корзина» просит добавки.
Забота о мелочах
Напоследок — о фишках, которые стоит взять на заметку игрокам Ecommerce. Сервис онлайн-заказа авиабилетов Virgin America (сейчас — Alaska Airlines) подарил прекрасные примеры микро UX для мобильных сайтов. Так, уже при регистрации пользователь автоматически получает несколько приятных комплиментов :) При бронировании мест можно выбрать индивидуальный аватар и заодно оценить чувство юмора своих будущих соседей по самолету.
Что такое инсайт или дизайн для жизни Филиппа Старка Дмитрий Карпов о творческом мышлении, дизайне и digital-проектах Советуем вам почитать
Комментарии:
Как найти продавцов для маркетплейса с помощью рекламы в Google, Facebook, TikTok и Viber....
30 08 2026 18:15:10
В этом году часть пользователей предпочла вернуться к привычным покупкам в оффлайн-магазинах....
29 08 2026 6:13:54
Как настроить отправку писем с помощью языка R и как избежать подводных камней....
28 08 2026 6:55:28
Электронный кошелек — это виртуальная ячейка для хранения денежных средств. Каждая такая ячейка обладает уникальным цифровым определителем и может принадлежать одному человеку....
27 08 2026 21:44:30
Шаги, которые необходимо выполнить для правильного сбора и анализа данных сайта...
26 08 2026 14:45:30
Как и зачем мигрировать со старой на новую версию API на языке R. С пакета RAdwords на rgoogleads. Руководство от Алексея Селезнева. Читать дальше!...
25 08 2026 15:22:34
Примеры инновационных проектов. Нескучная рецензия на интересную книгу....
24 08 2026 20:22:41
Лучшие маркетинговые ориентиры тем, кто захочет познакомиться с SEO и контекстной рекламе...
23 08 2026 9:15:12
Тестирования наличия важных тегов на целевых страница — бесплатный скрипт и алгоритм...
22 08 2026 12:35:30
Считаем SEO-эффект от нового дизайна сайта и работы над usability...
21 08 2026 10:35:48
Список инструментов email-маркетолога для рассылок по англоязычной аудитории....
20 08 2026 5:18:43
В статье рассказываем, какие бывают push-уведомления, когда их используют, даем чек-лист и пошаговую инструкцию по созданию успешной push-рассылки....
19 08 2026 11:44:17
RFM — это аббревиатура слов Recency, Frequency, Money — новизна, частота, деньги. То есть считаем, как давно клиент купил товар в последний раз, сколько всего покупок он сделал и сколько денег принес нам за все время заказов....
18 08 2026 18:43:21
Видеомаркетинг должен стать обязательной частью рекламной онлайн-стратегии, и мы собрали несколько подтверждений этому в нашей инфографике....
17 08 2026 15:51:32
Проверяем, есть ли разница в ранжировании при наличии/отсутствии этих слов в метаданных. Эксперимент....
16 08 2026 6:31:24
Чтобы попасть в админку сайта, необходимо определить, какая именно CMS используется. Для этой цели подойдет ручной анализ сайта и его HTML-кода, а также онлайн-сервисы...
15 08 2026 16:12:13
Оплата покупок в Facebook и Instagram через платежные ссылки...
14 08 2026 2:56:22
Как определить и повысить качество парсинга ключевых слов — лайфхак с применением Microsoft Excel....
13 08 2026 4:33:20
Мониторинг мобильных просмотр статистики Firebase в отчетах Google ***ytics и связь Firebase ***ytics с Google Рекламой...
12 08 2026 7:54:29
Техника безопасности по безукоризненным рекламным кампаниям...
11 08 2026 5:11:38
Кейс — поисковое продвижение блога в нише юридических услуг. Как увеличить количество читателей из поисковых систем и трафик на страницы услуг....
10 08 2026 19:32:47
Как расширение от Netpeak может облегчить работу над важными SEO-задачами....
09 08 2026 3:13:57
Если маркетер хочет привлечь к бренд-контенту дополнительное внимание, стоит воспользоваться опцией Promote post....
08 08 2026 8:19:40
Статистика изменений долей рынка после майского и декабрьского апдейта Google в 2020 году....
07 08 2026 16:25:23
Редполитика Netpeak Journal (ex блог Netpeak) — руководство по написанию понятных, полезных, продающих и удобочитаемых текстов. Документ для внутреннего использования в открытом доступе. Применяйте, адаптируйте. Читать!...
06 08 2026 18:13:36
Актуальный обзор особенностей работы онлайн-проектов в Казахстане...
05 08 2026 13:27:21
Какая интересная и трэшовая реклама встречалась в соцсетях в январе 2021-го? Давайте смотреть...
04 08 2026 17:19:35
Amazon сократил комиссию для сайтов партнеров от 30% до 80% — что делать дальше? Мнение эксперта....
03 08 2026 21:54:34
Образец рассылки от создателе Replyapp.io Олег Белозор, на которую ответили самые влиятельные эксперты в мире в2в продаж...
02 08 2026 20:30:57
Пять примеров дизайна, который помогает продавать в рассылках. Просто любуемся и тренируем насмотренность....
01 08 2026 17:24:54
Лидеров определили открытым голосованием. В ТОП-списки вошли CPA-сети, которые набрали больше всего голосов суммарно и по отдельным критериям....
31 07 2026 21:18:40
Понятные людям и роботам URL. Это уникальный набор символов, который дает возможность идентифицировать всевозможные ресурсы в интернете (страницы сайтов, файлы, изображения, видео и так далее). Чтобы узнать больше, читайте далее!...
30 07 2026 9:29:28
Правильно задать вопрос или сфоримулировать ответ на собеседовании это еще далеко не все. Рецензия на книгу Ласло Бока «Работа рулит»...
29 07 2026 0:34:33
Стоит ли платить за рекламную кампанию «Медийно-контекстный баннер на поиске»?...
28 07 2026 5:48:26
Реклама Facebook для вовлечения пользователей помогает привлечь внимание к приложению и удержать пользователей в условиях перенасыщенного рынка....
27 07 2026 10:30:26
По-настоящему работающих идей не так много, поэтому не стоит бояться творчески заимствовать лучшие наработки и адаптировать их....
26 07 2026 22:20:29
Терялись ли вы некогда в лабиринте Википедии из внутренних ссылок и побочных статей? Представьте, насколько непредсказуемым он может стать через несколько десятилетий....
25 07 2026 15:17:56
В аккаунте ***ytics появилась возможность подключения ремаркетинга в поисковой сети Google. Расскажем о результатах применения инструмента на примере кейса крупного проекта ecommerce....
24 07 2026 11:37:51
Почему в рекламе недвижимости стоит запускать динамический ремаркетинг...
23 07 2026 12:46:13
Многие не догадываются о том, что в КМС Google можно разместить и редактировать графические объявления онлайн...
22 07 2026 8:20:45
Полезный ликбез для новичков и бизнесменов: анкорные и безанкорные ссылки. Чем отличаются, зачем нужны, какое влияние оказывают на раскрутку сайта в интернете? Узнать!...
21 07 2026 14:24:22
При работе с рекламным аккаунтом приходится вносить много однотипных изменений. Рассказываем, как сделать это быстро....
20 07 2026 17:40:32
У нас было 500 вечнозеленых постов и желание понять алгоритм ленты Facebook....
19 07 2026 14:43:47
Гайд по типам рекламы в соцсетях для SMM-, PPC-специалистов, блогеров и владельцев бизнеса в зависимости от целей, которые вы ставите перед продвижением. С конкретными рекомендациями и примерами. Узнать больше!...
18 07 2026 10:14:26
Узнаем расширенную информацию о посещениях сайта с помощью языка R — кейс Netpeak...
17 07 2026 19:46:29
Основная цель CTA — помочь посетителю принять решение о покупке, скачивании, регистрации или подписке...
16 07 2026 3:52:11
На что обратить внимание при покупке интернет-ресурса, какие факторы влияют на цену и что помогает определить качество сайта? Ответы на все эти вопросы в статье. Читать!...
15 07 2026 4:19:48
Что такое【контекстная реклама】и как ее настроить? Подробный чек-лист ✅ в блоге Netpeak ⟁ ▷ 200 ступеней рекламной кампании в Google AdWords, Яндекс.Директ ⚡...
14 07 2026 0:14:57
Стратегия контекстной рекламы для лендинга турагенства: увеличение количества онлайн-бронирований на 100%...
13 07 2026 1:37:31
Что нам дают знания о статистике контента в социальных сетях и какими сервисами анализировать данные...
12 07 2026 23:26:55
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
