Как упорядочить информацию в интерфейсе, revisited
Мне кажется, что от мнемоники LATCH (положение, алфавит, время, категория, иерархия) больше вреда, чем пользы. Поэтому я слегка переиначил её и развил. Получилась мнемоника СПРАВКА ツ
https://antonz.ru/no-more-latch/
Мне кажется, что от мнемоники LATCH (положение, алфавит, время, категория, иерархия) больше вреда, чем пользы. Поэтому я слегка переиначил её и развил. Получилась мнемоника СПРАВКА ツ
https://antonz.ru/no-more-latch/
Антон Жиянов
Хватит сортировать по алфавиту
Как упорядочить объекты в интерфейсе, чтобы пользователю было удобно с ними работать.
Задачка: город в интернет-магазине
Давайте попробуем новую рубрику — интерфейсные задачки? Я описываю проблему, вы предлагаете, как решить её с помощью интерфейса. Задачки будут небольшие, рисовать макеты не потребуется, ну только если сами захотите ツ Лучшие решения опубликую здесь и в блоге, со ссылкой на автора (если он не захочет остаться неизвестным)
Вот пилотный выпуск. Есть интернет-магазин, работает по всей стране. От города к городу отличаются доступные способы и стоимость доставки. Цены на 95% товаров одинаковые для всех городов, но для 5% отличаются.
Раньше магазин показывал каждому посетителю при входе такой попап:
> Ваш город — «Санкт-Петербург». Мы угадали?
> ДА / НЕТ
Но пришёл новый директор по маркетингу и категорически требует попап убрать — он, мол, бесит покупателей.
Что делать, чтобы и маркетолога удовлетворить, и покупателям по ценам и доставке не наврать?
Разбор: https://antonz.ru/delivery-city-puzzle/
Давайте попробуем новую рубрику — интерфейсные задачки? Я описываю проблему, вы предлагаете, как решить её с помощью интерфейса. Задачки будут небольшие, рисовать макеты не потребуется, ну только если сами захотите ツ Лучшие решения опубликую здесь и в блоге, со ссылкой на автора (если он не захочет остаться неизвестным)
Вот пилотный выпуск. Есть интернет-магазин, работает по всей стране. От города к городу отличаются доступные способы и стоимость доставки. Цены на 95% товаров одинаковые для всех городов, но для 5% отличаются.
Раньше магазин показывал каждому посетителю при входе такой попап:
> Ваш город — «Санкт-Петербург». Мы угадали?
> ДА / НЕТ
Но пришёл новый директор по маркетингу и категорически требует попап убрать — он, мол, бесит покупателей.
Что делать, чтобы и маркетолога удовлетворить, и покупателям по ценам и доставке не наврать?
Разбор: https://antonz.ru/delivery-city-puzzle/
Урл как интерфейс
Для меня урл (URL) на сайте или в веб-приложении — часть интерфейса. Поэтому он должен быть хорош.
Понимаю, что нормальные люди не задумываются об урлах, а в идеале вовсе не знают, что это такое. Но я гик, поэтому хочу красивые и информативные адреса. Если у вас так же — давайте поговорим о плохих и хороших урлах.
https://antonz.ru/url-as-interface/
Для меня урл (URL) на сайте или в веб-приложении — часть интерфейса. Поэтому он должен быть хорош.
Понимаю, что нормальные люди не задумываются об урлах, а в идеале вовсе не знают, что это такое. Но я гик, поэтому хочу красивые и информативные адреса. Если у вас так же — давайте поговорим о плохих и хороших урлах.
https://antonz.ru/url-as-interface/
Задачка: Яндекс-музыка и медленный интернет
Мобильное приложение Яндекс-музыки пребывает в иллюзии, что всегда и везде есть хороший интернет. Когда запускаешь приложение, оно хочет показать персональные рекомендации («плейлист дня»). Если связь плохая, или телефон подключился к вайфай-сети без интернета, то приложение дооолго тупит, после чего сообщает, что «не смогла».
Давайте поможем Яндекс-музыке и предложим, что делать при запуске приложения, если интернет медленный или его вовсе нет. Чем больше при этом пользы для человека — тем лучше ツ
Разбор: https://antonz.ru/yandex-music-puzzle/
Мобильное приложение Яндекс-музыки пребывает в иллюзии, что всегда и везде есть хороший интернет. Когда запускаешь приложение, оно хочет показать персональные рекомендации («плейлист дня»). Если связь плохая, или телефон подключился к вайфай-сети без интернета, то приложение дооолго тупит, после чего сообщает, что «не смогла».
Давайте поможем Яндекс-музыке и предложим, что делать при запуске приложения, если интернет медленный или его вовсе нет. Чем больше при этом пользы для человека — тем лучше ツ
Разбор: https://antonz.ru/yandex-music-puzzle/
Задачка: бардак в Телеграме
Утром вы просматривали любимые каналы, как телеграм вдруг зазвонил. Внезапно, это был Павел Дуров. Не знаю, что на него нашло, но он хочет предложить вам работу. Точнее, разовый проект.
Павел сказал, что гордится идеей каналов в телеграме. «Это как СМИ, только лучше», — сказал он. И продолжал:
> Когда каналов становится много, работать с ними неудобно. Приходится массово мьютить, но это не спасает — всё равно засоряют список контактов и мешаются с чатами. Больше того, если рабочие чаты ведутся в телеграме — они мешаются с личной перепиской, и всё это превращается в неуправляемое месиво.
Павел просит вас решить проблему бардака с чатами и каналами в интерфейсе. Дополнительно пожелание: придумать простое и изящное решение, без масштабных переделок. «Не хочу тратить на это много денег», — пояснил он.
Давайте поможем Павлу и сделаем телеграм лучше! Для простоты ограничимся клиентом для мобильных, веб и десктоп не трогаем.
Разбор: https://antonz.ru/telegram-puzzle/
Утром вы просматривали любимые каналы, как телеграм вдруг зазвонил. Внезапно, это был Павел Дуров. Не знаю, что на него нашло, но он хочет предложить вам работу. Точнее, разовый проект.
Павел сказал, что гордится идеей каналов в телеграме. «Это как СМИ, только лучше», — сказал он. И продолжал:
> Когда каналов становится много, работать с ними неудобно. Приходится массово мьютить, но это не спасает — всё равно засоряют список контактов и мешаются с чатами. Больше того, если рабочие чаты ведутся в телеграме — они мешаются с личной перепиской, и всё это превращается в неуправляемое месиво.
Павел просит вас решить проблему бардака с чатами и каналами в интерфейсе. Дополнительно пожелание: придумать простое и изящное решение, без масштабных переделок. «Не хочу тратить на это много денег», — пояснил он.
Давайте поможем Павлу и сделаем телеграм лучше! Для простоты ограничимся клиентом для мобильных, веб и десктоп не трогаем.
Разбор: https://antonz.ru/telegram-puzzle/
Контроль версий для дизайнеров
Несколько раз натыкался на инструменты контроля версий, которые должны помогать дизайнерам совместно работать над проектом. Видел Abstract, Folio, Kactus.
Может чего не понимаю, но сдаётся мне, что всё это типичное «не то». Дизайнеры зачем-то изобретают велосипед, хотя программисты всё уже давно придумали.
Никто не пользуется отдельными графическими инструментами для контроля версий. Программист просто берёт среду разработки, в которой пишет код (IDE, integrated development environment) и подключает её к репозиторию в Гите (это самая популярная система контроля версий). А IDE делает всё остальное — синхронизирует изменения, переключает ветки, показывает историю, удобно отображает diff-ы версий.
Логично у дизайнеров сделать точно так же. Только вместо IDE должны выступать Sketch, Figma или Adobe XD. Зачем зоопарк отдельных тулов?
Несколько раз натыкался на инструменты контроля версий, которые должны помогать дизайнерам совместно работать над проектом. Видел Abstract, Folio, Kactus.
Может чего не понимаю, но сдаётся мне, что всё это типичное «не то». Дизайнеры зачем-то изобретают велосипед, хотя программисты всё уже давно придумали.
Никто не пользуется отдельными графическими инструментами для контроля версий. Программист просто берёт среду разработки, в которой пишет код (IDE, integrated development environment) и подключает её к репозиторию в Гите (это самая популярная система контроля версий). А IDE делает всё остальное — синхронизирует изменения, переключает ветки, показывает историю, удобно отображает diff-ы версий.
Логично у дизайнеров сделать точно так же. Только вместо IDE должны выступать Sketch, Figma или Adobe XD. Зачем зоопарк отдельных тулов?
Пейджинг, ещёкалка и бесконечный скрол
Когда программа показывает пользователю много данных (товаров, клиентов, результатов поиска), загружать их все сразу бывает слишком накладно. Поэтому используют постраничную загрузку в одной из трёх ипостасей.
Мой голос — за одну из них:
https://antonz.ru/paging/
Когда программа показывает пользователю много данных (товаров, клиентов, результатов поиска), загружать их все сразу бывает слишком накладно. Поэтому используют постраничную загрузку в одной из трёх ипостасей.
Мой голос — за одну из них:
https://antonz.ru/paging/
Задачка: приглашение обновить ОС
Сотрудники Apple любят хвастаться большим процентом пользователей, которые перешли на самую свежую версию ОС. Достигается этот большой процент модальным окном, которое выскакивает посреди экрана, блокируя работу с телефоном, и требует на выбор:
— Обнови меня немедленно.
— Обнови меня чуть позже.
— Насладись описанием новой версии.
Как видите, варианта «пшла прочь» не предусмотрено. Если выбрать «позже», айось немедленно подсунет второе модальное окно (уже на весь экран), в котором потребует подтвердить твёрдое намерение обновиться ночью. Если и в этом окне выбрать неприметную надпись «напомнить позже», то айось вернётся на следующий день и начнёт всё с начала.
Поэтому выбор простой: или обновляйся, или получай каждый день по щщам модальным окном. Большинство выбирает обновление.
Предположим, вы занимаете высокий пост в Apple, и по странной случайности не хотите тыкать пользователю в лицо попапами в самой типа как удобной операционной системе на свете. Но при этом хотите сохранить высокие темпы перехода пользователей на новые версии.
Что делать?
Разбор: https://antonz.ru/os-update-puzzle/
Сотрудники Apple любят хвастаться большим процентом пользователей, которые перешли на самую свежую версию ОС. Достигается этот большой процент модальным окном, которое выскакивает посреди экрана, блокируя работу с телефоном, и требует на выбор:
— Обнови меня немедленно.
— Обнови меня чуть позже.
— Насладись описанием новой версии.
Как видите, варианта «пшла прочь» не предусмотрено. Если выбрать «позже», айось немедленно подсунет второе модальное окно (уже на весь экран), в котором потребует подтвердить твёрдое намерение обновиться ночью. Если и в этом окне выбрать неприметную надпись «напомнить позже», то айось вернётся на следующий день и начнёт всё с начала.
Поэтому выбор простой: или обновляйся, или получай каждый день по щщам модальным окном. Большинство выбирает обновление.
Предположим, вы занимаете высокий пост в Apple, и по странной случайности не хотите тыкать пользователю в лицо попапами в самой типа как удобной операционной системе на свете. Но при этом хотите сохранить высокие темпы перехода пользователей на новые версии.
Что делать?
Разбор: https://antonz.ru/os-update-puzzle/
«Показать все»
Месяц назад я написал о приёме «показать все», а сегодня перечитал заметку и понял, что ничего не понял ツ Это верный признак, что не хватает наглядного примера.
Добавил его, теперь стало кристально ясно:
https://antonz.ru/show-all/
Месяц назад я написал о приёме «показать все», а сегодня перечитал заметку и понял, что ничего не понял ツ Это верный признак, что не хватает наглядного примера.
Добавил его, теперь стало кристально ясно:
https://antonz.ru/show-all/
Регистрация без регистрации
Разобрался с идентификацией в интернет-магазине, спасибо ребятам, которые просветили меня в личке.
Совсем забыл, что большинство людей используют один-два пароля для всего на свете. Соответственно, ввести «универсальный» пароль им легко, а пользоваться автосгенерированным, напротив, невозможно (его же не запомнить).
Вариант «почта вообще без пароля» большинство в реальной жизни не встречало, поэтому проигнорировало.
Телефон подходит для ситуации, когда человек заказывает курьерскую доставку, но не нужен при доставке почтой. Плюс бороться со спамом на телефоне почти нереально, в отличие от почты.
В итоге, наименее напряжным для покупателя видится такой вариант:
1. При покупке магазин даже не заикается о регистрации (цель человека — купить, а не зарегистрироваться).
2. Если человек указал в заказе эл. почту, магазин регистрирует его автоматически.
3. В письме счастья о заказе есть секретная ссылка, по которой человек авторизуется без пароля.
Таким образом, нет ни явного этапа регистрации, ни пароля. И это проще, чем вход через соцсети. Счастье!
Разобрался с идентификацией в интернет-магазине, спасибо ребятам, которые просветили меня в личке.
Совсем забыл, что большинство людей используют один-два пароля для всего на свете. Соответственно, ввести «универсальный» пароль им легко, а пользоваться автосгенерированным, напротив, невозможно (его же не запомнить).
Вариант «почта вообще без пароля» большинство в реальной жизни не встречало, поэтому проигнорировало.
Телефон подходит для ситуации, когда человек заказывает курьерскую доставку, но не нужен при доставке почтой. Плюс бороться со спамом на телефоне почти нереально, в отличие от почты.
В итоге, наименее напряжным для покупателя видится такой вариант:
1. При покупке магазин даже не заикается о регистрации (цель человека — купить, а не зарегистрироваться).
2. Если человек указал в заказе эл. почту, магазин регистрирует его автоматически.
3. В письме счастья о заказе есть секретная ссылка, по которой человек авторизуется без пароля.
Таким образом, нет ни явного этапа регистрации, ни пароля. И это проще, чем вход через соцсети. Счастье!
Угадайка и неленивый интерфейс
Ленивые интерфейсы любят выносить мозг. В любой ситуации, когда можно догадаться самостоятельно или спросить человека — ленивая программа предпочитает спросить.
Иногда, чтобы сделать из ленивого интерфейса нормальный, достаточно несложной угадайки:
https://antonz.ru/guess/
Ленивые интерфейсы любят выносить мозг. В любой ситуации, когда можно догадаться самостоятельно или спросить человека — ленивая программа предпочитает спросить.
Иногда, чтобы сделать из ленивого интерфейса нормальный, достаточно несложной угадайки:
https://antonz.ru/guess/
Лучше напрячь программиста, чем пользователя
Программы часто хотят лишнюю информацию от людей. Пол, почтовый индекс, ИНН — всякое такое.
Иногда эта информация вовсе не нужна (просто бизнес собирает «чтобы было»). Иногда — реально используется. Но даже в этом случае кучу сведений можно получить автоматически, не дёргая человека.
Например:
— Пол по ФИО
— Индекс, район города, ближайшее метро и почтовое отделение по адресу
— Все реквизиты компании по названию или ИНН
— Страну, оператора связи и часовой пояс по телефону
— Банк по номеру карты
— Аватарку по емейлу
Большинство данных легко получить из готовых API. Какие-то можно скачать в машиночитаемом виде и приделать самостоятельно.
Причём это только для новых пользователей. А если взять историю взаимодействия с существующими и проанализировать паттерны поведения, вообще можно делать чудеса.
В любом случае, лучше один раз напрячь программиста, чем тысячу раз приставать к пользователям.
Программы часто хотят лишнюю информацию от людей. Пол, почтовый индекс, ИНН — всякое такое.
Иногда эта информация вовсе не нужна (просто бизнес собирает «чтобы было»). Иногда — реально используется. Но даже в этом случае кучу сведений можно получить автоматически, не дёргая человека.
Например:
— Пол по ФИО
— Индекс, район города, ближайшее метро и почтовое отделение по адресу
— Все реквизиты компании по названию или ИНН
— Страну, оператора связи и часовой пояс по телефону
— Банк по номеру карты
— Аватарку по емейлу
Большинство данных легко получить из готовых API. Какие-то можно скачать в машиночитаемом виде и приделать самостоятельно.
Причём это только для новых пользователей. А если взять историю взаимодействия с существующими и проанализировать паттерны поведения, вообще можно делать чудеса.
В любом случае, лучше один раз напрячь программиста, чем тысячу раз приставать к пользователям.
Я медленно снимаю твои деньги с карты
Многие сервисы заранее блокируют стоимость услуги на карте клиента, чтобы убедиться в его платёжеспособности.
Банки в СМС-оповещениях не делают разницы между блокировкой и списанием (может и правильно), потому присылают «с карты списано NNN рублей».
Если клиент пользуется услугой в первый раз, он начинает вибрировать: «ничего не сделали, а деньги уже списали, кидалы, а-а-а». Начинаются нервные звонки в поддержку и ругань в соцсетях. Ситуация проясняется, но осадок остаётся.
А избежать неприятных последствий просто: достаточно объяснить человеку, что происходит. Например, Qlean присылает такую СМС:
> Мы проверим вашу карту — вы можете получить смс от банка о списании средств. Не волнуйтесь, это всего лишь проверка.
Конечно, на самом деле это не «всего лишь проверка». 50% суммы они спишут в любом случае, даже если отменить уборку (в качестве штрафа).
Но эти нюансы в СМС не объяснишь, да и до штрафа дело доходит редко. А так клиент спокоен, доволен, и не отвлекает поддержку.
Многие сервисы заранее блокируют стоимость услуги на карте клиента, чтобы убедиться в его платёжеспособности.
Банки в СМС-оповещениях не делают разницы между блокировкой и списанием (может и правильно), потому присылают «с карты списано NNN рублей».
Если клиент пользуется услугой в первый раз, он начинает вибрировать: «ничего не сделали, а деньги уже списали, кидалы, а-а-а». Начинаются нервные звонки в поддержку и ругань в соцсетях. Ситуация проясняется, но осадок остаётся.
А избежать неприятных последствий просто: достаточно объяснить человеку, что происходит. Например, Qlean присылает такую СМС:
> Мы проверим вашу карту — вы можете получить смс от банка о списании средств. Не волнуйтесь, это всего лишь проверка.
Конечно, на самом деле это не «всего лишь проверка». 50% суммы они спишут в любом случае, даже если отменить уборку (в качестве штрафа).
Но эти нюансы в СМС не объяснишь, да и до штрафа дело доходит редко. А так клиент спокоен, доволен, и не отвлекает поддержку.
Сила частичных решений
Программисты ненавидят частичные решения. Если штука работает 99 раз из 100, значит она не работает вообще — так считает программист. Если она работает 9 раз из 10, так это и вовсе издевательство.
Но при взаимодействии с людьми, этими нелогичными белковыми существами, попадание в 90% случаев — отличный результат. Главное, чтобы в оставшихся 10% алгоритм честно говорил «не знаю», а не выдавал результат наобум.
Пример: автоматическое определение пола по имени-фамилии. Да, никакой алгоритм не угадает пол у «Саши Савченко». Но если он уверенно отрабатывает на Настях и Колях, а про «Женю Зверь» честно скажет «не знаю» — это отличный алгоритм. Потому что в 90% случаев вы узнаете пол, а в оставшихся 10% — ничего не потеряете.
Понятно, что частичные решения не везде уместны. Если автопилот в одном полёте из десяти говорит «ой всё, я не смогла» — в топку такой автопилот.
Но намного чаще частичные решения помогают. Главное, чтобы не врали.
Программисты ненавидят частичные решения. Если штука работает 99 раз из 100, значит она не работает вообще — так считает программист. Если она работает 9 раз из 10, так это и вовсе издевательство.
Но при взаимодействии с людьми, этими нелогичными белковыми существами, попадание в 90% случаев — отличный результат. Главное, чтобы в оставшихся 10% алгоритм честно говорил «не знаю», а не выдавал результат наобум.
Пример: автоматическое определение пола по имени-фамилии. Да, никакой алгоритм не угадает пол у «Саши Савченко». Но если он уверенно отрабатывает на Настях и Колях, а про «Женю Зверь» честно скажет «не знаю» — это отличный алгоритм. Потому что в 90% случаев вы узнаете пол, а в оставшихся 10% — ничего не потеряете.
Понятно, что частичные решения не везде уместны. Если автопилот в одном полёте из десяти говорит «ой всё, я не смогла» — в топку такой автопилот.
Но намного чаще частичные решения помогают. Главное, чтобы не врали.
По техническим причинам
Люди любят объяснять провалы «техническими причинами»:
> По техническим причинам поезда следуют с увеличенными интервалами.
> По техническим причинам платежи картой временно не принимаются.
> По техническим причинам магазин не работает после 18:00.
Я знаю один секрет: всем плевать на абстрактные причины. Неважно, технические они, гуманитарные, политические, религиозные или социальные. Если не можете назвать конкретику, лучше ограничиться голыми фактами:
> Поезда ходят с интервалом 5–10 минут.
> Платежи картой заработают 25 января.
> Часы работы: 10–18
Выпиливайте «технические причины» из интерфейсов.
Люди любят объяснять провалы «техническими причинами»:
> По техническим причинам поезда следуют с увеличенными интервалами.
> По техническим причинам платежи картой временно не принимаются.
> По техническим причинам магазин не работает после 18:00.
Я знаю один секрет: всем плевать на абстрактные причины. Неважно, технические они, гуманитарные, политические, религиозные или социальные. Если не можете назвать конкретику, лучше ограничиться голыми фактами:
> Поезда ходят с интервалом 5–10 минут.
> Платежи картой заработают 25 января.
> Часы работы: 10–18
Выпиливайте «технические причины» из интерфейсов.
Как проектировать необходимое зло в интерфейсе
Бывают в интерфейсе операции, которые пользователю не нужны — но без них никак. Самые частые «злые» операции — регистрация и оплата. Чтобы нормально их запроектировать, предлагаю два правила:
1. Минимизировать боль
2. Сохранять контекст
https://antonz.ru/necessary-evil/
Бывают в интерфейсе операции, которые пользователю не нужны — но без них никак. Самые частые «злые» операции — регистрация и оплата. Чтобы нормально их запроектировать, предлагаю два правила:
1. Минимизировать боль
2. Сохранять контекст
https://antonz.ru/necessary-evil/
Обратить необратимое
Возможно, вы слышали о грандиозном UX-провале на Гавайях: там из-за плохого интерфейса оператор ошибся и отправил жителям оповещение о ракетном ударе (с милым дополнением «ЭТО НЕ УЧЕБНАЯ ТРЕВОГА»).
По этому поводу Гавайи и плохие интерфейсы простебали уже все кому не лень. Из основных проблем выделяют визуальную схожесть кнопок тестовой и реальной тревоги, плохое подтверждение действия и не-сценарность интерфейса (он выглядит просто как свалка ссылок).
Но главная беда, на мой взгляд, такая:
— Нет отмены ошибочной операции —
Кажется, у необратимых операций всегда должна быть отмена. Это контринтуитивно (мол, какая же отмена, если операция необратимая). Но именно таким операциям и нужна отмена.
Простейший способ добавить отмену необратимого действия — выполнять его не по факту нажатия на кнопку, а отложенно, через N секунд. Обычно человек моментально понимает, что сделал что-то не то — и успевает отменить. Если вы когда-нибудь по ошибке отправляли письмо не тому человеку, то знаете, как это бывает ツ
Возможно, вы слышали о грандиозном UX-провале на Гавайях: там из-за плохого интерфейса оператор ошибся и отправил жителям оповещение о ракетном ударе (с милым дополнением «ЭТО НЕ УЧЕБНАЯ ТРЕВОГА»).
По этому поводу Гавайи и плохие интерфейсы простебали уже все кому не лень. Из основных проблем выделяют визуальную схожесть кнопок тестовой и реальной тревоги, плохое подтверждение действия и не-сценарность интерфейса (он выглядит просто как свалка ссылок).
Но главная беда, на мой взгляд, такая:
— Нет отмены ошибочной операции —
Кажется, у необратимых операций всегда должна быть отмена. Это контринтуитивно (мол, какая же отмена, если операция необратимая). Но именно таким операциям и нужна отмена.
Простейший способ добавить отмену необратимого действия — выполнять его не по факту нажатия на кнопку, а отложенно, через N секунд. Обычно человек моментально понимает, что сделал что-то не то — и успевает отменить. Если вы когда-нибудь по ошибке отправляли письмо не тому человеку, то знаете, как это бывает ツ
Секта свидетелей личного кабинета
Есть два типа дизайнеров:
— одни все настройки и статистику запихивают в «личный кабинет» (таких большинство),
— другие раскладывают их по фича-разделам.
Поясню на примере.
Есть у нас сервис с двумя фичами: «чесать за ухом» и «гладить по спинке». Фичи сильно разные. «Чесать за ухом» работает по годовой подписке, «гладить по спинке» — оплачивается за каждое поглаживание. Отличается целевая аудитория, ведётся раздельная статистика, разная система скидок — ну вы поняли.
И вот нам надо куда-то добавить управление подпиской и статистику. Есть два варианта:
1) Делаем в личном кабинете разделы «оплата» (внутри разбиение на «чесалку» и «гладилку») и «статистика» (внутри аналогичное разделение).
2) Берём промо-экран «чесалки» и меняем его для залогиненных пользователей: убираем вводную (человек ведь уже в курсе) и добавляем модули «подписка» и «статистика». Аналогично делаем для «гладилки». Личный кабинет не делаем вовсе.
Большинство выбирает первый вариант. Мне он не слишком по душе. А вам?
Есть два типа дизайнеров:
— одни все настройки и статистику запихивают в «личный кабинет» (таких большинство),
— другие раскладывают их по фича-разделам.
Поясню на примере.
Есть у нас сервис с двумя фичами: «чесать за ухом» и «гладить по спинке». Фичи сильно разные. «Чесать за ухом» работает по годовой подписке, «гладить по спинке» — оплачивается за каждое поглаживание. Отличается целевая аудитория, ведётся раздельная статистика, разная система скидок — ну вы поняли.
И вот нам надо куда-то добавить управление подпиской и статистику. Есть два варианта:
1) Делаем в личном кабинете разделы «оплата» (внутри разбиение на «чесалку» и «гладилку») и «статистика» (внутри аналогичное разделение).
2) Берём промо-экран «чесалки» и меняем его для залогиненных пользователей: убираем вводную (человек ведь уже в курсе) и добавляем модули «подписка» и «статистика». Аналогично делаем для «гладилки». Личный кабинет не делаем вовсе.
Большинство выбирает первый вариант. Мне он не слишком по душе. А вам?
Убийственный дизайн
Наткнулся на классную, судя по всему, книгу — Tragic Design. Об ошибках в дизайне, которые калечат и убивают — и о том, как их избежать.
Вторая глава с захватывающим названием «Design Can Kill» есть в открытом доступе. Там разобраны 4 ситуации, когда ошибки в интерфейсе продукта привели к фатальным последствиям:
— Аппарат для лучевой терапии, которые стрелял в пациентов направленным пучком в 17000 рад (в 85 раз больше нормальной дозы).
— Паром, у которого «газ» и «тормоз» менялись местами в зависимости от режима (вспоминается классическое программистское «define TRUE FALSE»).
— Автомобиль, который блокировал двери и загорался при ударе сзади — и убил таким способом 180 человек.
— Самолёт, который влетел в гору, потому что путал градусы с вертикальной скоростью.
Почитайте, чтобы навсегда перестать использовать режимы в интерфейсе. Это будет поубедительнее, чем аналогичная тема у Раскина ツ
Наткнулся на классную, судя по всему, книгу — Tragic Design. Об ошибках в дизайне, которые калечат и убивают — и о том, как их избежать.
Вторая глава с захватывающим названием «Design Can Kill» есть в открытом доступе. Там разобраны 4 ситуации, когда ошибки в интерфейсе продукта привели к фатальным последствиям:
— Аппарат для лучевой терапии, которые стрелял в пациентов направленным пучком в 17000 рад (в 85 раз больше нормальной дозы).
— Паром, у которого «газ» и «тормоз» менялись местами в зависимости от режима (вспоминается классическое программистское «define TRUE FALSE»).
— Автомобиль, который блокировал двери и загорался при ударе сзади — и убил таким способом 180 человек.
— Самолёт, который влетел в гору, потому что путал градусы с вертикальной скоростью.
Почитайте, чтобы навсегда перестать использовать режимы в интерфейсе. Это будет поубедительнее, чем аналогичная тема у Раскина ツ
Если нет награды, прогресс бесполезен
Мотивация усиливается по мере приближения к цели. Особенно хорошо это работает, если человек видит прогресс.
Продукты и сервисы вовсю этим пользуются. Хрестоматийный пример — LinkedIn с его «прогрессом заполнения профиля», но вообще приём используется повсеместно. Даже на форме заявки на кредитку пишут «шаг 1 из 4» — это тоже визуализация прогресса.
Приём работает при одном условии — человек понимает, в чём награда. Прогресс сам по себе не особо мотивирует, если я не понимаю, что получу взамен.
Хрестоматийный анти-пример — приложение заказа такси Gett. У них есть программа лояльности со статусами вроде «суперзвезда», «вожак стаи» и «босс». Но статусы ничем не отличаются, кроме названия и количества очков, которые надо набрать.
Так было несколько лет. Потом, похоже, кто-то в Gett заметил, что программа лояльности никого не делает лояльнее, и задумался о наградах. И придумал «скидку в часы пик».
И теперь эту скидку написали всем статусам выше определённого уровня. Одну и ту же ツ Но если награда везде одна и та же — это всё равно что её нет.
В общем, если показывать прогресс достижения цели — то вывесить понятную награду. А если у цели несколько уровней, то и награды должны быть разными.
Мотивация усиливается по мере приближения к цели. Особенно хорошо это работает, если человек видит прогресс.
Продукты и сервисы вовсю этим пользуются. Хрестоматийный пример — LinkedIn с его «прогрессом заполнения профиля», но вообще приём используется повсеместно. Даже на форме заявки на кредитку пишут «шаг 1 из 4» — это тоже визуализация прогресса.
Приём работает при одном условии — человек понимает, в чём награда. Прогресс сам по себе не особо мотивирует, если я не понимаю, что получу взамен.
Хрестоматийный анти-пример — приложение заказа такси Gett. У них есть программа лояльности со статусами вроде «суперзвезда», «вожак стаи» и «босс». Но статусы ничем не отличаются, кроме названия и количества очков, которые надо набрать.
Так было несколько лет. Потом, похоже, кто-то в Gett заметил, что программа лояльности никого не делает лояльнее, и задумался о наградах. И придумал «скидку в часы пик».
И теперь эту скидку написали всем статусам выше определённого уровня. Одну и ту же ツ Но если награда везде одна и та же — это всё равно что её нет.
В общем, если показывать прогресс достижения цели — то вывесить понятную награду. А если у цели несколько уровней, то и награды должны быть разными.