Оди
36.4K subscribers
24.7K photos
1.11K videos
143 files
5.24K links
Журнал о дизайне и для дизайнеров. Вдохновение, обучение, инструменты.

Чат канала: @awdeechat

Сайт с полным архивом: https://awdee.ru

По рекламе: @kgreenmedia

Автор проекта: @kirillgreen
Download Telegram
🙂 Что должно быть на сайте медицинских услуг: гайд из 31 пункта

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

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

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

#awd_article #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Проектируем карточки товаров в листинге: 230 гайдлайнов

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

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Проектируем строку поиска в приложении: 182 гайдлайна

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂️ Проверяем METRO на прочность

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

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

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

awdee.ru/testing-metro-for-durability

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Оформление заказа: выбор адреса и времени доставки

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Проектируем сортировку листинга в приложении

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Проектируем фильтрацию листинга товаров в приложении

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 Проектируем рейтинг и отзывы о товарах в приложении

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Как разнообразить листинг товаров

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

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Проектируем согласие на обработку данных в e-commerce приложении

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Как правильно спроектировать корзину в интернет-магазине: 203 гайдлайна

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Заказываем подарочный сертификат в Sunlight

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Проектируем работу с избранным

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

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Проектируем авторизацию в приложении по номеру телефона

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Входим в Авито

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

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

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

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Проектируем избранное в e-com приложении

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

Разделы статьи:
— Empty state избранного
— Кнопка добавления в избранное
— Кнопка перехода в раздел
— Добавление в избранное
— Просмотр товаров в избранном
— Работа со списками
— Побуждение к покупке
— От избранного – к корзине
— Удаление из избранного:

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

🙂️️️️️️ awdee.ru/designing-favorites-in-the-e-com-application

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Прокачиваем Самокат: глава первая

Станислав Хрусталёв готовит серию статей на тему клиентского пути в приложении Самокат. Он выпустил первую, в которой описал два первых этапа пути пользователя: взаимодействие со страницей приложения в App Store и процесс входа в приложение

Для удобства автор разбил материал на следующие пункты:
— Preview-экраны
— Описание приложения
— История обновлений
— Рейтинг и отзывы
— Прочие аспекты
— Основной экран входа
— Экран ввода кода

Для наглядности статью он сопроводил скриншотами Самоката, а также референсами из других сервисов

🙂 Читайте статью полностью: awdee.ru/rocking-the-scooter-chapter-one

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Прокачиваем Самокат: глава вторая

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

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

🙂️ Читайте статью полностью: awdee.ru/rocking-the-scooter-chapter-two

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
Прокачиваем Самокат: глава третья

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

🙂️ Читайте статью полностью: awdee.ru/rocking-the-scooter-chapter-three

А это ссылки на первую и вторую части

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM