Почему прототип важнее дизайн-макета
3 мин · Выбор подрядчика
Обычный порядок работы над сайтом выглядит так: студия рисует макеты, заказчик их согласовывает, потом идёт вёрстка и разработка. К концу выясняется, что на телефоне блок разъезжается, что длинное название товара ломает карточку, а кнопка, которая на картинке выглядела заметной, вживую теряется.
Проблема в том, что макет нельзя проверить. Его можно только одобрить.
Что именно не видно на картинке
Дизайн-макет — это статичный экран в идеальных условиях. В нём всё помещается, потому что текст подобран под макет, а не наоборот.
Вживую вылезает то, чего на картинке не бывает:
- Реальная длина текстов. «Разработка мобильных приложений» и «ERP» в одну сетку не ложатся, а в макете обычно нарисован средний вариант
- Пустые состояния. Что видит человек, когда в каталоге по фильтру ничего нет
- Поведение на телефоне. Не «мобильная версия макета», а то, как это листается пальцем
- Скорость. Тяжёлая обложка на макете весит ноль, а в жизни — четыре секунды загрузки
- Ошибки. Как выглядит форма, когда телефон введён не в том формате
Всё это всплывает на этапе разработки, когда переделывать дороже всего.
Что даёт прототип
Прототип — это работающий сайт с демонстрационным содержимым, но без бэкенда. По нему можно ходить, нажимать, открывать на телефоне.
Он отвечает на вопросы, на которые макет ответить не может:
Понятно ли, куда нажимать. Человек, впервые открывший страницу, находит нужное или теряется — это видно за минуту наблюдения и никак не видно по картинке.
Помещается ли содержимое. Не «поместится ли», а помещается ли прямо сейчас, с вашими настоящими названиями.
Как это ощущается. Сайт либо отзывчивый, либо вязкий, и на статичном экране разница не передаётся вообще.
Почему это ещё и дешевле
Кажется, что сделать работающую страницу дороже, чем нарисовать картинку. На практике наоборот, и по двум причинам.
Первая: правки на этапе прототипа стоят почти ничего. Переставить блок — минуты. Тот же блок после того, как под него написан бэкенд, — это уже переделка.
Вторая: прототип не выбрасывается. Это фронтенд будущего сайта, к нему добавляется серверная часть. В классической схеме макет после согласования уходит в архив, а вёрстка делается заново по картинке — то есть работа выполняется дважды.
Как это меняет разговор о деньгах
Самое неприятное в заказе разработки — платить за то, чего ещё не видел. Отсюда все стандартные страхи: «а вдруг сделают не то», «мы уже пробовали, результата не было».
Обычный ответ рынка на этот страх — обещать убедительнее. Гарантии, договоры, портфолио. Работает слабо, потому что обещать умеют все.
Прототип отвечает иначе: вы смотрите на результат до того, как платите за основную работу. Бояться становится нечего — не потому что мы убедили, а потому что вы уже видели.
Как это устроено у нас
Собираем прототип за несколько дней и отдаём ссылку. Открываете на телефоне, щёлкаете, показываете коллегам. Дальше правим по замечаниям, и только потом идёт разработка.
Часть таких прототипов лежит в кейсах — те, что помечены бейджем «живое демо», открываются прямо в браузере, это не скриншоты.
Подробнее про сам подход — на странице прототип за несколько дней. Если задача уже понятна и нужен конкретный тип сайта — интернет-магазин, лендинг или корпоративный сайт.
А если хочется понять порядок цен до разговора, есть разбор стоимости.