10 заметок с тегом

пользовательский интерфейс

Микросессии

Немного интересного про микросессии в мобильных приложениях. Это такие сессии, которые длятся не более 15 секунд. Есть много мобильных задач, которые мы выполняем каждый день. Это какие-то простые задачи, которые мы выполняем за несколько десятков секунд. Например, установка будильника или просмотр календаря на день.

Конечно же, приложение нужно спроектировать как-то так, чтобы магистральные сценарии были легко доступны. Но вы можете пойти ещё дальше и позволить людям выполнять их не заходя в приложение. Вот 4 способа, которые я подсмотрел.

Уведомления

Уведомления — это самый популярный способ, которым приложения сегодня поддерживают микросессии. Уведомления дают по крайней мере одну точку входа в приложение, нажатие на уведомление открывает приложение. Но во многих случаях их функция заключается в том, чтобы информировать человека о состоянии дел. Когда уведомление разработано правильно, пользователи часто могут получить всю необходимую им информацию из текста уведомления и могут не нуждаться в запуске полного приложения.

Яндекс Такси рассказывает, что жёлтый Хендай Солярис с номером ТУ54177 ждёт вас

В некоторых случаях можно поддержать основные действия, которые применяются к элементу уведомления в самом уведомлении. Это дает пользователю возможность выполнить задачу, не запуская приложение. Например, для новостной статьи подходящим действием может быть сохранение ее для дальнейшего чтения, тогда как для уведомления по электронной почте может быть полезно удалить сообщение, а для календаря, например, вот такие:

Календарь предлагает дополнительные действия с событием

Виджеты

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

Быстрые действия

Последние версии iOS и Android поддерживают доступ к действиям в приложении непосредственно с рабочего стола, с помощью длинного нажатия. Быстрые действия избавляют пользователей от необходимости запускать приложение и находить внутри него точку входа для задачи, которую они хотят выполнить. Быстрые действия не должны включать только задачи, которые могут быть микросессионны — вместо этого они должны ссылаться на задачи, которые важны для ваших пользователей.

Интеллектуальные помощники

И приложения для iOS, и для Android могут использовать интеллектуальных помощников, чтобы позволить пользователям быстро взаимодействовать с приложением с помощью голоса. Это отличный способ для решения задач человека без входа в приложение.

Выводы

Если на изменение дизайна или инновации потребуется много денег, но это принесет пользу лишь нескольким вашим пользователям — это путь в пропасть. ROI, вероятно, слишком низок. Но, в отличие от других инновационных разработок, поддержку микросессий легко реализовать.

8 января   дизайн   пользовательский интерфейс

Планы на 2020 год

План победы: 2017 · 2018 · 2019 · 2020

Фокус в 2020 хочу направить на следующие направления:

  • мобильный дизайн,
  • дизайн-менеджмент,
  • фронтенд,
  • пользовательский опыт.

Прочитать

  1. «Envisioning Information» Edward Tufte
  2. «The Handbook of Design Management» Rachel Cooper, Sabine Junginger, Thomas Lockwood
  3. «Бизнес с нуля» Эрика Риса
  4. «Дизайн привычных вещей» Дональда Нормана
  5. «О продакт менеджменте» Интеркома

Сходить

  1. Фестиваль дизайна и цифрового искусства OFFF Moscow 2020

Поучиться

  1. «Как руководить дизайнерами» Костя Горский Очень круто. Обязательно к изучению.
  2. «Быстрая анимация иллюстрации в After Effects» Константин Новиков
  3. «Как организовать команду» Ольга Герасименко Максимально полезным оказалась последняя лекция. Написал даже конспект на эту тему семь фаз формирования команды.
  4. «Дизайн своей карьеры» Дмитрий Карпов Хороший быстрый интенсив нацеленный на новых людей в профессии.
  5. «UX: Поведенческое проектирование» Дмитрий Карпов
  6. «Здоровые настройки» Ольга Герасименко
  7. «Принципы Principle» Александр Токарев
  8. «Как победить конкурентов и инерцию выбора» Ивана Замесина
  9. «Мобилизация» Школы дизайна Яндекса
  10. «Управление проектами и продуктом» Школы менеджмента Яндекса
  11. Mobile Product
  12. User Research — Methods and Best Practices
  13. User Experience (UX): The Ultimate Guide to Usability and UX
  14. Beyond Usability: Learn the User Research Toolkit
  15. «Основы JavaScript» HTML Academy
  16. «Паттерны дизайн-менеджмента» Юрий Ветров

