Решения микро 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-проектах Советуем вам почитать
Комментарии:
Какой движок сайта стоит выбрать...
23 07 2026 19:53:28
Самые популярные блоги Рунета по интернет-маркетингу — все RSS-фиды в одном месте...
22 07 2026 13:56:20
Как найти, нарастить и проанализировать ссылочную массу...
21 07 2026 13:23:28
И научиться делать свою рекламу прибыльной. Читайте про типы автостратегий и способы их оптимизации....
20 07 2026 21:46:35
Агентство интернет-маркетинга Netpeak вышла на новые рекламные горизонты и приобрело 51% доли болгарской компании Optimization.bg....
19 07 2026 21:13:20
Начинали с SEO на этапе разработки нового сайта. Узнать больше!...
18 07 2026 22:55:49
Кейс продвижения Pizza House — ROMI 709,9%. От старта с дублями страниц и постановки целей и задач продвижения, проведения технического аудита, аналитики, анализа поисковых фраз, выбора контента до экспериментов с метатегами, увеличения среднего чека и планов на будущее...
17 07 2026 15:52:27
История свидания двух ботов как иллюстрация развития искусственного интеллекта...
16 07 2026 8:59:19
Несложные рекомендации, как увеличить продажи с сайта и его мобильной версии с помощью инструментов Google: ***ytics, Tag Manager, Optimizer и форм-опросов. UX-специалисты Турум-бурум рекомендуют их для проверки сайта и используют в своей работе....
15 07 2026 7:36:48
Бухгалтерский мир Netpeak: цель, задачи, мотивация....
14 07 2026 6:27:10
Публикуем тему с закрытого аналитического форума Netpeak про «звездочки» как инструмент оценки релевантности контента....
13 07 2026 14:17:35
3D принтер — заработок миллионеров будущего! Тех, кто сейчас смог купить и начал заниматься ими или использует их в бизнесе, ждет объемный успех через каких-нибудь 3-5 лет....
12 07 2026 4:27:16
Итоги одной из наших первых онлайн рекламных кампаний в Play...
11 07 2026 0:58:15
Главная цель инфлюенс-маркетинга — теплый и близкий контакт с аудиторией. Клиентам нравится ассоциировать продукты с живыми, знакомыми им людьми — пускай и только по интернету. Читать дальше....
10 07 2026 5:45:37
Помимо полезного и качественного продукта, услуги, компании нужен мощный маркетинг. И возможно это только благодаря хорошему директору по маркетингу. Только так это работает. Кто лучшие в этой нише в Казахстане? Узнать!...
09 07 2026 0:23:44
Топ doodle games от Google — от менее достойных к самым крутым....
08 07 2026 0:24:59
HR-советы компаниям, которым нужно найти больше трех джунов в проект...
07 07 2026 4:48:23
Много 404-страниц и ссылок на них негативно сказывается на ранжировании сайта в поисковых системах....
06 07 2026 21:51:30
Идеи для интернет-маркетологов, как получить дополнительные каналы трафика и сделать заметным сниппет в поисковой выдаче....
05 07 2026 22:25:41
Анализ пути — это как многокaнaльные последовательности в Universal ***ytics, только лучше....
04 07 2026 4:45:22
Когда саппорт-отдел не справляется, подключайте к работе ПланФикс и Телеграм....
03 07 2026 1:37:53
Статистика изменений долей рынка после майского и декабрьского апдейта Google в 2020 году....
02 07 2026 2:52:46
Первое подробное руководство по работе с оконными функциями в Google BigQuery....
01 07 2026 12:37:53
Метод бoмжа в маркетинге. Как разработать позиционирование стартапа при ограниченных ресурсах...
30 06 2026 10:20:16
Инструкция для новичков по одновременной работе с кампаниями, а также объявлениями и группами в Яндекс.Директ...
29 06 2026 12:21:31
Что бывает, когда работа над продвижением сайта начинается до его выхода в паблик....
28 06 2026 19:48:43
Знаете, как доменная зона Германии связана с криптовалютой, или почему в доменной зоне маленького острова площадью 10 квадратных километров зарегистрировано 20 млн доменов? Сейчас расскажем!...
27 06 2026 20:43:45
Пост по мотивам видео Мэтта Каттса из Google. Из первых рук, как говорится....
26 06 2026 14:11:17
Обновление от Google, запущенный в октябре 2015 года. Это просто веб-страницы, но в их основе находится AMP HTML, формат для максимального ускорения загрузки на телефонах...
25 06 2026 6:35:18
Мы запустили еще один полезный инструмент: Netpeak Spider....
24 06 2026 12:18:10
Чтобы перенаправить рекламу не на свой домен, арбитражники используют редирект в Яндексе при работе с партнерскими ссылками...
23 06 2026 10:41:29
Как найти тему для поста, который и в онлайн поиске будет хорошо ранжироваться, и по социалкам разойдется, и комментарии в треде обеспечит...
22 06 2026 3:11:55
Ликбез по важным понятиям, без которых нельзя начинать бизнес в интернете. Что такое домены второго и третьего уровня, чем они отличаются. Узнать больше!...
21 06 2026 8:18:11
Твиттереть нужно правильно. Интересная аналитики и планирование твитов по времени...
20 06 2026 12:40:24
Требования к интернет-магазину, мануал по регистрации, что может пойти не так...
19 06 2026 7:54:31
Эффективность продвинутой сегментации стала заметна уже в первый месяц ее функционирования....
18 06 2026 8:26:15
Как специалисту оптимизировать рабочее время, качественно развивать проекты и меньше нервничать...
17 06 2026 17:47:49
Look-alike аудитории, таргетинг на участников групп, ограничение стоимости установки и другие вкусные фишки myTarget...
16 06 2026 16:17:51
Кликбейтинг в опасности. Если хочешь узнать методы работы антикликбейт-комaнды Facebook, просто нажми на этот заголовок...
15 06 2026 7:13:52
Тошнота и процент воды в тексте не должны превышать допустимую норму, иначе не только пользователи уйдут с сайта, поисковые роботы понизят сайт в рейтинге. Узнать больше!...
14 06 2026 19:11:31
Сет по контекстной рекламе в тематике «разработка программного обеспечения»: снижение стоимости клика на 89%....
13 06 2026 21:18:59
Руководство по переносу кампаний в новый аккаунт Рекламы...
12 06 2026 2:51:57
Первая часть иллюстрированного руководства, в котором мы взяли 20 самых важных фактора ранжирования представлены с краткими иллюстрированными примерами. В этом тексте вы найдете первые 10. Узнать больше!...
11 06 2026 9:25:38
Где и как разработчик может подобрать ответственных удаленщиков, как составить техническое задание, чем контролировать качество работы...
10 06 2026 16:33:27
Проверяем, есть ли разница в ранжировании при наличии/отсутствии этих слов в метаданных. Эксперимент....
09 06 2026 19:53:17
Не все события удобно отслеживать в Google ***ytics, иногда удобнее сделать связку с таблицами Google. А поможет в этом Google Tag Manager...
08 06 2026 20:19:28
330 миллионов активных пользователей и 14 миллиардов просмотров в месяц. Хорошо бы там запускать рекламные кампании....
07 06 2026 19:27:56
Как поможет Regex Engines в работе с Google ***ytics и преимущества использования Regex в Диспетчере тегов Google. Узнать больше....
06 06 2026 18:48:48
О работе внутреннего и внешнего контент-маркетолога: необходимые знания и навыки для старта, плюшки и головная боль. Все здесь....
05 06 2026 16:56:15
Как считать конверсии из Facebook, когда они происходят в Jivosite и Битрикс24....
04 06 2026 16:49:57
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
