🙂 Выбор города в интернет-магазине: 90+ моментов, которые стоит учесть при проектировании

Станислав Хрусталёв проанализировал топ-100 интернет-магазинов РФ по выручке и составил чек-лист из 90+ гайдлайнов, которые покрывают все нюансы проектирования функции выбора города

Статью он разбил на несколько разделов:
— Текущий город
— Запрос на уточнение города
— Интерфейс выбора города
— Популярные города
— Элементы списка городов
— Поисковая строка
— Выбор города
— Закрытие интерфейса

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

awdee.ru/choosing-a-city-in-an-online-store-90-things-to-consider-when-designing-it

#awd_article #awd_ux #awd_cx

🙂 Проектируем функционал сторис

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

На практических примерах автор показал:
— Как проектировать миниатюры сторис
— Как показывать открытие историй
— Какой контент отображать в сторис
— Как демонстрировать прогресс просмотра
— Какие действия с историями можно добавить
— Как реализовать переключение и закрытие сторис

awdee.ru/design-the-stories-functionality

#awd_article #awd_ux #awd_cx

🙂 Как приготовить хорошие cookies: 57 гайдлайнов

Новая статья Станислава Хрусталёва обо всех аспектах проектирования запроса на согласие на использование cookies, а именно:
— Где и как разместить сообщение
— В каком формате его сделать
— Что написать в тексте согласия
— Нужна ли ссылка на описание работы
— Как оформить страницу с описанием
— Как спроектировать кнопку согласия и кнопки прочих действий
— Что предусмотреть при закрытии сообщения

Все тезисы автор сопроводил наглядными примерами

awdee.ru/how-to-make-good-cookies-57-guidlines

#awd_article #awd_ux #awd_cx

🙂 Проектируем фото в карточке товара: 140 гайдлайнов

Станислав Хрусталёв посмотрел порядка 150 приложений и показал лучшие практики дизайна взаимодействия с фото в карточках товара

Для удобства статью он разбил на несколько разделов:
— Открытие карточки товара
— Фото товара
— Видео товара
— Прокрутка слайдера
— Page control и альтернативы
— Появление галереи
— Формат галереи
— Прокрутка галереи
— Миниатюры
— Зум фото в галерее
— Закрытие галереи
— Прочие интересные фичи

Практически все гайдлайны автор сопроводил примерами

awdee.ru/designing-a-picture-in-product-cards-140-guidelines

#awd_article #awd_ux #awd_cx

🙂 Проектируем характеристики и описание в карточке товара

Станислав Хрусталёв детально и с наглядными примерами разобрал блоки с характеристиками и описанием в карточках товаров

Для удобства статью он разбил на следующие разделы:
— Блоки в карточке товара
— Названия и значения характеристик
— Кликабельность характеристик
— Единицы измерения
— Категории характеристик
— Описание товара
— Переход к полным версиям контента
— Закрытие полных версий блоков
— Прочие интересные фичи

awdee.ru/design-features-and-description-in-the-product-card

#awd_article #awd_ux #awd_cx

🙂 Что должно быть на сайте медицинских услуг: гайд из 31 пункта

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

На примерах автор объяснил:
— Какую информацию включать в форму заявки
— Стоит ли использовать онлайн-чат на сайте
— Когда указывать стоимость услуг
— Показывать ли фотографии «До/После»
— Какие отзывы и где публиковать в первую очередь
— На какую информацию о персонале клиенты обращают внимание
— Какие данные стоит добавлять в Яндекс.Справочник, чтобы увеличить присутствие в поисковой выдаче

awdee.ru/what-should-be-on-a-medical-services-website-a-31-point-guide

#awd_article #awd_cx

🙂 Проектируем карточки товаров в листинге: 230 гайдлайнов

Станислав Хрусталёв проанализировал около 200 приложений из сферы e-com и написал, как сделать карточки в листинге товаров понятными, наглядными и функциональными

Статья состоит из следующих разделов:
— Layout листинга
— Выделение карточек в листинге
— Фото товара
— Слайдер
— Page control
— Название и подписи
— Маркеры
— Варианты товара
— Цена и скидки
— Рейтинг и отзывы
— Кнопка корзины
— Кнопка избранного
— Реакция карточки на касание

Все гайдлайны автор по традиции сопроводил информативными примерами актуальных приложений

awdee.ru/designing-product-cards-in-a-listing-230-guidelines

