Обзор и анализ инструментов проектирования и прототипирования программных интерфейсов - Microsoft Expression Blend, iRise, Axure, GUI Design Studio, GUI Machine - представленный Рустемом Гайфутдиновым, менеджером "АЛЕЕ СОФТВЕР" по развитию продукта GUI Machine на Vaadin Developer Meetup 24 января 2011 года

1. Обзор и анализ инструментов проектирования и прототипирования интерфейсов Рустем Гайфутдинов

2. Откуда берутся прототипы? ?

3. „ В начале было Слово“

4. Материализация идей Скетч (sketch)

5. Скетч — карандашный набросок, зарисовка, эскиз, заготовка

7. Ввод в компьютер

8. Уточнение Скетч (sketch) Вайрфрейм (wireframe)

9. Вайрфрейм — это схема интерфейса, отражающая идею концепции и структуру будущего приложения

11. Уточнение

12. Дизайн Вайрфрейм (wireframe) Мокап (mockup)

13. Мокап — графический макет системы Красиво, но статично

15. «Оживление» интерфейсов Мокап (mockup) Прототип (Prototype)

16. Ещё не программа , Что такое прототип? но уже не картинка

17. Прототип... Кликабельный Его можно потыкать, подвигать, пощёлкать, почувствовать Интерактивный Он реагирует на ваши действия Реальный Выглядит как реальная программа

18. Дизайн + Функциональность + Контент Прототип

20. Рынок инструментов проектирования и прототипирования интерфейсов содержит сегменты, соответствующие этапам разработки прототипа „ Каков корень, таково и семя“ Этапы разработки прототипа Сегменты рынка

21. Конструкторы скетчей и вайфреймов Конструкторы мокапов и графические редакторы Инструменты динамического прототипирования

22. Онлайн Веб-приложения Оффлайн десктоп-приложения

24. Designer Vista

25. SketchFlow

26. ForeUI

27. Pidoco

28. Pencil Project

29. MockFlow

30. WireFrameSketcher Studio

32. Adobe Photoshop

33. Pidoco

34. Adobe Illustrator

35. Microsoft Visio

37. GUI Design Studio

38. iRise

39. Microsoft Expression Blend

40. GUI Machine

42. Интерактивность прототипов

43. Возможность прототипирования различных типов приложений

44. Скорость создания прототипов

45. Простота и удобство работы

46. Поддерживаемые платформы

47. Уникальные и интересные возможности

49. Подгружаемые библиотеки компонентов

50. Создание и использование мастеров

51. Рисование UML-диаграмм

52. Компоненты «Фрейм» и «Динамическая панель»

54. В базовом варианте мало компонентов

55. Компоненты слабо настраиваемы

56. Ограниченные возможности интерактивности (мало событий и действий)

57. Нет настроек приложения и проекта

58. Не руссифицирован

60. Генерирует HTML-код, но неоптимальный

61. Совместная работа, но ограниченная и неполноценная

62. Генерация спецификации, но не работает с Open Office

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

65. Быстрое и простое создание прототипа

66. Простой механизм создания действий

67. Большой набор компонентов, некоторые имеют предзаданные действия

68. Набор Ribbon компонентов

69. Набор иконок

71. Ошибка при наличии в пути к директории установки русских букв

72. Ненативные компоненты

73. Слабый механизм просмотра прототипов

74. Прототип не оставляет впечатления работающей программы, многое статично, мало свободы, ограниченная интерактивность

75. Настройка компонентов в попап окне

76. Не руссифицирован

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

80. Высокая интерактивность прототипов, удобный инструмент создания действий

81. Хороший механизм просмотра прототипов: иммитация работы сессий и БД, дополнительные параметры просмотра

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

83. Совместная работа

84. Удобный инструмент работы с шаблонами

85. Экспорт/импорт табличных данных в/из CSV

87. Не для прототипирования десктопных приложений

88. Цена от 6995$

89. Маленький набор компонентов

90. Мало настроек компонентов

91. Более сложный

92. Вывод: мощный и удобный инструмент для прототипирования веб-сайтов и веб-приложений со сложной функциональностью. Интерактивность прототипов — высокая. Часть функционала приложения уникальна. Однако, не позволяет прототипировать десктоп-приложения. Дорогой.

94. Прототипирование только Silverlight и WPF приложений

95. Более сложный

97. Большой и красивый набор нативных компонентов, представление их как в виде скетчей, так и с полноценным дизайном

98. Компоненты детально настраиваемые

99. Высокая интерактивность прототипов

100. Гибкий, интересный и удобный механизм создания действий

101. Создание анимации, плавных переходов

102. Карта связей интерфейсов

104. Интерфейс программы: необычный, непривычный, «на любителя», иногда сложный, не всегда удобный

105. Прототипирование не только классических, но и вообще любых приложений — несложных игр, анимаций. Вывод: мощный и удобный инструмент для прототипирования Silverlight и WPF приложений со сложной функциональностью. Интерактивность и визуальная привлекательность прототипов — высокая. Часть функционала приложения уникальна. Однако, не позволяет прототипировать приложения для других платформ. Несколько сложен в освоении.

107. Кроссплатформенный: для Windows, Mac OS, Unix

108. Быстрое и простое создание прототипа

109. Высокая интерактивность прототипов, простой механизм создания действий

110. Наборы как нативных, так и платформо-независимых (Vaadin) компонентов, детальная настройка компонентов

111. Большой набор иконок

112. Уникальный механизм просмотра прототипов

113. Механизм для работы с шаблонами

114. Встроенные утилиты: графический редактор, скриншотер, Pixel Grabber

115. Детальная настройка проекта и приложения

116. Русский и английский языки интерфейса

118. Нет генерации кода. Планируем сделать тогда, когда сможем генерировать оптимальный, полезный код

119. Требовательный, работа на нетбуке затруднительна

120. Нет подгружаемых библиотек компонентов, но существующий набор постоянно пополняется

121. Нет генерации спецификации, планируем экспортировать прототип в интерактивный документ Вывод: мощный и удобный инструмент для прототипирования десктоп и веб-приложений со сложной функциональностью. Интерактивность и визуальная привлекательность прототипов — высокая. Часть функционала приложения уникальна. Пока не обладает некоторыми удобными и полезными функциями.

122. Мы в сети Рустем Гайфутдинов Менеджер по развитию продукта [email_address] rustem-gayfutdinov.moikrug.ru GUI Machine Прототипирование десктопных и веб-приложений www.guimachine.ru [email_address] twitter.com/GUI_Machine community.livejournal.com/guimachine