Создание сайтов - страница 10

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

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

Подлинное мастерство в том, чтобы не только продумать гладкие выходы из стандартных, усредненных ситуаций, но и предугадать экстремумы. Задача – сделать «калькулятор заказа» на сайте поставщика пластиковых окон? Разрешите посетителю подсчитать цену на изготовление произвольного количества одинаковых окон, а не выбирать число от единицы до десяти, иначе вы рискуете отсечь потенциального покупателя, курирующего капремонт в целом офисном центре.

Резонно, чтобы перед глазами у проектировщиков всегда была общая картина сайта. Вне зависимости от того, какой инструмент используется для прототипирования, очень удобно начинать с функциональной структуры сайта в mind maps, или ассоциативных картах (см. главу 1 «Техзадание: последний раз себя спрашиваю!» и рис. 2). Полезно, чтобы файл с mind map был на «Рабочем столе» (или, например, в онлайн-сервисе типа Mindmeister.com) у вас и всех, кто занят в проекте. Как-никак дельно составленная ассоциативная карта отражает всю структуру и функциональность сайта.

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