#16. Использование прототипов в дизайне сайта
Что такое прототип. Какие они бывают. Как рисовать прототипы и делать это хорошо. Роль прототипа в общении с заказчиком
Что такое прототип
Для начала определимся с терминологией. В английском языке есть слова wireframe и prototype. В русском языке — сетка, прототип и живой прототип. Из-за трудностей с переводом, все время возникает путаница. Wireframe переводится как сетка. Но то, что мы называем сеткой — это grid. А то, что по-английски называется wireframe, мы называем прототипом. То, что у них prototype, мы называем «живой прототип» (который можно покликать).

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

Хорошо составленный прототип является полноценным каркасом сайта, на который потом легко «надевается» дизайн.
Почему дизайнеры стали использовать прототипы
В разработке сайта прототипирование — это этап, который следует за исследованием, перед созданием дизайна.

В студии FunkyPunky мы начали использовать прототипы, потому что поняли, что все комментарии заказчика касаются не того, что ему не нравится цвет или размер элементов. Как правило, правки связаны с тем, что забыли про какую-то сущность: телефон, фильтр по каталогу, блок с новостями и т.п. В основном, большинство комментариев касались функциональности. Поэтому, чтобы не тратить время на перерисовку, мы ввели промежуточный этап — прототипирование.
Мы стали переводить то, что услышали от заказчика, в блок-схему.
Прототип — схематичное изображение страницы, которое показывает какие есть блоки и сущности. Глядя на прототип, заказчик должен понять: ничего ли не забыли. Он видит: какое будет меню, какие в нем будут такие пункты, каким будет главный экран, где будут расположены контакты.

Это позволило убрать из договора количество итераций. Обычно в договоре указывается: «не более трех правок» — чтобы не перерисовывать все бесконечно. А прототип позволяет вносить правки очень быстро, потому что это схематичное изображение, поэтому не страшно что-то изменить.

Чтобы читать дальше, оплатите годовую подписку на Тильду и получите курс в подарок!

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

Получить курс Подробнее

Также в этом курсе

15
Психофизиология интерфейсов
Как управлять вниманием пользователя, используя базовые знания психофизиологии.
Предыдущая
17
Цифровой сторителлинг
О новом способе рассказывать истории в интернете.
Следующая
Оглавление