Виды действий

Чтобы лучше понимать как устроены приложения, буду тут собирать требования от операционных систем.

iOS

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

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

Разработка простых шаблонов иконок для экрана ваших пользовательских действий. Шаблонная иконка использует маску для создания иконки. Используйте черно-белое изображение с соответствующей прозрачностью и сглаживанием, не добавляя тени. Изображения шаблона должны быть центрированы в области размером около 70 × 70 пикселей.

Создайте названия заданий, которые кратко описывают ваши задачи. Заголовки отображаются под значками в представлении активности. Короткие заголовки работают лучше всего. Когда заголовок слишком длинный, iOS сначала сжимает текст, а затем — если заголовок все еще слишком длинный — обрезает его. В общем, избегайте включения названия вашей компании или продукта в название.

Используйте иконку «Действие» для отображения вида активности. Люди привыкли получать доступ к системным действиям, когда нажимают кнопку «Действие»:

Android

В Android нет отдельного инструмента, там используют для этого меню действий.


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

10 января   ios vs android

Микросессии

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

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

Уведомления

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

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

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

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

Виджеты

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

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

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

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

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

Выводы

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

Управление выбором

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

iOS

Для выбора среди относительно небольшого числа вариантов в iOS используйте элемент управления выбора. Вы можете отображать его закрепленным внизу, как показано выше. Используйте предсказуемые и логически упорядоченные значения. Многие значения в средстве выбора могут быть скрыты, когда прокручиваемые списки являются стационарными.

Используйте отдельный экран для выбора в больших списках значений. Длинные списки могут быть утомительными для навигации в пикере. Для более длинных списков вариантов или, когда возможен множественный выбор, как на iOS, так и на Android, часто встречается выделенный «экран выбора».

Android

Для выбора из нескольких вариантов на Android обычно используется раскрывающееся меню, которое отображается на месте или модальное диалоговое окно со списком вариантов, которое отображается по центру и затемняет фон приложения.

Меню, которое открывается на месте

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

Модальные диалоговые окна со списком вариантов выглядят так:


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

2 января   ios vs android

Планы на 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

Сделать

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

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

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

Меню действий

Чтобы лучше понимать как устроены приложения, буду тут собирать требования от операционных систем.

iOS

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

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

Предоставьте кнопку «Отмена», если это добавляет ясности. Кнопка «Отмена» вселяет уверенность, когда пользователь покидает задачу. Кнопки отмены всегда должны быть включены в меню действий внизу экрана.

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

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

В новой версии iOS (iOS 13) функция, называемая «контекстное меню», отображает связанные действия при нажатии и удержании элемента. Когда отображается контекстное меню, фон размыт. Вы можете использовать контекстные меню, чтобы дать людям доступ к дополнительным функциям, связанным с сущностями, не загромождая интерфейс. Это главное отличие от меню действий.

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

Не используйте кнопку действия, которая открывает предварительный просмотр элемента. Люди могут нажать, чтобы открыть элемент, который они просматривают, поэтому обычно нет необходимости предоставлять явную кнопку «Открыть».

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

Android

В Android, однако, нижние листы появляются только при нажатии на иконку с тремя точками (это иконка Android для «дополнительных параметров»). И обычно появляются снизу только тогда, когда есть много вариантов возможных действий.

Выпадающее меню обычно располагается под элементом, который его генерирует.

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

Меню действий могут использоваться вместо меню для представления дополнительных действий на экране. Не делайте высокое меню действий полноэкранными при открытии. При свайпе он может стать полноэкранным. Нажатие на холст или свайп вниз отклоняет меню.


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

3 декабря   ios vs android
Ранее Ctrl + ↓