Читать книгу Создание сайтов - Группа авторов - Страница 14
Дело техники
Глава 2. Создание прототипа: анатомия сайта
Разновидности прототипов
ОглавлениеВ проекте может быть использован прототип как одного, так и нескольких типов.
• Эскиз – набросок (на бумаге ли, в цифровом виде ли), рисуя который проектировщик старается отобразить основополагающие элементы сайта. Делается он за считанные минуты и часы, однако обычно остается внутренним, промежуточным продуктом. Дешево, сердито, пригодно для первых, пристрелочных дискуссий о реализации проекта. Главный недостаток эскизов, особенно бумажных, заключается в том, что их затруднительно использовать на следующих этапах веб-разработки, и прежде всего в тестировании. Да и во взаимодействии «исполнитель – заказчик» от набросков проку мало: с эскизом по-настоящему удобно работать его автору. Иногда рисуют бумажные макеты, с тщательной прорисовкой интерфейса, с модульной сеткой. Впрочем, такой вариант – на любителя.
• Wire-frame – то же, что блок-схема (рис. 3). Она простейшим образом показывает, какие модули содержит сайт и как они увязываются в единую структуру. Формы – прямоугольные, гамма – обычно монохромная, характер – аскетический. В отличие от интерактивного прототипа (см. далее), классическая блок-схема фиксирует самый общий вид страницы в статике. Как следствие, чтобы было ясно, что должно происходить при работе с каким-нибудь нетривиальным динамическим элементом, зачастую требуются чрезвычайно подробные текстовые ремарки.
• Интерактивный прототип – схематическая развертка конечного продукта, досконально имитирующая работу пользователя с сайтом: нажатие на кнопки, выбор пунктов меню, заполнение чекбоксов. Эдакая «идея сайта», по Платону, которая может быть воплощена в дизайне бесконечно разнообразно. Хороший интерактивный прототип имитирует взаимодействие человека и сайта по меньшей мере в базовых аспектах и обеспечивает быструю обратную связь, благодаря чему ощутимо повышается темп разработки. Он дает возможность на скорую руку протестировать решения, выбранные вами и исполнителем, равно как и опробовать пользовательские сценарии на фокус-группе. Для создания интерактивного прототипа навыки кодинга и верстки обычно не требуются: достаточно воспользоваться одной из несложных в изучении тиражных программ или онлайн-инструментов (см. ниже). Наконец, такой прототип проще поддерживать в актуальном состоянии.
Рис. 3. Прототип главной страницы Setup.ru, выполненный с помощью сервиса Axure
• Мокап (от англ. mock-up – «полноразмерный макет») – строго говоря, не вполне прототип. Вернее даже, без пяти минут сайт. Как правило, подразумевает близкий к финальному вид каждой страницы, однако статичен и лишен интерактивности. Посмотреть, но не «пощупать». Большое достоинство мокапа в том, что его чаще воспринимают всерьез многие заказчики – в противовес аскетичным прототипам («Пф, что за казаки-разбойники со стрелочками вместо сайта?»). Если мокап всплывает в проекте, то либо в начале, либо в конце его реализации: в первом случае – когда требуется убедить заказчика в том, что разработчики не оторваны от реальности и видят возможные «инкарнации» сайта задолго до его рождения, во втором – когда нужно подтвердить, что прототип удачно облачен в дизайнерские одежды. Далее мокапы уместны в том случае, если заказчику трудно воспринимать абстрактные концепции в отрыве от их конкретного воплощения (а прототип – это абстракция).