MS Visio, как инструмент проектировщика: ненаглядная наглядность.
Материал приглашает подискутировать о программных продуктах, удобных для проектирования интерфейсов и бизнес-процессов и направлен на поиск решения, способного удовлетворить оба направления.
Внедрение и дальнейшее развитие любой ECM-системы практически всегда сопровождается проектированием и разработкой новых объектов системы: карточек электронных документов, справочников, типовых маршрутов, мастеров действий и т.п. Оставим в стороне вопросы разработки – здесь я уступаю пальму первенства многочисленным специалистам, присутствующем на нашем ресурсе – сегодня я хочу поговорить о проектировании.
Основной задачей для проектировщика является выдача разработчику требований к итоговому продукту, сформулированных на основании сбора и анализа некоторой информации. Не секрет, что процесс упорядочивания этой информации и адаптации её к функционалу системы а, зачастую, и к доводам здравого смысла, является достаточно сложной задачей, однако представим, что все препятствия успешно преодолены, трактат о новом объекте системы написан и предназначен к отправке в разработку. Именно на этом финальном этапе передачи разработчику результата трудов проектировщика я и хочу остановиться подробнее.
«Что толку в книжке, если в ней нет ни картинок, ни разговоров?», – сетовала небезызвестная Алиса и была как никогда права. Как обычно выглядит документ, выдаваемый разработчику? Сухие строчки текста с перечнем реквизитов карточки и источников данных? Описание последовательности блоков типового маршрута, параметров и исполнителей? Скучно и малоэффективно, потому что не наглядно. Приходилось ли вам перерисовывать за разработчиком карточки справочников? Мне когда-то приходилось и, полагаю, это не самая эффективная организация труда.
В этой теме я приглашаю всех желающих подискутировать об используемых Вами инструментах визуализации, как универсальных, так и узконаправленных. Я для себя остановилась на продукте MS Visio и вот почему:
- MS Visio входит в состав расширенного пакета MS Office и всё чаще встречается на рабочих местах офисных работников, а значит у меня не будет проблем с внутренним и внешним взаимодействием. Также это избавляет от дополнительных расходов на закупку другого ПО и обучение его использованию.
- Интерфейс MS Visio привычен любому уверенному пользователю MS Office, в элементарном функционале продукта можно интуитивно разобраться за достаточно короткий промежуток времени.
- MS Visio обладает всем необходимым функционалом, как для построения схем бизнес-процессов, так и для прототипирования интерфейсов (подробнее об этом чуть ниже).
- MS Visio позволяет быстро дублировать отрисованный контент целиком, либо частично, обеспечивает лёгкость внесения изменений, в том числе внешним заказчиком (помним о п.1), позволяет комментировать отдельные элементы контента.
- Средствами MS Visio можно добиться различных уровней визуализации: от чернового наброска до конечного продукта, используемого в проектной документации.
- MS Visio предоставляет множество форматов выгрузки контента, а также обеспечивает возможность вставки его в качестве редактируемого объекта непосредственно в проектную документацию.
- Шаблоны, стенсилы, макросы (в том числе собственные) – всё это позволяет ускорить процесс работы и сократить, либо автоматизировать рутинные операции.
MS Visio и бизнес-процессы.
MS Visio Premium 2010 позволяет создавать схемы бизнес-процессов в нотации BPMN версии 1.2 и автоматически анализировать их, чтобы убедиться в правильной структуре и соответствии заданной для документа бизнес-логике. Дополнительно к штатному функционалу существует техническое решение по интеграции DIRECTUM и MS Visio, которое позволяет выгружать спроектированные схемы BPMN из Visio в типовые маршруты DIRECTUM, что практически полностью исключает необходимость повторной отрисовки схемы типового маршрута разработчиком.
Демонстрацию решения можно увидеть на канале DIRECTUM на YouTube.
Также реализована возможность сохранения схем BPMN в файле формата XPDL. Дополнительно хочу отметить, что схемы бизнес-процессов можно успешно рисовать и в более распространённых версиях MS Visio – Standard и Professional: теряется только набор спецблоков и возможность выгрузки в типовые маршруты.
MS Visio и интерфейсы.
С использованием штатных стенсилов MS Visio за достаточно короткий промежуток времени можно воспроизвести практически любой интерфейс. А разработав собственный набор стенсилов – абсолютно любой. Отдельно хочется отметить наличие стенсилов с заданной логикой поведения – например кнопки, внешний вид которых изменяется в зависимости от установленного состояния «Включена», «Отключена», «Выделена курсором», «Выбрана» и т.д. При создании собственных стенсилов им так же можно задать логику поведения. Вдобавок множество стенсилов можно найти в свободном доступе в сети Interntet. Впрочем, лучше один раз увидеть, чем сто раз услышать, поэтому я хочу продемонстрировать скриншот карточки справочника «Номенклатура дел» системы электронного документооборота DIRECTUM:
и отрисовку этой карточки средствами MS Visio:
Как говорится - найдите 10 отличий.
Что это даёт? Во-первых, экономию времени проектировщика и разработчика при разработке различных карточек: сопроводите перечень реквизитов хотя бы примитивной картинкой – и разработчик будет Вам благодарен. Во-вторых, прототипы интерфейсов будущих объектов можно использовать в проектной документации и при взаимодействии с заказчиком – Вы намного легче найдёте общий язык и подстрахуетесь от дальнейших разочарованных возгласов: «А мы думали это будет выглядеть совсем по другому…»
А какие программные продукты для визуализации используете Вы?
Похожие статьи
Комментарии 28
А чем мотивируют, Андрей?
Впрочем в Visio примитив можно накидать ещё быстрее и проще.
В основном тем, чтобы ни у кого (ни у проектировщика, ни у заказчика) не складывалось иллюзии, что это почти готовый продукт. Все должны четко представлять себе, что это всего лишь прототип интерфейса.
Полагаю, что с этой точки зрения интерактивные прототипы интерфейсов вообще обречены на провал.
Отнюдь. Если интерактивность сводится к переходу двумя состояниями (условно говоря, у вас есть изображение "со свернутым tree view" и "та же страница, но с развернутым", а переход между ними "по щелчку на кнопке Expand") то смотрится довольно удачно.
И да, я полностью подтверждаю то, что сказал Андрей. Скетч-наброски напоминают прикидки от руки, которые вы рисуете карандашом на бумаге. Потому на них заказчик смотрит только с точки зрения расположения элементов, но не их внешнего вида.
Ну и специализированные инструменты для таких скетчей все же удобнее инструментов общего назначения, таких как Visio. Например, на моем текущем проекте аналитики пользуются вот таким инструментом http://www.balsamiq.com/ - результат понятен как пользователем (заказчикам), так и нам разработчикам. А рисовать куда как удобнее чем в Visio (и дешевле чем Visio).
Михаил, удобство - штука вообще очень субъективная, правда?
Я достаточно поверхностно знакома с Balsamiq, но, если не ошибаюсь, данный продукт удовлетворяет не всем пунктам, из перечисленных мной в материале. Сориентируйте меня поподробнее, пожалуйста.
Конечно. Но никто не мешает попробовать и составить собственное мнение.
А можно еще раз воспроизвести какие пункты относятся к проектированию UI?
А существует ли возможность: а) сделать реинжиниринг (т.е. перенести разработанный или доработанный маршрут обратно в BPMN схему) б) "слить" изменения, т.е. внести изменения в схему BPMN и сгенерировать только измененные части в виде маршрута?
Значит, возможно, не сейчас. :)
У меня же с Visio по части рисования прототипов никак не складывается. Может быть потому, что мне последнее время приходится работать с интерфейсами, которые не используют стандартные элементы управления. А потому нужен именно нейтральный вид (который бы не указывал явно на тип приложения, а только задавал бы функциональность форм).
У вас же, как я понимаю, такой проблемы нет - вам нужен небольшой набор стандартных контролов и все. Вам подойдет почти любой инструмент.
Жаль. Было бы интересно как перечисленные задачи были решены (если были - сомневаюсь потому, что ни у одного вендора такого решения не видел. Все стараются в подобных случаях использовать единую нотацию, как для моделирования, так и для реализации).
Потому как если поддерживается только однонаправленная выгрузка (генерация маршрута/кода на основе BPMN-модели), это очень ограниченное решение. После такой единовременной выгрузки вы все изменения в модели отражаете в маршрут руками (и наоборот).
Жаль... но всё равно спасибо за интересную беседу, Ваши комментарии всегда оставляют меня неравнодушной =)
Кстати, если продолжать использовать Visio, но захотеть попробовать "карандашный стиль", вполне можно найти уже готовые stencils.
Буквально с ходу находятся, например, такие:
Кроме того, пока я перебирал разные варианты, нашел статью, автор которой предлагает "замаскировать" обычные stencil-ы Visio под "карандаш" (путем задания своего ситиля линии): http://visualsignals.typepad.co.uk/vislog/2008/03/creating-random.html
Так что, если будет желание, пробуйте, может такой подход придется более по вкусу.
Спасибо, Михаил, это будет интересно, погляжу на досуге.
Покамест я рисую "примитивы" примерно так, если говорить о том же справочнике "Номенклатура дел":
Вот чисто субъективно - мне такая картинка нравится. Но как махровой канцелярской крысе мне непререкаемо кажется, что подобному стилю оформления не место в официальной проектной документации.
Да, абсолютно согласна - наш канцелярит ужасен и неповоротлив, но, увы, всё ещё используем почти повсеместно. Мне, пока, не приходилось сталкиваться с заказчиками "вольных нравов" - скорее наоборот.
Что касается лично меня - я, наверное, не смогу сейчас определиться с явными симпатиями к одному из вариантов. С одной стороны действительно лучше упрощать всё, что можно упростить, и не плодить сущности без надобности. С другой... ну я уже говорила, что я ретроград? =)
А так - очень интересная тема для последующих дискуссий ;-)
Зарисовки пользовательских интерфейсов - дело хорошее. И не так уж важно в каком виде они будут сделаны. При разработке архитектуры решения, как правило, требуется логическая модель приложения. И многие рисуют её в виде ER-модели или диаграммы классов. Разговаривать с пользователями при помощи таких картинок практически невозможно. А вот скриншоты пользовательских форм и списков решают эту задачу.
Максим, а можно поподробнее? С примерами?
Здравствуйте, коллеги.
Немного запоздало, но подключусь к дискуссии. Во-первых, хочу поблагодарить вас, Валентина, за тематику поста. Наконец хоть кто-то из ECM-специалистов поднял и начал обсуждать эту строго затабуированную в нашей среде тему.
Пару лет назад я проводил опрос среди коллег по цеху, какими кто пользуется инструментами не то чтобы прототипирования, а хотя бы просто отрисовки и согласования пользовательских интерфейсов. Наиболее распространенным вариантом стал карандаш и бумага. Один из респондентов сказал, что ни дай бог, обсуждать с клиентом возможность кастомизации интерфейса - это же сплошной гемор с хардкодом. Даже внедренцы продвинутых зарубежных решений типа Документума с давно разработанными инструментами кастомизации предпочитали не ковыряться в коде, максимум — в стандартном интерфейсе спрятать пару кнопок.
У нас в компании ситуация другая. Практически все наши клиенты требуют кастомизации как минимум веб-шкурок своих приложений и экранов при этом может быть - сотни. Понятно, что графическим редактором можно убиться это все делать. Вся история развития данного вопроса в нашей компании прописана на корпоративном блоге в Хабре:
Как мы выбирали инструмент прототипирования. Часть I http://habrahabr.ru/company/alee/blog/116440/
История создания инструмента прототипирования. Часть II http://habrahabr.ru/company/alee/blog/117400/
Интерактивное прототипирование с GUI Machine http://habrahabr.ru/company/alee/blog/123745/
Практика прототипирования в софтверной компании http://habrahabr.ru/company/alee/blog/146781/
Практика использования интерактивного прототипа на этапе коммерческого предложения http://habrahabr.ru/company/alee/blog/141633/
В итоге имеем собственный инструмент прототипирования интерактивных интерфейсов, а не просто унылых скетчей. Все экраны согласовываются с заказчиком на этапе сбора требований и проектирования да и программисты довольны, кодя один в один согласованные интерфейсы.
Станислав, какое продуктивное подключение! Спасибо, что не остались в стороне и поделились своими "этапами большого пути"! Наливаю вечерний чай и сажусь читать Ваш корпоративный блог =)
Возвращаясь к давней теме, хочу показать еще один интересный (с моей точки зрения) инструмент для создания скетчей.
Это Storyboarding in PowerPoint.
В 2-х словах работа с ним выглядит так:
Таким образом получается, что каждый слайд - это отдельный экран. Вот так примерно выглядит отдельный слайд:
В чем, как мне видится, плюсы именно этого решения:
Если интересно можете пройти по ссылке https://1drv.ms/p/s!Ai1PnoMOAVFJid5H_NmXXh-vpfcacw и либо скачать готовую презентацию, либо нажать "Start Slide Show" и посмотреть все слайды или даже понажимать кнопки (правда работает только "Выход", "Список РКК", "Cancel" на экране выхода, "Закрыть" на списке РКК, а еще срабатывает щечек по выпадающему списку поля "Дата начала", а потом щелчек по каледарю).
Слушайте, а мне нравится! Понятно, надо поковыряться, но навскидку - клёвая штука! Спасибо за информацию, Михаил!
Попробуйте. Если вдруг возникнут сложности, пишите - попробуем вместе разобраться.