Читать книгу Прототипирование. Практическое руководство - Тодд Варфел - Страница 17
Глава 2
Процесс прототипирования
На что похож процесс прототипирования
ОглавлениеНе существует общего процесса сверхпрототипирования, единого рецепта, как у кока-колы. Однако есть ряд опробованных на практике принципов, которым можно следовать независимо от того, над чем вы работаете.
Не важно, какой процесс прототипирования вы решите использовать. Процесс – это способ закончить работу. Одним из наиболее распространенных подводных камней оказывается чрезмерная вовлеченность. Если вы нацелены на выполнение процесса, а не на достижение конечной цели, вам не удастся добиться успеха.
К тому же в хорошем процессе соблюден баланс между структурой и гибкостью. Он обеспечивает твердую основу, в то же время давая возможность гибко вносить корректировки и адаптироваться к изменениям графика или обстоятельств.
Наконец, хороший процесс ведет к успеху. Если выбранный процесс ограничивает возможности достижения успеха, его необходимо пересмотреть.
Марк Сандерс, изобретатель складного велосипеда Strida, описывает на YouTube процесс, который он использовал при создании своего «детища»[7]. Когда я смотрел это описание, я отметил следующее:
• Сандерс не думал о том, какие идеи хорошие, а какие плохие. Он создавал эскизы, чтобы исследовать все возможные идеи.
• Когда эскизов накапливалось много, он оценивал их, исходя из первоначальных целей создания продукта. Так отбирались лучшие идеи.
• Эскизы использовались только до этого этапа. Чтобы убедиться в работоспособности идей, ему приходилось создавать модели или прототипы.
• Эскизы сыграли решающую роль в усовершенствовании проекта и разработке модели Strida2.
В своем видео Марк описывает достаточно типичный процесс прототипирования, включающий следующие элементы:
• создание эскизов;
• оценку;
• создание модели;
• испытание.
В моей компании Messagefirst используется подход, подобный описанному Марком, но с небольшими отличиями. Мы берем страницу из книги дизайнерской студии и применяем модель с демонстрацией проекта и его критической оценкой. Так что наш видоизмененный процесс выглядит так:
• создание эскизов (набросков на демонстрационных досках или бумаге, программного кода);
• демонстрация и критическая оценка;
• моделирование (прототипирование);
• тестирование.
Одна из наших целей – быстрый цикл последовательных итераций и развития. Поэтому мы устанавливаем довольно короткую продолжительность первых двух стадий – создания эскизов; демонстрации и критической оценки. Это обеспечивает развитие процесса, повышает нашу производительность и эффективность прототипирования.
Наш процесс прототипирования также итеративен и эволюционен. Мы делаем набросок, показываем и критически оцениваем его, создаем прототип, показываем и критически оцениваем его, снова создаем прототип, а затем проводим тесты (рис. 2.1). Затем мы повторяем эту цепочку действий снова.
РИС. 2.1. Диаграмма итеративного процесса разработки и критических оценок
Вероятно, вы обратили внимание на циклический характер и неоднократное повторение двух шагов: создания наброска; демонстрации и критики. Наброски создаются и обсуждаются на протяжении всего процесса прототипирования. Фактически, когда мы показываем и оцениваем наши прототипы (как в компании, так и с привлечением клиента), мы делаем набросок наших исправлений.
Теперь давайте подробно рассмотрим наш процесс прототипирования, начиная с создания наброска.
Часть 1: создание наброска
Создание наброска – производительная часть прототипирования, и ваша цель на этой стадии – «вытащить» идеи из головы и материализовать их.
Я предпочитаю устанавливать рамки для «времени делать наброски». Это заставляет сотрудников работать быстро и не вдаваться в детали.
Цель создания набросков – не конкретизация идей (этим мы занимаемся на стадии разработки прототипа), а определение концепций, «вытаскивание» их из головы максимально быстро и переход к следующей стадии.
Совет
Количество важнее качества
При создании наброска не старайтесь разделить идеи на хорошие и плохие. В данный момент ваша цель – изучить идеи. На стадии создания набросков количество важнее качества. Качество придет позже.
Наброски обычно делаются начерно, иногда они неполны и откровенно схематичны, как видно из рис. 2.2. Не старайтесь сделать все без изъяна. Попытайтесь материализовать ваши идеи.
РИС. 2.2. Набросок модуля настроек для видео на Vimeo, демонстрирующий толщину линий и пометки[8]
Совет
Быстрый и яростный
Установите ограничения времени на создание набросков.
Я предпочитаю отводить на это 10–30 минут, а затем переходить к показу и критической оценке. Такой короткий период заставляет фокусироваться на продуктивных идеях, не вдаваясь в подробности.
Большинство наших набросков делается на бумаге с использованием специальных планшетов. Планшет – просто лист бумаги с набором небольших окошек-шаблонов. Он подобен планшету для раскадровки.
Вот как выглядит один из наших планшетов для набросков (рис. 2.3).[9]
РИС. 2.3. Пример планшета с несколькими набросками
Главная разница между планшетом для раскадровки и планшетом для набросков в том, что первый используется для последовательного изложения некой истории, а второй, наоборот, содержит набор идей, а их последовательность не имеет значения.
Совет
Хорошая идея не приходит одна
Использование планшета для набросков – отличный способ выдать несколько идей. Небольшое пространство стимулирует обдумывание отдельных элементов интерфейса. Такой планшет также подойдет для небольшой раскадровки, если необходимо описать проект AJAX или RIA.
Большинство наших набросков делается на бумаге, но иногда мы выполняем их на демонстрационных досках или в программном коде. Выбирайте среду, которая вам удобна, – лишь бы был результат.
Рассмотрим преимущества и недостатки набросков на бумаге, лекционных досках и в программном коде.
Наброски в коде
Наброски можно делать не только на бумаге или лекционных досках. Разработчики часто делают их в привычной им среде – программном коде (это тоже возможно).
Одно из преимуществ набросков в коде – возможность их превращения в прототип. В условиях роста числа JavaScript-библиотек, CSS-фреймворков и шаблонизаторов вроде Ruby on Rails создавать наброски в коде становится все легче.
Преимущества
• Делать наброски в коде все легче, поскольку инструментов для этого становится больше.
• Наброски «оживают» – их можно опробовать на практике.
• Это дает возможность эффективно использовать написанный код.
Недостатки
• Не каждый умеет писать код.
• Для этого необходим компьютер.
• Возможностей для совместной работы меньше, чем при использовании бумаги или лекционной доски.
• Это занимает больше времени, чем создание набросков на бумаге или лекционной доске.
Создание набросков на лекционной доске
Одно из главных преимуществ создания набросков на лекционной доске – возможность совместной работы. Кто угодно может принять участие в обсуждении и предложить собственный вариант.
Преимущества
• Обеспечивает возможность совместной работы.
• На лекционной доске может рисовать каждый.
• Одновременно могут участвовать несколько человек.
• Не нужен компьютер.
• Внести изменения очень просто: достаточно стереть рисунок и изобразить что-то новое.
Недостатки
• Перенести лекционную доску сложнее, чем код или лист бумаги.
• Наброски статичны.
• Перенести наброски с доски на рабочие материалы иногда сложно[10].
Создание набросков на бумаге
Создание набросков на бумаге остается моим излюбленным методом. Это обеспечивает примерно такие же возможности для совместной работы, как и лекционные доски. Однако листы бумаги очень легко перемещать и работать на них можно где угодно.
Преимущества
• Обеспечивает возможность совместной работы.
• На бумаге может рисовать каждый.
• Может участвовать несколько человек одновременно.
• Не нужен компьютер.
• Внести изменения просто – достаточно добавить в рисунок нужные элементы или взять другой лист бумаги.
• Этим можно заниматься когда угодно и где угодно.
• Наброски легко перемещать.
Недостатки
• Наброски статичны.
Часть 2: демонстрация и критика
Демонстрация и критика – вероятно, наиболее важная часть процесса прототипирования. На этой стадии мы сосредоточиваемся на качестве.
Метод демонстрации и критики я освоил в студенческие годы, когда изучал графическое проектирование. И хотя потом я выбрал специальность «английский язык и когнитивная психология», я никогда не забывал ценные уроки демонстрации и критики.
Цель на этой стадии – найти лучшие идеи. Вы показываете сильные стороны своей концепции, а ваши коллеги обращают внимание на области, которые требуют большей ясности или доработки. В этом и заключается суть стадии: обсудить, оценить и двигаться дальше.
Представляя наброски на обсуждение, мы часто крепим их к стене, как показано на рис. 2.4.
РИС. 2.4. Показ набросков в ходе их критического разбора в дизайнерской студии
Рекомендации по демонстрации и критике
Будьте кратки. Как я упоминал ранее, демонстрация и критика – вторая стадия, для которой мы устанавливаем жесткие рамки. Фактически на нее выделяется еще меньше времени, чем на набросок. Я стараюсь ограничивать время демонстрации двумя минутами, а обсуждение – тремя.
Не тратьте слишком много времени. Я знаю, что это звучит отчасти парадоксально. Но цель здесь – быстро получить результат и двигаться дальше. Вы сможете детализировать свои идеи позже.
Три минуты на демонстрацию идеи. Лимит времени в три минуты на демонстрацию идеи означает, что вы должны будете сосредоточиться на сильных сторонах. А если вы не можете объяснить суть идеи за это время, вероятно, что-то с вашей идеей не так.
Две минуты на критику. Ваши коллеги получают две минуты на критику вашей идеи. В это время они должны показать две-три сильные и одну-две слабые ее стороны.
Делайте заметки. Пишите прямо на набросках прототипа. Используйте критические замечания ваших коллег, чтобы уточнить и усилить вашу концепцию.
Часть 3: прототип
К началу этой стадии процесса вы набросали свои идеи, показали и обсудили их, отобрали только самые сильные варианты. Их прототипы вы и будете создавать.
Именно на стадии прототипирования вы начинаете детализировать свои проекты и выяснять, какие из них действительно жизнеспособны.
Когда я создаю прототип, то рассматриваю следующие вопросы:
• использую ли я инструменты или среду, с которыми мне удобно работать;
• есть ли у меня возможность эффективно передать аудитории этого продукта или его потребителям то, что я считаю нужным;
• каким временем я располагаю;
• какая степень точности необходима.
На деле способ прототипирования не важен. Большинство моих прототипов созданы с помощью HTML и AJAX, но это объясняется характером моей работы и потребностями клиентов. Я делал прототипы с помощью Flash, Keynote и на бумаге.
Когда прототип готов, я повторяю показ и критическое обсуждение. Я использую ту же базовую модель, показывая каждый раз только часть прототипа и предлагая клиенту или пользователю оценить ее. Основная разница в том, что я отвожу больше времени на показ и критику. В остальном процесс не меняется.
Совет
Проект и набросок
Проектируйте свой прототип на лекционной доске в ходе показа и обсуждения наброска. Тогда вы сможете по ходу дела вносить изменения в прототип.
Часть 4: тестирование
Я делю тестирование на две категории: тестирование с клиентами и тестирование с конечными пользователями.
Тестирование с клиентами
Тестирование с клиентами сочетает в себе показ, критическое обсуждение и создание набросков. Встречи длятся обычно 1,5–3 часа в зависимости от сложности прототипа.
В ходе встреч я, как обычно, показываю по одному элементу прототипа и обсуждаю его. Вместо списка я использую планшет, чтобы сделать замечания к наброскам. Замечания в большинстве своем представляют собой небольшие метки или краткие комментарии от руки.
Фиксация изменений на набросках гарантирует, что мы не будем использовать для этого таблицу. Текстовые замечания легко понять неправильно. Наброски помогают снизить этот риск. Их создание допускает сотрудничество, и клиент может внести свой вклад.
Обычно я следую отработанной схеме при определении необходимых изменений в ходе процесса: больше набросков, меньше записей.
Когда этап рассмотрения проекта закончен, клиент получает доступ к прототипу. Я прошу потребителя опробовать прототип в течение следующих двух или трех дней.
Одна из целей создания прототипа – дать целевой аудитории возможность испытать его. Я хочу, чтобы клиент получил опыт работы с прототипом, использовал его. В ходе использования он либо обнаружит новые спорные моменты, либо поймет, что аспекты, казавшиеся ему спорными, на деле к таким не относятся.
Тестирование с конечными пользователями
Тестирование с конечными пользователями – стандартный тест на удобство использования: 8–12 участников, 5–6 сценариев, аудио– и видеозапись, анализ, а после тестирования – сообщение о результатах. В главе 12 подробнее рассказано о тестировании прототипов.
При любом тестировании я учитываю полученную в его ходе информацию в следующей версии прототипа.
10
Эскизы можно зафиксировать с помощью фотоаппарата или интерактивных досок Smartboard.
