Прототипирование. Практическое руководство.

Принцип № 6: если не можете что-то сделать, притворитесь, что можете.

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

• сколько участников умеют уверенно писать код (HTML или любой другой);

• сколько участников создавали прототипы ранее любым способом и в любой форме (в PowerPoint, HTML, Dreamweaver, PDF и пр.).

Как правило, оказывается, что чем больше проектировщиков в зале, тем меньше участников могут писать код и занимались прототипированием или чувствуют себя уверенно в этом деле. Обычно это порождает миф, что если вы не умеете программировать, то не можете и создавать прототипы. И этот миф стал еще более популярен с появлением RIA («Если вы не умеете писать программы на JavaScript, вы не можете и прототипировать»).

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

Барух Закс, Директор Компаний Human Factors Design И Pegasystems.

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

• Можно сформировать серию экранов в формате JPEG. Используйте Dreamweaver для создания изображений и связывания их друг с другом. Вы не напишете ни строчки кода, но сможете получить отзывы об интерфейсе и понять, если ли в идее смысл.

• Применяйте встроенные функции Fireworks для связывания страниц и фреймов и создайте HTML-прототип, с которым можно работать с помощью мыши.

• Используйте Adobe Acrobat или другой редактор PDF и свяжите экраны между собой, чтобы добиться такого же результата, как и в предыдущем случае.

• В PowerPoint вы сможете связать последовательность статичных экранов.

• Применяйте последовательность HTML-экранов, чтобы симулировать AJAX и другие варианты многофункциональности.

В докладе о процессе DC Refresh я обсуждал прототип, который мы недавно создали для клиента. Я поведал о некоторых многофункциональных взаимодействиях, внедренных в прототип с помощью популярной JavaScript-библиотеки Prototype.

Я сказал слушателям, что покажу несколько основных взаимодействий типа «скрыть-показать», встроенных в прототип, и добавил, что одни из них реальны, а другие только изображены. Затем я продемонстрировал им функцию «скрыть-показать» для расширенного поиска (рис. 4.3 и 4.4).

Прототипирование. Практическое руководство

РИС. 4.3. Простой поиск (скрыть)

Прототипирование. Практическое руководство

РИС. 4.4. Расширенный поиск (показать)

Я несколько раз переходил из одного состояния в другое и обратно, показывая возможности расширенного поиска и скрывая их. Затем я обратил внимание слушателей на то, что используются два разных адреса. Эта симуляция была вовсе не AJAX, а двумя связанными экранами. Работа AJAX только имитировалось.

Однако это не имело значения. Аудитория восприняла концепцию.

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