Шаблоны проектирования веб-приложений

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

Чистая страница должна выполнять несколько функций: формировать адекватные ожидания, стимулировать деятельность, знакомить пользователя с тем, как будет в конечном итоге выглядеть страница, и производить позитивное первое впечатление от приложения (Hoekman, 2008; 37signals, 2006).

Как

Важный элемент проектирования эффективной чистой страницы – это отображение одного или нескольких действий, с помощью которых можно убрать чистый лист и познакомить пользователей с приложением (рис. 4.33).

Рис. 4.33. На чистой странице приложения Box.net пользователям предлагается несколько способов начала работы (например, создать новую папку, создать новую общую папку). Также пользователям предлагается опция Watch video demo (Посмотреть демонстрационный ролик)

Эти действия могут сопровождаться сообщениями, объясняющими пользователям, почему они не видят никакого контента. Например, сервис Basecamp показывает такие сообщения, как «Создать первую панель для записей по данному проекту», под словом «первая» подразумевается, что пользователи еще не создали ни одной панели для записей (рис. 4.34).

Рис. 4.34. Сервис Basecamp показывает сообщение Create the first writeboard for this project (Создать первую панель для записей по данному проекту), чтобы обозначить, что пользователь еще не создал ни одной панели для записей. Также пользователи могут увидеть, что собой представляют панели для записей, и посмотреть демонстрационный ролик (который длится приблизительно 2 минуты), чтобы получить о них больше информации

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

С помощью обучающих пособий и демонстрационных материалов объясните пользователям, какие этапы нужно пройти, чтобы начать работу с веб-приложением или новым функционалом (см. рис. 4.34). Эти руководства должны быть целенаправленными и короткими, чтобы пользователи быстро могли начать работу с приложением.

Покажите пользователям примеры снимков экрана

Пользователи должны знать, чего им ожидать. Для этого покажите им пример снимка экрана страницы, наполненной контентом. Обозначьте, что в примере указаны ненастоящие данные, отметив пример водяным знаком, таким как «Образец данных» или «Пример», или сделайте снимок экрана тусклым, чтобы он сливался с фоном (рис. 4.35).

Рис. 4.35. Сервис Blinksale показывает пример в виде тусклого снимка экрана с отметкой Example (Пример)

Помогайте пользователям с первоначальными настройками

Если пользователи должны выполнить определенные задания, прежде чем начать работать с веб-приложением, предоставьте им возможность воспользоваться подсказками на начальном этапе настройки. Например, в приложении для работы с финансами пользователям может быть предложено создать счет (рис. 4.36).

Рис. 4.36. Сервис Mint предлагает пользователям помощь в первоначальной настройке учетной записи. Пользователи видят страницу без контента, на которой тусклым цветом обозначены примеры данных, чтобы пользователи получили общее представление о том, как в конечном итоге будет выглядеть их учетная запись

Связанные шаблоны проектирования

Шаблон BLANK SLATE обеспечивает необходимое руководство для новых пользователей приложения, чтобы они быстро могли включиться в работу. Необходимость помогать пользователям не исчезает, когда они наладили взаимодействие с приложением и внесли необходимые данные. Необходимо продолжать помогать пользователям в течение всего процесса их взаимодействия с приложением, применяя для этого шаблоны CONTEXTUAL HELP, FREQUENTLY ASKED QUESTIONS и APPLICATION HELP, о которых будет рассказано в главе 14, и шаблон INPUT HINTS/PROMPTS, описанный в главе 2.

Глава 5

Навигация

Введение

Процесс проектирования навигации заключается в создании связей между различными частями приложения (т. е. контентом и функционалом) и применение их иерархической структуры для эффективного и результативного выполнения пользовательских задач. Сюда относится структурирование, маркирование и презентация контента и функционала. Данная глава посвящена шаблонам, имеющим отношение к типам навигационных систем и их презентации; чтобы узнать о структурировании и маркировании навигационных систем, см. работы Морвиля и Розенфельда (Morville and Rosenfeld, 2006), Кальбаха (Kalbach, 2007) и Флеминга (Fleming, 1998).