Проектирование страниц интерфейса в Adobe Fireworks Александр Хмелевский UI Modeling Company. - презентация

О чем доклад?
1. Постановка проблемы
Мы долгое время проектировали в MS Visio, чем он хорош и плох?
www.uimodeling.ru

О чем доклад?
1. Постановка проблемы
Мы долгое время проектировали в MS Visio, чем он хорош и плох?
2. Где мы искали спасение?
Обзор основных инструментов проектирования.
www.uimodeling.ru

О чем доклад?
1. Постановка проблемы
Мы долгое время проектировали в MS Visio, чем он хорош и плох?
2. Где мы искали спасение?
Обзор основных инструментов проектирования.
3. Adobe Fireworks как решение
Почему мы остановились на Fireworks?
www.uimodeling.ru

О чем доклад?
1. Постановка проблемы
Мы долгое время проектировали в MS Visio, чем он хорош и плох?
2. Где мы искали спасение?
Обзор основных инструментов проектирования.
3. Adobe Fireworks как решение
Почему мы остановились на Fireworks?
4. Что в итоге?
Практически идеальный инструмент.
www.uimodeling.ru

Microsoft Visio
Почему мы работали в Visio?
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Гибкие инструменты для создания собственных библиотек;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Гибкие инструменты для создания собственных библиотек;
Наличие стилей;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Гибкие инструменты для создания собственных библиотек;
Наличие стилей;
Возможность легко и быстро создавать диаграммы;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Гибкие инструменты для создания собственных библиотек;
Наличие стилей;
Возможность легко и быстро создавать диаграммы;
Связь с другими продуктами MS Office;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Почему мы работали в Visio?
Скорость создания прототипов;
Наличие готовых «стенсилов»;
Гибкие инструменты для создания собственных библиотек;
Наличие стилей;
Возможность легко и быстро создавать диаграммы;
Связь с другими продуктами MS Office;
Экспорт в HTML и PDF.
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
Запутанный интерфейс;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
Запутанный интерфейс;
Невозможно перенастроить «горячие» клавиши;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
Запутанный интерфейс;
Невозможно перенастроить «горячие» клавиши;
Сложность работы над большими проектами;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
Запутанный интерфейс;
Невозможно перенастроить «горячие» клавиши;
Сложность работы над большими проектами;
Совместимость работы с дизайнером;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Microsoft Visio
Главная проблема Visio — сам Visio
Не заточен под проектирование интерфейсов;
Запутанный интерфейс;
Невозможно перенастроить «горячие» клавиши;
Сложность работы над большими проектами;
Совместимость работы с дизайнером;
Эстетически непривлекательные прототипы.
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Примеры
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Где мы искали спасение?
1. Adobe InDesign Много плюсов, но изначально заточен под полиграфию и весьма ресурсоемок.
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Примеры
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Где мы искали спасение?
2. Axure Pro
Хорошая программа, но не подходит для крупных проектов.
www.uimodeling.ru
1. Adobe InDesign Много плюсов, но изначально заточен под полиграфию и весьма ресурсоемок.
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
Где мы искали спасение?
2. Axure Pro
Хорошая программа, но не подходит для крупных проектов.
www.uimodeling.ru
1. Adobe InDesign Много плюсов, но изначально заточен под полиграфию и весьма ресурсоемок.
3. Другие программы
MS Expression Blend, Norpath Studio, Adobe Flash, MS PowerPoint и многие, многие другие.

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
Масштаб 1:1;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
Масштаб 1:1;
Возможность независимо менять размер каждой страницы;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
Масштаб 1:1;
Возможность независимо менять размер каждой страницы;
Эстетически привлекательные прототипы;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
Масштаб 1:1;
Возможность независимо менять размер каждой страницы;
Эстетически привлекательные прототипы;
Один инструмент для проектировщика и дизайнера;
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Adobe Fireworks как решение
Неужели спасение?
Стандартный интерфейс Adobe;
Наличие библиотеки готовых элементов и возможность создавать собственные;
Один файл даже для большого проекта;
Выравнивание объектов и направляющие;
Масштаб 1:1;
Возможность независимо менять размер каждой страницы;
Эстетически привлекательные прототипы;
Один инструмент для проектировщика и дизайнера;
И так далее…
www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Стандартный интерфейс Adobe
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Наличие библиотеки готовых элементов и возможность создавать собственные
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Чего мы добились в итоге?
www.uimodeling.ru

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Выравнивание объектов и направляющие
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Один инструмент для проектировщика и дизайнера
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Иконка
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

www.uimodeling.ru
Иконка
Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Иконка

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Иконка

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Иконка

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Что в итоге?
Практически идеальный инструмент

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Что в итоге?
Практически идеальный инструмент
Неудобная работа с библиотекой элементов;

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Что в итоге?
Практически идеальный инструмент
Неудобная работа с библиотекой элементов;
Сложность создания редактируемых символов;

Постановка проблемы | Где мы искали спасение? | Adobe Fireworks как решение | Что в итоге?
www.uimodeling.ru
Что в итоге?
Практически идеальный инструмент
Неудобная работа с библиотекой элементов;
Сложность создания редактируемых символов;
…