This document discusses Jesse Warden, a Flex and Flash consultant. It provides biographical information on Jesse, including that he is a partner at Web App Solution and consults on Flex, Flash, and technical design. The document then covers topics related to Jesse's work, including clients, complex designs in Flex, production art processes, and design fundamentals issues like raster vs vector formats.
10. WHO AM I?
‣ Jesse Warden
‣ Flex& Flash Consultant @ Web App
Solution
11. WHO AM I?
‣ Jesse Warden
‣ Flex& Flash Consultant @ Web App
Solution
‣ Service Work by day...
12. WHO AM I?
‣ Jesse Warden
‣ Flex& Flash Consultant @ Web App
Solution
‣ Service Work by day...
‣ ...product work (+beer) at night.
13. WHO AM I?
‣ Jesse Warden
‣ Flex& Flash Consultant @ Web App
Solution
‣ Service Work by day...
‣ ...product work (+beer) at night.
‣ Consultant by day...
14. WHO AM I?
‣ Jesse Warden
‣ Flex& Flash Consultant @ Web App
Solution
‣ Service Work by day...
‣ ...product work (+beer) at night.
‣ Consultant by day...
‣ ...entrepreneur (more beer) at night.
37. TANGIBLES
‣ How to get designs into Flex & Flash
38. TANGIBLES
‣ How to get designs into Flex & Flash
‣ Design Options
39. TANGIBLES
‣ How to get designs into Flex & Flash
‣ Design Options
‣ What Tool, Where
40. TANGIBLES
‣ How to get designs into Flex & Flash
‣ Design Options
‣ What Tool, Where
‣ challenges with Illustrator & Catalyst
41. TANGIBLES
‣ How to get designs into Flex & Flash
‣ Design Options
‣ What Tool, Where
‣ challenges with Illustrator & Catalyst
‣ engage designers in Agile SCRUM
48. INSPIRATION
‣ Continuallyhired as a Flex consultant
for design skills
49. INSPIRATION
‣ Continuallyhired as a Flex consultant
for design skills
‣ disagreewith the Illustrator/Catalyst
direction
50. INSPIRATION
‣ Continuallyhired as a Flex consultant
for design skills
‣ disagreewith the Illustrator/Catalyst
direction
‣ Encounterengineers who don’t
know the basics
136. SWF
‣ Flash Player format
‣ supports vector, bitmap, 32 bit
137. SWF
‣ Flash Player format
‣ supports vector, bitmap, 32 bit
‣ sub-pixel rendering
138. SWF
‣ Flash Player format
‣ supports vector, bitmap, 32 bit
‣ sub-pixel rendering
‣ JPEG compression with Alpha
139. SWF
‣ Flash Player format
‣ supports vector, bitmap, 32 bit
‣ sub-pixel rendering
‣ JPEG compression with Alpha
‣ Graphical & Font Engine
140. SWF
‣ Flash Player format
‣ supports vector, bitmap, 32 bit
‣ sub-pixel rendering
‣ JPEG compression with Alpha
‣ Graphical & Font Engine
‣ Color Calibration
144. ALIASING & ANTI-ALIASING
‣ Stair Stepping
‣ Aliasing looks worse, but is faster
‣ Anti-Aliasing looks better, but slower
145. ALIASING & ANTI-ALIASING
‣ Stair Stepping
‣ Aliasing looks worse, but is faster
‣ Anti-Aliasing looks better, but slower
‣ Anti-Aliasing hard to read with small
text sizes
146. ALIASING & ANTI-ALIASING
‣ Stair Stepping
‣ Aliasing looks worse, but is faster
‣ Anti-Aliasing looks better, but slower
‣ Anti-Aliasing hard to read with small
text sizes
‣ Anti-Aliasing + sub-pixel rendering
built into Flash Player
162. LOSSY VS. LOSSLESS
‣ JPEG vs. PNG
‣ Photographs use JPEG
‣ Shapes/Gradients use PNG
163. LOSSY VS. LOSSLESS
‣ JPEG vs. PNG
‣ Photographs use JPEG
‣ Shapes/Gradients use PNG
‣ Lossy usually has no alpha channel
164. LOSSY VS. LOSSLESS
‣ JPEG vs. PNG
‣ Photographs use JPEG
‣ Shapes/Gradients use PNG
‣ Lossy usually has no alpha channel
‣ Lossless supports alpha
165. LOSSY VS. LOSSLESS
‣ JPEG vs. PNG
‣ Photographs use JPEG
‣ Shapes/Gradients use PNG
‣ Lossy usually has no alpha channel
‣ Lossless supports alpha
‣ SWF supports lossy with alpha
177. SCALE 9
‣9 bitmaps vs. 1 bitmap & 1 rectangle
‣ minimum scale, no maximum
178. SCALE 9
‣9 bitmaps vs. 1 bitmap & 1 rectangle
‣ minimum scale, no maximum
‣ windows, borders, and buttons
179. SCALE 9
‣9 bitmaps vs. 1 bitmap & 1 rectangle
‣ minimum scale, no maximum
‣ windows, borders, and buttons
‣ Flash IDE for vectors
180. SCALE 9
‣9 bitmaps vs. 1 bitmap & 1 rectangle
‣ minimum scale, no maximum
‣ windows, borders, and buttons
‣ Flash IDE for vectors
‣ mxmlc for bitmaps
181. SCALE 9
‣9 bitmaps vs. 1 bitmap & 1 rectangle
‣ minimum scale, no maximum
‣ windows, borders, and buttons
‣ Flash IDE for vectors
‣ mxmlc for bitmaps
‣ [show button FLA]
182. SCALE 9
[Embed(source=”/images/image.png”)]
public class MyBorder extends Bitmap
[Embed(source=”/images/image/png”),
scaleGridLeft=10, scaleGridTop=10,
scaleGridRight=220,
scaleGridBottom=320)]
public class MyBorder extends Sprite
183. SCALE 9
[Embed(source=”/images/image.png”)]
public class MyBorder extends Bitmap
[Embed(source=”/images/image/png”), ‣ No scale 9, Bitmap
scaleGridLeft=10, scaleGridTop=10,
scaleGridRight=220,
scaleGridBottom=320)]
public class MyBorder extends Sprite
184. SCALE 9
[Embed(source=”/images/image.png”)]
public class MyBorder extends Bitmap
[Embed(source=”/images/image/png”), ‣ No scale 9, Bitmap
scaleGridLeft=10, scaleGridTop=10, ‣ Scale 9 rect, Sprite
scaleGridRight=220,
scaleGridBottom=320)]
public class MyBorder extends Sprite
214. transformations
‣x and y relative to container
‣ width
and height are content
measurements
215. transformations
‣x and y relative to container
‣ width
and height are content
measurements
‣ scaleX and scaleY are tied to width/
height
216. transformations
‣x and y relative to container
‣ width
and height are content
measurements
‣ scaleX and scaleY are tied to width/
height
‣ rotation is top left registration point
217. transformations
‣x and y relative to container
‣ width
and height are content
measurements
‣ scaleX and scaleY are tied to width/
height
‣ rotation is top left registration point
‣ alpha is 0 - 255
218. transformations
‣x and y relative to container
‣ width
and height are content
measurements
‣ scaleX and scaleY are tied to width/
height
‣ rotation is top left registration point
‣ alpha is 0 - 255
‣ visible is basically alpha 0
219. transformations
‣x and y relative to container
‣ width
and height are content
measurements
‣ scaleX and scaleY are tied to width/
height
‣ rotation is top left registration point
‣ alpha is 0 - 255
‣ visible is basically alpha 0
‣z is 3D plane
225. gpu
‣ cacheAsBitmap = true
‣ cacheAsBitmapMatrix = true
‣ inside
<initialWindow> tag in your
AIR descriptor XML
226. gpu
‣ cacheAsBitmap = true
‣ cacheAsBitmapMatrix = true
‣ inside
<initialWindow> tag in your
AIR descriptor XML
‣ <renderMode>gpu</renderMode>
227. gpu
‣ cacheAsBitmap = true
‣ cacheAsBitmapMatrix = true
‣ inside
<initialWindow> tag in your
AIR descriptor XML
‣ <renderMode>gpu</renderMode>
‣ [Lee’s blog]