Сделать

  1. Работать над Wash.me
  2. Сделать три мобильных жизнеспособных проекта
  3. Сделать что-то, где я сам попрактикуюсь с JavaScript
  4. Собрать крепкую дизайн-команду
  5. Систематизировать процесс работы над задачами
  6. Довести до завершения «Радиоэмоции»
  7. Составить планы на 2021

План победы: 2017 · 2018 · 2019 · 2020

Чтобы не пропустить новую заметку — подпишитесь на мой канал в Телеграме или RSS.

Сценарии поиска информации

Для себя я недавно выяснил одну интересную штуку. Если продукт решает проблему поиска чего-то, то скорее всего есть три сценария поиска информации для человека. Первый, человек чётко знает, что ищет. Второй, человек не знает, что хочет и пытается понять что ему нужно. Третий, человек видел где-то что-то и пытается это найти.

Поиск известного

В этом случае человек знает, что ищет. Дайте ему легко ввести свой запрос, чтобы максимально быстро получить ответ. Это может быть голосовой интерфейс, текстовый поиск или быстрые ссылки. Как пример, покажу фрагмент сайта по поиску объявлений о продаже авто:

Поиск неизвестного

Человек не знает что, хочет. В этом случае ему нужно помочь определить подходящий вариант по потребностям. Если опять взять, например, сайт по поиску объявлений о продаже авто, то это может быть: тип кузова, ценовой диапазон, количество мест и так далее.

Поиск увиденного

В этом случае человек ищет то, что когда-то видел, но не может вспомнить что это. Тут важно как-то показать ему что есть на сайте визуально и дать возможность последовательно убрать лишнее и легко вернуться на шаг назад.


Чтобы не пропустить новую заметку — подпишитесь на мой канал в Телеграме или RSS.

2019   поиск информации   пользовательский интерфейс

Макетная актуальность

Проектируя что-то новое на основании старого, дизайнеру необходимо куда-то обращаться за информацией. Например, как это работает, а как выглядит этот модуль, как себя поведет система?

У нас в команде есть 5 источников таких знаний:

  • требования в Jira,
  • макеты в Zeplin,
  • статическая вёрстка,
  • cтейджинг,
  • голова дизайнера.

Итак, разложим каждый по характеристикам: лёгкость поиска, читаемость, близость к правде, видимость деталей.

Требования в Jira

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

Макеты в Zeplin

Макеты легко найти, но тяжело поддерживать. У них понятная структура, нейминг и есть превьюшки. Они близки к правде и показывают почти все состояния элементов интерфейса и детали сценариев.

Статическая вёрстка

К ним простой доступ по домену. Есть структура как у макетов, но не настолько детальная. Они близки к правде, так как они и есть правда. Как правило, верстка не показывают все состояния элементов интерфейса и детали сценариев.

Стейджинг

К ним простой доступ по домену. Он имеет горизонтальную структуру и порой, чтобы увидеть какой-то экран, нужно сделать много действий, взаимодействовать с админкой или с чем-то ещё. Он самый правдивый из всех, но все детали сценариев и состояния элементов интерфейса трудно воспроизвести.

Голова дизайнера

К сожалению в свою голову всё не помещается, а чужая часто недоступна. Дизайнер скорее всего хорошо знает структуру, детали и состояния, но это не точно. Он легко может ошибиться или забыть.

Вывод

Требования Макеты Вёрстка Стейджинг Голова
Лёгкость поиска + + +
Читаемость + +
Правдивость +/− + + + +/−
Видимость деталей +
Итого −3 4 3 0 −3

Вот и решайте теперь, стоит держать макеты актуальными или нет.


Чтобы не пропустить новую заметку — подпишитесь на мой канал в Телеграме или RSS.

Радиоэмоции 1.0

Радиоэмоции — это плагин, который поможет узнать что думают о вашем контенте пользователи. Семь эмоций в наборе, любой текст на кнопках.

Пользователи оставляют свои эмоции, плагин считает их и выводит количество:

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

Дизайн и идея — я, программист — Ольга Мохова.


Плагин бесплатный для всех: radioemoji.intuition.team


Чтобы не пропустить новую заметку — подпишитесь на мой канал в Телеграме или RSS.

Ранее Ctrl + ↓