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

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

Хотя имплицитная персонализация предоставляет определенные преимущества, часто она не оправдывает ожиданий, поскольку не все, что пользователи делают в приложении, они делают для себя самих. Например, некоторые покупки в приложениях для электронной коммерции могут оказаться подарками или могут быть совершены по просьбе друзей или членов семьи. Чтобы рекомендации были более точными, предоставьте пользователям либо указать свои предпочтения (рис. 4.24), либо настроить свои предпочтения, обозначив, включать ли тот или иной элемент в рекомендованный список в следующий раз (рис. 4.25).

(а)

(б)

(в)

Рис. 4.24. Приложение Netflix предоставляет пользователям возможность самостоятельно обозначить свои интересы, предлагая им указать при регистрации год своего рождения и пол (a), оценить жанры кино (б) и указать фильмы в разделе Movies You’ll Love (Фильмы, которые вам бы понравились) (в)

Рис. 4.25. Приложение Amazon позволяет пользователям указать, были ли их предыдущие покупки подарками и/или их не нужно использовать в качестве основы для составления рекомендаций. Пользователи также могут указывать товары, которые у них уже есть, чтобы их не добавляли в список «Рекомендованные вам товары» («Recommended for You»)

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

Поскольку невозможно с точностью предугадать потребности пользователей, персонализация несовершенна. По этой причине попробуйте применить шаблон CUSTOMIZATION, чтобы у пользователей была возможность адаптировать контент и интерфейс к своим потребностям. Кроме того, иногда при персонализации можно учитывать местонахождения пользователя – например, пользователям можно показывать страницы, специально адаптированные для той страны, из которой они выходят в Интернет. Поэтому попробуйте применить шаблон GLOBAL GATEWAY, о котором говорится в главе 10.

CUSTOMIZATION (КАСТОМИЗАЦИЯ)

Проблема

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

Решение

Предоставьте пользователям такие возможности кастомизации, как добавление или удаление контента, выбор макета страниц, настройка оформления (цветовые решения, шрифты и т. д.), и, по необходимости, добавление или импортирование своего собственного контента (рис. 4.26).

Рис. 4.26. Портал Yahoo! позволяет пользователю настраивать контент, макет и цвета на своей странице My Yahoo!

Зачем

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

Как

Предложите пользователям варианты кастомизации контента, оформления и уровней приложения.

Кастомизация контента

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

Рис. 4.27. Когда пользователи проходят по ссылке «Добавить гаджеты» в приложении iGoogle, они видят разбитый на категории список «Гаджетов», которые они могут добавить на свою страницу. Когда пользователь выбирает гаджет, iGoogle рекомендует, какие гаджеты пользователю могут также понравиться, опираясь на его предыдущий выбор. Таким образом, iGoogle помогает пользователям находить нужный им контент

Еще один способ помочь пользователям отобрать контент – это предоставить подробные описания и оценки пользователей (см. шаблон RATINGS в главе 9).

Применение персонализации как части кастомизации также является способом помочь пользователям найти нужный им контент. Например, когда пользователь добавляет модуль контента в приложении iGoogle (эти модули называются «гаджетами»), ему также предлагается пройти по ссылке «Вам также могут понравиться…», чтобы просмотреть похожий контент. Также iGoogle помогает пользователям, предоставляя им возможность, добавлять контент автоматически, опираясь на название вкладки, которую они добавляют на свою страницу (рис. 4.28).

Рис. 4.28. Приложение iGoogle предлагает пользователю опцию I’m feeling lucky. Automatically add stuff based on the tab name (Мне повезет. Автоматически добавлять материалы, исходя из названия вкладки), когда он добавляет новую вкладку на свою страницу iGoogle

Кастомизация оформления

Под кастомизацией оформления имеется в виду изменение «внешнего вида» приложения, т. е. макета страницы, цветов и тем (рис. 4.29).

Рис. 4.29. Приложение My MSN предлагает пользователям несколько вариантов изменения оформления: различные цветовые решения, темы и особые поводы, такие как День Святого Валентина, 8 Марта, Новый год и т. д.

Однако большинство пользователей не дизайнеры. Если предложить им большой выбор оттенков цвета, их выбор может оказаться неудачным и приложением будет сложно пользоваться. Поэтому попробуйте предложить им выбрать из готовых вариантов цветовых решений. Однако это не значит, что кастомизация должна быть ограничена заранее заданным набором вариантов. Предоставьте пользователям возможность также самостоятельно выбрать цвета (рис. 4.30).

Рис. 4.30. Сервис Basecamp предлагает пользователям выбрать из готовых вариантов цветовых решений; также он предлагает опцию custom (настройка), которой можно воспользоваться для того, чтобы самостоятельно выбрать отдельные цвета

Кастомизация приложения

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

(а)

(б)

Рис. 4.31. Сервис SalesForce предлагает пользователям несколько вариантов кастомизации, включая возможность настраивать элементы пользовательского интерфейса (a). При кастомизации элементов пользовательского интерфейса пользователи могут указать даже типы полей, такие как валюта, дата/время, электронная почта, перечень (т. е. раскрывающийся список), текст и т. д. (б). Сервис SalesForce применяет мастера настроек для помощи пользователям на каждом этапе кастомизации

Сведите к минимуму выбор вариантов кастомизации во время регистрации

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

Кастомизация не должна быть обязательной

Как уже упоминалось, вряд ли пользователи будут часто менять настройки интерфейса, а многие пользователи вообще не будут пользоваться кастомизацией (Маккей, 1991).

По этой причине важно, чтобы веб-приложение было удобным и эффективным и без кастомизации.

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

Поскольку порталы (PORTALS) обычно должны поддерживать большие объемы контента, они обычно позволяют пользователям кастомизировать контент и оформление. Обычно для кастомизации пользователю приходится прилагать усилия.

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

BLANK SLATE (ЧИСТЫЙ ЛИСТ)

Проблема

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

Решение

На чистой странице ответьте на вопросы, которые могут появиться у новых пользователей, например, вопросы о том, как начать работу, что делать дальше и как будет выглядеть страница после заполнения данными (37signals, 2006). Для этого можно предложить пользователям обучающие руководства и пояснительные тексты и/или показать снимок экрана с типичной страницей, наполненной контентом (рис. 4.32).

Рис. 4.32. Сервис выписки счетов Blinksale предоставляет краткую инструкцию по пользованию информационной панелью и показывает пример информационной панели, демонстрирующий пользователям, как она должна выглядеть после внесения данных

Зачем