#awd_article #awd_ux #awd_cx

🙂 Проектируем строку поиска в приложении: 182 гайдлайна

Станислав Хрусталёв написал новую статью о лучших практиках и ошибках в дизайне поисковой строки

На примерах автор разобрал следующие аспекты:
— Размещение строки поиска
— Внешний вид строки
— Placeholder строки поиска
— Активация строки
— Подсказка при активации строки
— Поддерживаемые типы запросов
— Подсказка при вводе запроса
— История поиска
— Подсказка при отсутствии результатов
— Очистка запроса
— Отмена поиска
— Переход к результатам поиска
— Альтернативы строке поиска

awdee.ru/designing-the-search-bar-in-the-application

#awd_article #awd_ux #awd_cx

🙂️️ Проверяем METRO на прочность

Станислав Хрусталёв прошёл клиентский путь в приложении доставки продуктов Metro, нашёл в нём 200 аспектов, которые можно улучшить, и поделился ими в статье

Результаты автор разбил на следующие этапы клиентского пути:
— Призыв к скачиванию на сайте
— Страница приложения в App Store
— Онбординг и активация
— Ввод адреса доставки
— Выбор магазина
— Главный экран
— Просмотр сторис
— Раздел акций
— Ознакомление с каталогом
— Поиск с помощью строки
— Карточки товаров в листинге
— Фильтрация и сортировка
— Полные карточки товаров
— Избранное
— Авторизация и оформление карты
— Работа с корзиной
— Оформление заказа
— Оплата заказа

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

awdee.ru/testing-metro-for-durability

#awd_article #awd_ux #awd_cx

🙂 Оформление заказа: выбор адреса и времени доставки

В статье Станислав Хрусталёв рассказывает, как сделать выбор адреса доставки, пункта выдачи заказов, даты и времени удобными для пользователя

Детально и на примерах российских интернет-магазинов автор разбирает следующие аспекты:
— Общие требования к карте
— Выбор пункта самовывоза
— Выбор адреса на карте
— Текстовый ввод адреса
— Сохранённые адреса
— Дата и время доставки
— Управление предпочтениями

awdee.ru/order-placement-selection-of-address-and-time-of-delivery

#awd_article #awd_ux #awd_cx

🙂 Проектируем сортировку листинга в приложении

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

Согласно этапам клиентского пути он разбил статью на следующие блоки:
— Размещение кнопки сортировки
— Внешний вид кнопки
— Сортировка по умолчанию
— Появление карточки сортировки
— Внешний вид карточки
— Типы сортировки
— Активация сортировки
— Закрытие карточки

awdee.ru/designing-the-listing-sorting-in-the-application

#awd_article #awd_ux #awd_cx

🙂 Проектируем фильтрацию листинга товаров в приложении

Станислав Хрусталёв написал новую статью о лучших практиках и ошибках в дизайне фильтров

На примерах российских приложений автор разобрал следующие аспекты:
— Размещение кнопки фильтров
— Внешний вид кнопки
— Появление экрана с фильтрами
— Интерфейс выбора фильтров
— Пояснения к фильтрам
— Слайдеры
— Фильтры выбора из списка
— Полный список значений по фильтру
— Фильтры выбора цвета
— Бинарные фильтры
— Применение фильтров
— Активные фильтры в листинге
— Активные фильтры на экране фильтров
— Сброс фильтров
— Закрытие экрана фильтров
— Прочие интересные фичи

awdee.ru/designing-product-listing-filtering-in-the-application

#awd_article #awd_ux #awd_cx

🙂 Проектируем рейтинг и отзывы о товарах в приложении

Новая статья Станислава Хрусталёва о том, что следует учитывать в дизайне рейтинга и отзывов о товарах. Автор проанализировал российские приложения, нашёл лучшие практики и составил 200 гайдлайнов

Для удобства восприятия материал он разбил на части в соответствии с этапами клиентского пути:
— Карточки товаров в листинге
— Сортировка листинга
— Фильтрация листинга
— Индикатор в карточке товара
— Rating summary
— Список отзывов
— Карточки отзывов
— Медиаконтент в отзывах

awdee.ru/design-rating-and-product-reviews-in-the-app

#awd_article #awd_ux #awd_cx

Как разнообразить листинг товаров

Станислав Хрусталёв проанализировал порядка 175 российских приложений и написал статью об интересных нюансах в дизайне каталога товаров. Эти приёмы помогают интернет-магазинам сделать так, чтобы пользователь не заснул при прокрутке

