|
|||
реклама у нас | |||
*** |
Графическая нотация взаимодействий пользователя с веб-сайтомАвтор: Джесс Джеймс Гарретт Резюме Одним из способов представления информационной архитектуры и взаимодействий пользователя с веб-сайтом является использование диаграмм. Этот документ представляет некоторые аспекты моделирования информационных систем, основные графические символы для документирования информационной архитектуры и способов взаимодействия пользователя с веб-сайтом в виде диаграмм, а так же методику создания и использования таких диаграмм. История развития документа Версия 1.1b (06 Марта 2002)
Версия 1.1 (31 Января 2001)
Версия 1.0 (17 Октября 2000)
Предисловие переводчика Большое влияние на перевод этого текста оказала книга А. Леоненкова «Самоучитель UML»,а многие термины и словарные конструкции использованы мной в том же смысле, что и А. Леоненковым. Вообще, эта книга является ключом к правильному пониманию графической нотации для моделирования ИА и способов взаимодействия пользователя с сайтом. Замечу, что данная нотация не имеет никакого отношения к UML и, по сути, является всего лишь одним из способов представления ИА, созданным архитектором для собственных нужд. Однако этот способ моделирования информационной системы показался мне достаточно простым и гибким для того, чтобы его можно было предложить использовать остальным. Приятного прочтения. Предисловие Графическая нотация — это набор символов, используемых для визуального моделирования чего-либо (обычно системы, структуры или процесса). Нотация, представленная здесь, может быть использована информационным архитектором или дизайнером взаимодействий (Interaction Designer) для того, чтобы описать на высоком уровне абстракции информационную архитектуру и/или процесс взаимодействия пользователя с веб-сайтом. Эти описания (диаграммы) разрабатываются для пяти основных аудиторий:
Каждый из представителей любого типа (кроме спонсоров) нуждается в огромном количестве дополнительных деталей, чтобы успешно выполнить свою работу. Проблема в том, что компоненты моделируемой системы, необходимые для работы одной аудитории очень сильно отличаются от компонентов, нужных другой. Единственным решением этой проблемы является использование минимального уровня детализации (максимального уровня абстракции) на диаграммах таким образом, чтобы диаграммы были одинаково понятны любому типу аудитории. Диаграмма в этом случае служит основой для создания более детализованных документов, ориентированных уже на конкретные потребности каждой аудитории. Некоторые ключевые требования графической нотации для документирования информационной архитектуры и способов взаимодействия пользователя с веб-сайтом включают в себя:
Моделирование статичной информационной системы Информационная архитектура и дизайн взаимодействий как способы моделирования информационной системы — это две стороны одной монеты (см. элементы структуры «Опыта Пользователя», там есть определения этих терминов в том смысле, в котором они использованы здесь.) Создание диаграмм структуры сайта связано с обоими типами моделирования. Но цели диаграмм для каждого типа будут слегка отличаться. В обоих случаях диаграммы представляют макроструктуру, с необходимым минимумом деталей для того, чтобы разработчики могли увидеть картину целиком. Поэтому задача архитектора состоит в том, чтобы заранее определить необходимый уровень детализации диаграммы. Микроструктура (структура отдельно взятой страницы) описывается в других документах и, скорее всего, не архитектором (а дизайнером — прим. пер.) Диаграмма информационной архитектуры должна представлять концептуальную структуру и организацию содержания сайта. Заметим, что концептуальная структура — это не то же самое, что структура навигации. Цель диаграммы ИА не состоит в том, чтобы представить полную спецификацию системы навигации по сайту, это лучше сделать в другом документе, где можно позволить себе больший уровень детализации. Диаграмма взаимодействий должна представлять, способы выполнения пользователем отдельных задач на сайте, а также дискретные шаги, которые ему нужно предпринять для выполнения задачи. Как и в случае с навигацией, детали интерфейса не должны присутствовать на диаграмме — если вы вдруг обнаружите, что занимаетесь рисованием кнопок и полей ввода, значит, вы уходите в сторону излишней детализации диаграммы. Эта нотация основана на простой концептуальной модели, представляющей информационную архитектуру и способы взаимодействия пользователя с сайтом (системой) вместе:
Простые элементы: страницы, файлы и наборы страниц и файлов Основная структурная единица любого веб-сайта — это, конечно, страница (page). На диаграмме страница изображается простым прямоугольником. Заметим, что страница на диаграмме - это единица представления, а не реализации. Например, одна страница на диаграмме может представлять в действительности несколько HTML файлов (например, страница содержит набор фреймов) или несколько разрозненных фрагментов кода (когда используются включения на стороне сервера (SSI) или базы данных). Кроме страниц, существуют файлы (files) - единицы организационной структуры сайта, не имеющие навигационных свойств. Пользователь работает с файлами вне браузера (аудио и видео файлы, отдельные документы, такие, как PDF, или исполняемые файлы (программы)). Файлы изображаются на диаграмме хорошо известным значком — прямоугольник с загнутым внутрь верхним правым уголком.
Рис. 1а (лево): страница и файл Рис. 1б (право): набор страниц и файлов Набор страниц (pagestack) представляет на диаграмме группу функционально идентичных страниц, навигационные свойства которых несущественны по отношению к макроструктуре сайта. Аналогично, набор фалов (filestack) представляет на диаграмме группу файлов, доступ к которой осуществляется по общей для всех системе навигации и которая может быть классифицирована как одно множество (например, коллекция игр или библиотека PDF документов). Используйте ярлыки (labels) чтобы идентифицировать страницы и файлы. Ярлыки должны быть уникальными для каждой страницы или файла на диаграмме и не должны представлять реальные имена файлов или значения тегов Источник:
http://www.webmasterpro.com.ua/ |
*** | |||||||
|
|||||||
*** | |||||||
|
|||||||
Copyright © "Internet Zone", info@izcity.com. Условия использования материалов |