Заказать проект
Оставьте заявку для получения коммерческого предложения.
Заполните форму и мы вышлем Вам предложение в котором решим,
чем можем вам помочь.
Прототипирование? Почему я должен за это платить?

Прототипирование? Почему я должен за это платить?

1 Августа 2018
Евгений Олексюк
UX | UI Designer
Евгений  Олексюк
следующая статья

Очень часто, начиная работу над новым проектом, у дизайнера/менеджера возникают недопонимания с клиентом. Случается это из-за всем известных нюансов. В первую очередь — ошибочное определение бюджета проекта, который не зафиксирован в ТЗ клиента. Еще одна распространенная боль: цена продукта, которая меняется при условии имплементации того или иного функционала. Ну конечно, куда же без вопросов о этапах дизайна, фронтенд- и бэкенд-разработки. И САМОЕ ПОПУЛЯРНОЕ: «Вы меня не понимаете – я хотел немного другого – почему мы сейчас делаем ПРАВКИ?» ;)

Чтобы избежать этих факапов, проджект менеджер обычно предлагает ввести в разработку, этап прототипирования. Конечно, у клиента возникают вопросы вроде: «Прототипирование? А зачем это нужно?», «Почему я должен платить за эти «серые квадратики»?», «Зачем тянуть время – давайте сразу ДЕЛАТЬ!!!»
Если вы не знаете, что отвечать на такие вопросы, предлагаю отличный вариант – скажите клиенту, что вы опытный менеджер, «знаете жизнь» и вообще переживаете за ЕГО деньги и время. А потом подсуньте эту статью….

Итак, что же такое прототип? Прототипом называется план вашего продукта (страницы/приложения/интерфейса и тд), основной акцент в котором ставится на ФУНКЦИОНАЛЕ, а не визуальной составляющей. Прототипирование – это инструмент выявления потребностей клиента в функционале его продукта.


Основное что нужно донести клиенту на этом этапе –  это то, что он имеет не так много общего с дизайном и окончательный продукт может очень сильно отличаться визуально. Вы же не ругаетесь на подрядчика, который вам показывает план вашего будущего дома за то, что тон обоев не подходит к тону мебели?!))))) Но эту метафору пока что оставим)


Итак, прототипы делятся на несколько видов по нескольким критериям:

  • в зависимости от инструмента, в которым будет делаться прототип, он может быть:

скетч (не путать с sketchapp) – мы сейчас о быстром рисунке от руки. Преимущество скетча заключается в скорости. Менеджер тратит 10-15 минут для отрисовки грубого прототипа. Это «отправная точка» переговоров и теперь есть от чего отталкиваться в диалоге с клиентом.


прототипирование в графическом редакторе. Это занимает немного больше времени, требует определенных программ и навыков работы с ними. Но выглядит лучше и презентабельнее. Тут уже вам придут на помощь: sketch, invision, axure, balsamiq, ninja mockup, figma, framer и всякие прочие «фотошопы». Тут уже выбор за вами, к чему больше лежит душа и стоят руки. Прототипы, оформленные в графическом редакторе очень хороши для презентации группе клиентов (когда ЛПР не одно, а представляет собой группу лиц).


  • В зависимости от детализации, прототипы бывают:

не детализированные – представляют собой набор чёрно-белых блоков с текстовками (или даже «Рыбой»). Это хорошее решение для маленьких проектов: заглушек, посадочных страниц и прочее.


детализированные – это прототип, на котором находятся ВСЕ функциональные блоки и элементы, заданы места расположения блоков, могут быть отрисованы табы, дропдауны, попапы и прочее. Это продукт, который показывает ПОЛНЫЙ ФУНКЦИОНАЛ продукта и отлично подходит для разработки ИМ, сервисов, интерфейсов, приложений.



  • По сложности взаимодействия, прототипы бывают:

• статичные – по сути, это обычное изображение, которое доступно в режиме просмотра и комментирования. Хорошее решение для простых продуктов, на которые не нужно тратить много времени и разбираться в функционале;

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


Вывод прост – если вы планируете запустить сложный сервис, согласитесь, детализированный интерактивный прототип может оказаться вам полезным. 

Но вопрос стоимости все еще не закрыт) Давайте разберёмся, так ли это дорого и неоправданно?!

Все мы знаем, что дизайн это решение проблемы. В каждом отдельном случае задача разная, но если утрировать все, получится, что менеджеру нужно решить проблему клиента с помощью своего ИТ-ресурса в самые краткие сроки и за минимальные деньги!

Прототипирование помогает решить такие важные проблемы как:

1. Готовый контент от клиента.
Обычно ЛПР (лицо принимающее решение) – человек занятой. И он не всегда готов потратить свое время на поиск контента или копирайтера. Так как контент необходимая часть будущего продукта, то проще объяснить клиенту, что «Без ТЗ – Результат ХЗ» на ранней стадии проекта. Это убережет проект от дальнейших правок и трат клиента на правки и доработки.

2. Определение потребностей клиента в функционале.

Минимизация затраченного на разработку и правки времени, а значит —  экономия денег клиента.

3. Проектирование блоков, их размещение и акценты.

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

4. Предоставление клиенту быстрых правок.

На этапе проектирования правки делать гораздо проще, так как стиль еще не натянут, а как следствие – времени на правки уходит меньше.

5. Предоставление вариантов для A/B тестирования.

Если при обсуждении спорных решений, возникает необходимость в А/B тестировании, то прототипирование – лучшее решение этой проблемы – на подготовку прототипа уходит мало времени, а его «безликость» не отвлекает от поиска оптимального решения.

В итоге, рассмотрим реальный кейс – один из последних, с которым мы имели дело: к нам обратился клиент с задачей разработать Интернет-магазин его компании. Существующий сайт его не устраивал, так как конверсия была слишком низка. Кроме того, клиент нанял команду маркетологов и аналитиков для продвижения своего бренда, выхода на новый рынок, увеличения целевой аудитории и организации оптовых продаж на основе системы дилерства.

В ходе обсуждения, клиент объяснил, что параллельно проводится работа с маркетологами и он еще не определился окончательно, какие рычаги повышения продаж будут использоваться. При этом работу нужно было начинать, чтобы не сорвать оговоренные дедлайны.

Менеджер предложил начать с прототипирования и поэтапно продвигаться с таким таймингом:

Проектирование – 50 часов;

Дизайн – 80 часов;

Фронт-энд разработка – 100 часов;

Бэк-энд разработка – 140 часов;

ВСЕГО: 370 часов

Во время прототипирования, был обговорен весь функционал, наша команда разработала и подготовила интерактивные прототипы в Invisvion, предоставила права на ознакомление всем сотрудникам, вовлеченным в проект и представителям клиента. Это дало возможность обсудить в реальном времени ВЕСЬ функционал и затраты на его имплементацию.

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

После согласования всего спрайта прототипов (включая дропдауны, попапы и прочее), был разработан UI Kit, который, вместе с лэйаутом главной страницы, отправился фронт-энд разработчикам. Это позволило минимизировать затраты времени так как стили CSS были уже заданы, оставалось написать HTML.
Параллельно была отрисована десктопная и мобильная версии сайта и проведено дизайн-ревью.

Конечно, окончательный тайминг проекта немного изменился, но не критично:

Проектирование – 68 часов;

Дизайн – 63 часа;

Фронт-энд разработка – 96 часов;

Бэк-энд разработка – 152 часа;

ВСЕГО: 379 часов

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

А теперь давайте представим, что этап проектирования был упущен и работа началась сразу с дизайна, тогда тайминг проекта был бы такой:

Дизайн – 100 часов;

Фронт-энд разработка – 100 часов;

Бэк-энд разработка – 140 часов;

ВСЕГО: 340 часов + ПРАВКИ

Разница составляет 39 часов, но давайте на секундочку представим, что клиенту необходимо было внести правки – 2 итерации по 10 часов каждая - тогда к вышеуказанным затратам времени добавится еще:

  • Итерация 1 – Дизайн – 10 часов;

  • Итерация 1 – Фронт-энд разработка – 10 часов;

  • Итерация 1 – Бэк-энд разработка – 10 часов;

  • Итерация 2 – Дизайн – 10 часов;

  • Итерация 2 – Фронт-энд разработка – 10 часов;

  • Итерация 2 – Бэк-энд разработка – 10 часов;

ВСЕГО: 60 часов, что уже превышает реальные затраты времени, да и шансов справиться за 2 правки, когда клиент не знает, что ему нужно, практически нет!

Решайте сами – тратиться ли на проектирование, или «обойтись без черно-белых квадратиков».

Как показывает опыт, прототипирование является очень удобным инструментом работы с клиентом. Оно помогает обозначить границы работы над будущим проектом, экономит время и бюджет (что немаловажно во время разработки, например,  интернет-магазина)уменьшает стресс принятия решения, работа становится намного более гибкой и быстрой, а КПД при командной работе – на порядок выше!

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

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

Need help?

Ask a question.

Chat Now
Записаться На Консультацию
Записаться На Консультацию
Мы свяжемся
с вами
в течении
10 минут
laptop
Мы свяжемся с вами в течении 10 минут