Структура статьи:
— Изменение вида карточек
— Продвижение товаров и услуг
— Контентные блоки
— Навигация
— Обратная связь
— Прочие механики

Все приёмы автор сопроводил реальными примерами

🙂 awdee.ru/how-to-diversify-the-product-listing

#awd_article #awd_ux #awd_cx

Проектируем согласие на обработку данных в e-commerce приложении

В новой статье Станислав Хрусталёв рассказывает о нюансах, которые стоит предусмотреть в дизайне блоков согласия с политикой конфиденциальности и прочими документами

На примерах и антипримерах российских приложений он разобрал следующие аспекты:
— Видимость блока с согласием
— Текст согласия
— Ссылки на документы
— Чекбоксы и их отсутствие
— Согласие на маркетинговые коммуникации
— Полный текст документов

🙂 awdee.ru/designing-consent-with-policies-in-an-e-commerce-application

#awd_article #awd_ux #awd_cx

Как правильно спроектировать корзину в интернет-магазине: 203 гайдлайна

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

Для удобства восприятия автор разбил статью на следующие разделы:
— Кнопка корзины в карточке товара
— Изменение количества товара
— Подтверждение добавления
— Кнопка корзины в шапке
— Popover со списком товаров
— Empty state корзины
— Страница корзины
— Список товаров в корзине
— Отсутствующие товары
— Удаление товаров и очистка корзины
— Подытог
— Допродажа в корзине

🙂 awdee.ru/working-with-the-cart

#awd_article #awd_ux #awd_cx

Заказываем подарочный сертификат в Sunlight

Недавно студия Лебедева сделала дизайн электронных подарочных карт Sunlight. Станислав Хрусталёв проанализировал их дизайн, а также весь путь покупателя: от поиска сертификатов до момента их оплаты. В результате он нашёл 100 потенциальных точек роста, о которых и рассказал в статье

Для удобства весь клиентский путь автор разбил на этапы:
— Путь до лендинга
— Лендинг заказа сертификатов
— Авторизация
— Выбор дизайна сертификата
— Выбор номинала
— Ввод данных получателя
— Ввод текста поздравления
— Проверка заказа
— Оплата и подтверждение заказа
— Получение и ознакомление с сертификатом
— Проверка баланса
— Ознакомление с правилами использования

🙂️️️️️️ awdee.ru/ordering-a-gift-certificate-at-sunlight

#awd_article #awd_ux #awd_cx

Проектируем работу с избранным

Самый полный и обстоятельный чек-лист по дизайну избранного в e-commerce на основе анализа 117 реальных интернет-магазинов

В статье автор разбирает следующие аспекты:
— Добавление в избранное
— Подтверждение добавления
— Кнопка перехода в избранное
— Empty state избранного
— Страница избранного
— Списки покупок
— Удаление из избранного

Как спроектировать иконку избранного, где её расположить, как заполнить страницу избранного, нужно ли категоризировать товары в избранном…

🙂️️️️️️ это и многое другое читайте в статье: awdee.ru/designing-work-with-the-favorites

#awd_article #awd_ux #awd_cx

Проектируем авторизацию в приложении по номеру телефона

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

Статью он разбил на блоки в соответствии с этапами клиентского пути:
— Общие моменты
— Заголовок формы ввода номера
— Placeholder поля ввода номера
— Активация поля с номером
— Ввод номера телефона
— Кнопка подтверждения номера
— Типы проверки номера
— Подтверждение отправки sms
— SMS с проверочным кодом
— Ввод проверочного кода
— Валидация и обработка ошибочного ввода
— Повторная отправка кода

🙂 awdee.ru/design-in-app-authorization-by-phone-number

#awd_article #awd_ux #awd_cx

Входим в Авито

Станислав Хрусталёв попробовал войти в свой профиль на Авито и обнаружил, что в этом процессе есть, что улучшить. В итоге он предложил 62 идеи, как ускорить и облегчить аутентификацию для пользователей

Статью он разбил на блоки в соответствии с шагами и экранами, через которые проходит клиент:
— Общий экран аутентификации
— Ввод логина и пароля
— Запрос на восстановление пароля
— Ввод проверочного кода
— Создание нового пароля

🙂️️️️️️ awdee.ru/logging-into-avito

#awd_article #awd_ux #awd_cx