Прототип сайта: виды, плюсы и минусы

ЗАЧЕМ НУЖЕН ПРОТОТИП САЙТА

Виды прототипов, кому выгодно работать по прототипу, на что обратить внимание

Сергей Кондауров facebook.com/SergeyDesigner

Активный участник SPECIA

http://facebook.com/SergeyDesigner

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

ПЛЮСЫ

Неправильный подход к созданию прототипа рождает трататип — бессмысленно выброшенные деньги и время

МИНУСЫ

Любой прототип отправится в ведро

Запомните,

ЭТО АНАЛИТИКАЧтобы каждый элемент имел свое место,

не был забыт

Прототип

Понять важность каждого объекта на странице

1

Понять важность каждого объекта на странице1

В обсуждении

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


По описанию Упростили


При составлении ТЗ,

В ситуации, когда сначала рождается ТЗ, проектировщиком становится менеджер проекта.


Проектировщиком должен быть проектировщик или дизайнер.

В составлении ТЗ


Менеджер описывает в ТЗ то, что придумал проектировщик.

В составлении ТЗ

Для обсуждения идей с заказчиком

2

Для обсуждения идей с заказчиком2

Макеты обсуждать проще, чем абстрактные описания


ТЗ Прототип


Клиенту понятнее что влечет добавление каждой функции

Например, добавление функции «Купить» — это не просто одна кнопка «Купить» на сайте.


Дешевле правки

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

Проведение тестирования

3

Проведение тестирования3

Прототипа достаточно для первых исследований

Понять необходимость наличия элементов3

Проведение тестирования3

Дешевле внедрение результатов тестирования

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

ЭТО ВАША ЗАЩИТАот срыва сроков и нерентабельности

Прототип

Дизайнерам легче определиться с оценкой

1

Технологам легче определиться с оценкой

2

Программистам легче определиться с оценкой

3

Менеджеры получают защиту рентабельности

4

Два договора: первый на прототип, второй на разработку сайта

Меньше правок5Клиент начинает управлять дизайнером, когда не ясна ценность проделанной работы

ЭТО УПРОЩЕНИЕ РАБОТЫдизайнеру, технологу, программисту, заказчику

Прототип

Визуализация ТЗ для дизайнера

1

Визуализация ТЗ для дизайнера1

Мозг дизайнера легче считывает образы, а не буквы


Можно посмотреть все страницы будущего сайта и прикинуть стиль


Это шпаргалка — отрисовка макета прямо поверх прототипа

Визуализация ТЗ для технолога

2


Возможность спрогнозировать, где будут сложные места и договориться с дизайнером, чтобы избежать их

Визуализация ТЗ для программиста

3


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

Для обсуждения идей с заказчиком

4


Визуализация ТЗ или его существенная часть

Клиент часто читает ТЗ поверхностно, некоторые моменты для него становятся открытием (ожидаемый результат)


Визуализация ТЗ или его существенная часть

Большее понимание текущего этапа работ и демонстрируемого макета (понимает задачи каждого блока, обсуждает работу инструментов, а не цвета)

КАКИЕ БЫВАЮТ ПРОТОТИПЫ

Степени детализации и назначение

Идеальный прототип имеет минимальную детализациюдостаточную для решения поставленных задач

Набросок1

Набросок1

Для обсуждения идей внутри команды

Чаще всего используется для обсуждения идей внутри команды.

Набросок1

Для обсуждения идей внутри команды

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

Набросок1

Набросок1

Для обсуждения идей с клиентом

Чтобы визуализировать абстрактные пожелания клиента и вести разговор на конкретных примерах.

Набросок1

Для обсуждения идей с клиентом

Для обсуждения с клиентом делается в программе, которая ближе к сердцу — Photoshop, Illustrator, InDesign, Axure и т. д…

Набросок1

Средний уровень детализации

2

для тестирования и составления детального ТЗ

Средний уровень детализации2

Это наилучшее соотношение цены и качества

Есть минимальный уровень интерактивности, прорисованы самые важные страницы


Экономия времени на ТЗ

Экономия времени на написании подробного ТЗ, которое все равно мало кто умеет читать

Понять необходимость наличия элементов2

ТЗ Прототип


Возможность проведения тестирований

Это тот минимальный уровень детализации, на котором можно проводить тестирования

«Почти готовый» продукт3Для сложных заказчиков и исключительных ситуаций

«Почти готовый» продукт3

Прекрасное представление каким будет финальный сайт

Когда клиент может воспринимать только примеры


Когда надо продемонстрировать работу сложного механизма

Когда описание вариантов занимает несколько страниц А4


Это дорогой подход

На его создание уходит много времени, но прототип все равно отправляется в корзину

ЧТО ПЕРВЕЕ : ПРОТОТИП ИЛИ ДИЗАЙН -КОНЦЕПЦИЯ

Прототип если создатель прототипа — дизайнер сайта

Прототип если поджимают сроки, а информацию по проекту

должен добыть проектировщик

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

Дизайн если проектировщик и дизайнер — разные люди

Дизайн если есть время на согласование дизайн-концепции

и контроль прототипа дизайнером

Дизайн если видения данного проектировщика и арт-директора сильно отличаются

ВЫВОДЫ

Прототип — важный этап в аналитике


Обсудить идеи с заказчиком2

Провести юзабилити–тестирование3

Прототип — ваша защитаДизайнерам, технологам и программистам легче определиться со сроками

1

Менеджерам — защита от срыва сроков2

Меньше правок3

Прототип упрощает работуДизайнерам, технологам и программистам1

Легче обсуждать идеи с клиентом2

Прототип бывает трех уровней детализации

Набросок для обсуждения идей1


Максимальный уровень детализации для исключительных ситуаций

3

Что первее: прототип или дизайн

Прототип — если сроки сжатые, за дизайн отвечает тот же специалист или дизайн будет разработан в другой компании

1

Дизайн — если позволяют сроки, за дизайн и проектирование отвеют разные люди или видение дизайна арт-директором отличается

2

СЕРГЕЙ КОНДАУРОВfacebook.com/SergeyDesigner

Активный участник SPECIA

https://www.facebook.com/SergeyDesigner