| Foreword |
|
xiv | |
| About the Authors |
|
xv | |
| About the Technical Reviewer |
|
xvii | |
| About the Cover Image Designer |
|
xviii | |
| Layout Conventions |
|
xix | |
|
PART ONE LEARNING FIREWORKS |
|
|
1 | (98) |
|
|
|
3 | (14) |
|
Fireworks as a web design tool |
|
|
4 | (2) |
|
Fireworks as a design and illustration tool |
|
|
6 | (2) |
|
Fireworks as a prototyping tool |
|
|
8 | (2) |
|
Fireworks and the Creative Suite |
|
|
10 | (5) |
|
|
|
11 | (1) |
|
|
|
12 | (1) |
|
|
|
13 | (2) |
|
|
|
15 | (2) |
|
Fireworks and CS4 Integration |
|
|
17 | (14) |
|
|
|
17 | (2) |
|
|
|
18 | (1) |
|
Integration within the Creative Suite |
|
|
18 | (1) |
|
Integration with Photoshop |
|
|
19 | (7) |
|
Importing a Photoshop file |
|
|
19 | (1) |
|
|
|
20 | (1) |
|
|
|
20 | (1) |
|
|
|
21 | (1) |
|
|
|
22 | (2) |
|
Working with shapes from Photoshop |
|
|
24 | (1) |
|
Importing a PNG into Photoshop |
|
|
24 | (1) |
|
|
|
25 | (1) |
|
Integration with Illustrator |
|
|
26 | (2) |
|
Opening an Illustrator file |
|
|
26 | (1) |
|
|
|
27 | (1) |
|
|
|
27 | (1) |
|
|
|
27 | (1) |
|
|
|
27 | (1) |
|
|
|
27 | (1) |
|
|
|
27 | (1) |
|
Importing an Illustrator (Al) file |
|
|
28 | (1) |
|
|
|
28 | (1) |
|
Import as a single flattened bitmap |
|
|
29 | (1) |
|
|
|
29 | (1) |
|
|
|
29 | (1) |
|
|
|
29 | (1) |
|
|
|
29 | (1) |
|
|
|
29 | (2) |
|
|
|
31 | (18) |
|
|
|
32 | (1) |
|
|
|
32 | (1) |
|
|
|
33 | (5) |
|
Common selection techniques |
|
|
34 | (1) |
|
|
|
34 | (1) |
|
|
|
34 | (1) |
|
Arrow tool and arrow keys |
|
|
34 | (1) |
|
|
|
34 | (1) |
|
|
|
34 | (1) |
|
|
|
35 | (1) |
|
|
|
36 | (1) |
|
Converting selections to paths and vice versa |
|
|
37 | (1) |
|
|
|
38 | (3) |
|
|
|
38 | (1) |
|
|
|
39 | (2) |
|
|
|
41 | (1) |
|
Image adjustment/effects tools |
|
|
41 | (3) |
|
|
|
41 | (1) |
|
|
|
42 | (2) |
|
|
|
44 | (1) |
|
Additional retouching tools |
|
|
44 | (3) |
|
|
|
44 | (1) |
|
|
|
45 | (1) |
|
|
|
46 | (1) |
|
|
|
47 | (2) |
|
|
|
49 | (26) |
|
|
|
50 | (6) |
|
|
|
50 | (1) |
|
|
|
51 | (1) |
|
|
|
52 | (1) |
|
|
|
53 | (1) |
|
|
|
54 | (1) |
|
Freeform and Reshape Area tools |
|
|
55 | (1) |
|
|
|
56 | (1) |
|
|
|
56 | (17) |
|
|
|
58 | (3) |
|
|
|
61 | (6) |
|
Selecting points on a line or path |
|
|
67 | (1) |
|
|
|
68 | (5) |
|
|
|
73 | (2) |
|
Exporting from Fireworks to the Web |
|
|
75 | (24) |
|
File optimization: The tools |
|
|
75 | (2) |
|
|
|
76 | (1) |
|
|
|
76 | (1) |
|
|
|
77 | (8) |
|
Choosing the right file type |
|
|
78 | (1) |
|
Compression and color settings |
|
|
79 | (1) |
|
|
|
80 | (1) |
|
|
|
80 | (1) |
|
|
|
80 | (1) |
|
|
|
81 | (1) |
|
|
|
81 | (1) |
|
|
|
81 | (1) |
|
|
|
81 | (1) |
|
|
|
82 | (2) |
|
|
|
84 | (1) |
|
|
|
85 | (11) |
|
|
|
85 | (1) |
|
|
|
86 | (1) |
|
|
|
87 | (2) |
|
Dreamweaver Library (.Ibi) |
|
|
89 | (1) |
|
HTML and Images/CSS and Images (.htm)\Director (.htm) |
|
|
89 | (2) |
|
|
|
91 | (3) |
|
|
|
94 | (2) |
|
|
|
96 | (3) |
|
|
|
99 | (126) |
|
|
|
101 | (28) |
|
|
|
102 | (8) |
|
|
|
102 | (1) |
|
Selecting a gradient type |
|
|
102 | (1) |
|
|
|
102 | (1) |
|
Adjusting the gradient direction |
|
|
103 | (1) |
|
Advanced gradient editing |
|
|
104 | (1) |
|
|
|
105 | (1) |
|
|
|
106 | (1) |
|
|
|
107 | (1) |
|
|
|
107 | (1) |
|
|
|
107 | (2) |
|
|
|
109 | (1) |
|
|
|
110 | (17) |
|
|
|
110 | (3) |
|
|
|
113 | (2) |
|
|
|
115 | (1) |
|
Finding the right color palette |
|
|
116 | (1) |
|
Creating the thick diagonal background texture |
|
|
116 | (1) |
|
Defining the container rectangle |
|
|
116 | (1) |
|
Defining the primary rectangle |
|
|
117 | (1) |
|
Adding texture to the primary rectangle |
|
|
117 | (1) |
|
Adding a highlight border |
|
|
118 | (1) |
|
|
|
119 | (2) |
|
|
|
121 | (1) |
|
|
|
121 | (6) |
|
|
|
127 | (2) |
|
The Ins and Outs of Animation |
|
|
129 | (14) |
|
|
|
129 | (3) |
|
|
|
130 | (1) |
|
|
|
130 | (1) |
|
|
|
130 | (1) |
|
|
|
130 | (1) |
|
|
|
131 | (1) |
|
|
|
131 | (1) |
|
|
|
132 | (1) |
|
|
|
132 | (1) |
|
|
|
132 | (1) |
|
|
|
132 | (4) |
|
|
|
134 | (1) |
|
|
|
134 | (1) |
|
Creating the animation frames |
|
|
135 | (1) |
|
|
|
136 | (1) |
|
|
|
136 | (2) |
|
|
|
136 | (1) |
|
|
|
137 | (1) |
|
|
|
137 | (1) |
|
|
|
137 | (1) |
|
Creating the animation states |
|
|
138 | (1) |
|
Duplicating and reversing states |
|
|
138 | (1) |
|
Exporting animations for the Web |
|
|
139 | (2) |
|
|
|
139 | (1) |
|
|
|
140 | (1) |
|
|
|
141 | (2) |
|
Skinning Flex Components with Fireworks |
|
|
143 | (12) |
|
Creating a new Flex skin in Fireworks |
|
|
144 | (2) |
|
|
|
146 | (1) |
|
|
|
147 | (1) |
|
Importing the skin in Flex |
|
|
148 | (5) |
|
Creating a new Flex project |
|
|
148 | (1) |
|
Adding a Button component |
|
|
149 | (1) |
|
Importing the skin images |
|
|
149 | (3) |
|
Modifying the nine-slice scaling |
|
|
152 | (1) |
|
|
|
153 | (2) |
|
Creating Adobe Air Prototypes |
|
|
155 | (20) |
|
Designing the master page |
|
|
157 | (8) |
|
|
|
157 | (1) |
|
Defining the content container |
|
|
158 | (1) |
|
|
|
158 | (2) |
|
Adding the application title |
|
|
160 | (1) |
|
Designing the information page |
|
|
160 | (1) |
|
Designing the gallery page |
|
|
161 | (1) |
|
Creating the thumbnail symbol |
|
|
161 | (2) |
|
Building the portfolio detail pages |
|
|
163 | (1) |
|
Duplicating the pages and finalizing page names |
|
|
164 | (1) |
|
Adding hotspots and interaction |
|
|
165 | (1) |
|
|
|
165 | (1) |
|
|
|
165 | (1) |
|
|
|
165 | (1) |
|
Defining links on the gallery page |
|
|
166 | (1) |
|
Creating the Adobe AIR package |
|
|
166 | (6) |
|
|
|
168 | (1) |
|
Creating a digital signature |
|
|
168 | (3) |
|
|
|
171 | (1) |
|
Creating and installing the AIR file |
|
|
171 | (1) |
|
|
|
172 | (3) |
|
|
|
175 | (14) |
|
|
|
176 | (6) |
|
Command and command panel extension types |
|
|
176 | (1) |
|
|
|
177 | (1) |
|
Default Fireworks commands |
|
|
178 | (1) |
|
|
|
178 | (2) |
|
Modifying the document/interface |
|
|
180 | (2) |
|
Finding extensions online |
|
|
182 | (2) |
|
Browsing Adobe Exchange: A repository of extensions |
|
|
182 | (2) |
|
Additional extension resources |
|
|
184 | (1) |
|
|
|
184 | (1) |
|
|
|
184 | (1) |
|
Using the Extension Manager |
|
|
185 | (2) |
|
Installing new extensions |
|
|
186 | (1) |
|
|
|
186 | (1) |
|
Uninstalling an extension |
|
|
187 | (1) |
|
|
|
187 | (2) |
|
Extending Fireworks: Developing an Effective Workflow Using Javascript and Flash |
|
|
189 | (36) |
|
|
|
190 | (1) |
|
Learning the basics of an advanced workflow |
|
|
190 | (1) |
|
Defining a Fireworks workflow |
|
|
191 | (8) |
|
Step 1: Creating a simple JSF command |
|
|
191 | (1) |
|
Using the History panel to create a command |
|
|
192 | (1) |
|
|
|
192 | (1) |
|
Where is the command stored? |
|
|
193 | (1) |
|
Editing and understanding the JSF |
|
|
194 | (1) |
|
Step 2: Creating a Flash UI |
|
|
195 | (1) |
|
Creating a document and adding a button |
|
|
195 | (1) |
|
Steps 3 and 4: Importing and executing the JSF |
|
|
196 | (2) |
|
Adding the Mouse.onRelease event handler |
|
|
198 | (1) |
|
Step 5: Publishing and testing the SWF |
|
|
198 | (1) |
|
Building a functional Ul in Flash |
|
|
199 | (5) |
|
Draw Rect.jsf updated with the CreateRectangle function |
|
|
199 | (3) |
|
Working with returned values: Adding a ColorPicker |
|
|
202 | (2) |
|
Streamlining your workflow with the Fireworks developer toolbox |
|
|
204 | (3) |
|
Converting JSF to AS using the FDT |
|
|
205 | (2) |
|
Updating the Draw Rect panel |
|
|
207 | (1) |
|
Defining Flash panel resize behavior |
|
|
207 | (3) |
|
Responding to Fireworks events |
|
|
210 | (1) |
|
Detecting change of selection |
|
|
210 | (1) |
|
|
|
211 | (1) |
|
Building panels with ActionScript 3 |
|
|
211 | (8) |
|
Creating ActionScript 3 panels in Flash |
|
|
212 | (2) |
|
Responding to Fireworks events in ActionScript 3 |
|
|
214 | (1) |
|
Creating ActionScript 3 panels in Flex |
|
|
215 | (4) |
|
Packaging and deploying your panel |
|
|
219 | (2) |
|
Learning the Fireworks object model |
|
|
221 | (2) |
|
The Extending Fireworks documentation |
|
|
221 | (1) |
|
|
|
221 | (1) |
|
The FWAPI_Inspector panel |
|
|
221 | (2) |
|
|
|
223 | (2) |
|
PART THREE FIREWORKS IN ACTION |
|
|
225 | (50) |
|
Web Site Case Study #1: Blog |
|
|
227 | (18) |
|
Project planning and preparation |
|
|
228 | (1) |
|
|
|
228 | (1) |
|
Exploring layouts with wireframes |
|
|
229 | (4) |
|
|
|
229 | (4) |
|
Turning wireframes into gray frames |
|
|
233 | (3) |
|
|
|
233 | (3) |
|
Creating a logo for the design |
|
|
236 | (1) |
|
|
|
237 | (1) |
|
Putting all the pieces together: The design composition |
|
|
237 | (4) |
|
|
|
238 | (3) |
|
Build-out: From graphics to code |
|
|
241 | (1) |
|
|
|
242 | (1) |
|
|
|
242 | (3) |
|
Web Site Case Study #2: CSS Sprites |
|
|
245 | (10) |
|
Creating site navigation with sprites |
|
|
246 | (1) |
|
|
|
246 | (1) |
|
|
|
247 | (1) |
|
|
|
248 | (5) |
|
|
|
250 | (1) |
|
Extreme negative text indent |
|
|
251 | (1) |
|
|
|
251 | (1) |
|
Sliding the background into position |
|
|
252 | (1) |
|
|
|
253 | (2) |
|
Web Site Case Study #3: E-Commerce |
|
|
255 | (20) |
|
Checking out with shared layers and pages |
|
|
255 | (1) |
|
|
|
256 | (3) |
|
Designing the site's background |
|
|
256 | (1) |
|
|
|
256 | (1) |
|
|
|
256 | (1) |
|
Establishing the site's navigation |
|
|
256 | (2) |
|
Organizing the document's objects and layers |
|
|
258 | (1) |
|
Organizing the site design into pages |
|
|
258 | (1) |
|
Building all the graphics in Fireworks |
|
|
259 | (4) |
|
|
|
259 | (1) |
|
Defining the logo's basic shape and color |
|
|
259 | (1) |
|
Adding some detail and dimension |
|
|
260 | (1) |
|
|
|
260 | (1) |
|
Drawing a T-shirt graphic |
|
|
261 | (1) |
|
|
|
262 | (1) |
|
|
|
263 | (9) |
|
|
|
264 | (2) |
|
Using symbols for efficient workflow |
|
|
266 | (2) |
|
|
|
268 | (1) |
|
|
|
268 | (3) |
|
Building the Confirmation page |
|
|
271 | (1) |
|
|
|
272 | (3) |
| Index |
|
275 | |
Daugiau apie elektronines knygas