Prototype and Design in Fireworks

1. Fireworks
Agenda
1. Обзор приложения
2. Преимущества проектирование интерфейсов для Web
3. Преимущества проектирование интерфейсов для
4. Создание интерактивных прототипов

2. Как Adobe определяет назначение своего софта?
Photoshop Illustrator Fireworks InDesign
Новые возможности Создавайте новые Быстрое создание Профессиональный
для работы иллюстрации с прототипа и дизайна дизайн макетов
с цифровыми превосходным для любого страниц для печати и
изображениями векторным устройства электронных
инструментом публикация
По применению в индустрии
Photoshop Illustrator Fireworks InDesign
Для работы Для работы Прототипирование и Дизайн для
с растром, ретуши и с вектором дизайн интерфейсов полиграфии и web
рисования

3. Why to use Fireworks?
+ Плюсы - Минусы
+ Multiple Pages, Layers, States − Limitation of PSD support (Adjustment
+ Master Pages, Shared Layers Layers, Groups, Pages, Symbols)
+ Web Layers − Ограниченная совместимость с PS plugins
+ Symbols, Symbols Library (Page Curl, KPT, Eye Candy)
+ Smart Auto Shapes
+ Export HTML, PDF, PSD
+ Styles (Font, Filters)
+ Guides, Smart Guides
+ Import and Edit Vector (9 slice scaling)

4. 1. Работа со страницами и слоями
Pages, Master Pages, Layers, Shared Layers, States
• Different sizes of Pages
• Share Layer to another Pages
• Master Page
• Export Pages

5. 2. Сетки, гриды, направляющие
• Manage Guides
• Smart Guides
• Quick Info
• Modular Grid
• Manage Spaces

6. 3. Работа с символами и библиотеками
Create, Update Symbols , Symbols Library
• Manage Symbols
• Common Library
• Document Library
• Symbols Benefits: (update, doc size)

7. 4. Умное масштабирование
• 9 Slice Scaling for Objects
• 9 Slice Scaling for Symbols
• 9 Slice Scaling for Bitmaps
• Adjust 9 Slice Pannel

8. 5. Ускоряем работу Стилями
Create Styles, Export Styles, CSS Styles
• Text Styles
• Shape Styles
• Style Library
• Redefine Styles in Document
• Export to CSS

9. 6. Import & Export
Import From
• PSD
• AI
• EPS
Export to
• PNG
• JPG (Selective JPG)
• SVG
• Export Sprites

10. Сравнительная таблица
20 kb less = 320 mb per day
Форматы Photoshop Fireworks
PNG Compression 352 kb 332 kb
GIF Compression 92 kb 88 kb
JPEG Compression 80 kb 72 kb

11. 7. Create Prototype
• Embedding HTML
• Share
• Export to HTML
• Export to PDF
• Export Annotations
• Export Responsive Prototype
(http://owltastic.com/,
http://dustinsenos.com/)
• Export Demo (http://bit.ly/tTPA1B)

12. 8. Advanced Rich Symbols

13. 9. Prototype for iOS
Official Review
http://bit.ly/oG0guL
PDF help for commands
http://www.unitid.nl/tap/TAP_cheatsheet_0045.pdf
Official Demo
http://ipro.to/tap_ipad (Enter this URL in mobile Safari on you iPhone.)
http://ipro.to/tap_iphone
http://ipro.to/tap_iphone_retina

14. Спасибо за внимание!