1 of 14

Как подготовить макет интерфейса пользователя и сценарий использования?

Марк Заславский, mark.zaslavskiy@gmail.com

2 of 14

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

  • Макет
    • визуальное представление планируемого интерфейса пользователя,
    • схема взаимодействия элементов управления (кнопок, полей ввода, экранов).
  • Показывает каким вы (и/или пользователь) хотите видеть интерфейс.

3 of 14

Пример макета

4 of 14

Что такое сценарий использования?

  • Дано: приложение, пользователь.
  • Сценарий использования (use case, CИ).
  • Сценарий использования это описание того, что делает пользователь с вашим приложением для достижения своей цели.
  • СИ содержит не только действия пользователя, но и ответные реакцию приложения.
  • Одна цель == один сценарий.

5 of 14

Зачем (мне) нужен макет и СИ

  • Семь раз отрежь и один раз отмерь.
  • Планы меняются, но без планов страшно.
  • Упрощение разработки.
  • Экономия сил.
  • Избежание проблем.
  • Ориентация на пользователя.
  • Согласование видения разных участников.

6 of 14

http://www.cvr-it.com/images/PM_Build_Swing.gif

7 of 14

Связь между макетом и сценарием

  • Последовательность создания:
    • Макет
    • Сценарий
  • При этом, макет и СИ должны быть между собой согласованы.

8 of 14

Делаем макет

  • Каждый экран рисуется отдельно.
    • С чего пользователь должен начать работу в приложении?
    • Какие функции будут в приложении?
    • Какой экран чему соответствует?
  • Максимальная детализация элементов управления.
  • Визуализируем переходы между экранами.
  • Как:

9 of 14

Частые ошибки в макетах

  • Лишние элементы управления.
  • «Здесь будет визуализация» - отсутствие примерного наброска графика/диаграммы.
  • «Введите данные так абстрактно, как возможно» - когда по макету не ясно, какого ввода система ждет от пользователя.
  • Advanced:
    • Отсутствие индикаторов прогресса (progress bar, spinwheel).
    • «Колея» - когда у пользователя нет возможности свободно двигаться по приложению.

10 of 14

Описываем сценарий использования

  • Описываем действия глазами пользователя.
  • Максимально однозначное описание.
  • Предусловие*
  • Основной сценарий.
  • Альтернативный сценарий -
    • Нежелательное завершение взаимодействия для пользователя. (Ошибка соединения)
    • Отмена операции
  • Результат*

11 of 14

Частые ошибки в сценариях использования

  • Пропуск этапов сценария.
  • Расплывчатое описание описание вводимых данных.
  • Advanced: Расплывчатое описание типа пользовательского ввода.

12 of 14

13 of 14

Пример сценария использования

Сценарий использования - «Срабатывание будильника»:

Действующее лицо: Пользователь

Основной сценарий:

  1. Будильник срабатывает в установленное время, включается громкая надоедливая музыка.
  2. Пользователь долго нажимает движущуюся кнопку при великолепном звуковом сопровождении.
  3. Пользователь трясет телефон.
  4. Пользователь получает выбор – отложить или выключить.
  5. Пользователь жмет кнопку «Отложить».
  6. Переход на шаг 1.

Альтернативный сценарий:

  • Пользователь выключает будильник.
  • Пользователь проснулся.

Автор макета и сценария использования - Эдуард Блеес, проект https://github.com/EduardBlees/AlarmClock

14 of 14

Литература