Прототипирование сайтов — инструмент для разработчиков и клиентов

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

 

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

 

Как сделать прототип сайта: традиционные формы и новые решения

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

 

Прототип конструируют по заданным условиям, иначе говоря, по техническому заданию. Там четко прописаны пожелания по структуре, логика, техника, администрирование, которые, в свою очередь, являются результатом тщательного анализа.

 

Можно ли сделать сайт вслепую или «на свой вкус»? Да, но финальный вариант, скорее всего, не будет соответствовать ожиданиям. К разработчику надо приходить с идеей, набросками или хотя бы небольшим пониманием того, что хочется видеть.   

 

В черновике отображают:

1. Структуру: блоки, элементы, кнопки. 
2. Основные формы, с которыми взаимодействует посетитель.
3. Некоторые элементы дизайна.

 

Детализация на данном этапе не важна. Условно говоря, прототип или структурная схема сайта — это каркас, на который будут наживлять остальные элементы. Создать и продемонстрировать его получится несколькими способами.

 

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

 

• на доске: масштабный способ, можно стирать и дорисовывать. Но сложно охватить большой объем, нельзя качественно представить клиенту.

 

• в специальных программах: самый эффективный способ. Сейчас активно используют Axure Pro, Microsoft Visio, Adobe InDesign и Adobe Photoshop. В некоторых программах есть возможность протестировать юзабилити, добавить базовый дизайн. Пока самая многофункциональная — Axure Pro. Там прописывают и переходы, и кнопки, и ссылки, есть поддержка многостраничных макетов.
• в онлайн-сервисах: тоже достойный способ, но многие из них не поддерживают русский язык.

 

Понятно, что последние два самые современные и удобные. Разработчик с легкостью может дать доступ клиенту, который внесет правки. Для этого не нужна личная встреча. К тому же, программы предполагают интерактивность. Т.е. прототип бывает динамичным, что позволяет максимально оценить интерфейс и структуру.

 

Хороший прототип — какой он?

Даже черновую версию делают по-разному. В iProWeb требования даже к простым прототипам высокие. Он, прежде всего, понятен и доступен клиенту, отображает все важные функции и элементы структуры. А также:

 

• Мы создаем прототип быстро, но не в ущерб качеству. Индивидуальный подход не позволяет делать под копирку.
• Делаем гибкий для изменений черновик и изменяем до тех пор, пока все не согласовано.
• Любим интерактивные модели: лучше один раз попробовать, чем сто раз увидеть.
• Акцентируем на доступности: