IntroductionWelcome| 00:00 |
(MUSIC).
| | 00:04 |
Hello, I'm Anastasia McCune.
In this title, I'll take you through some
| | 00:08 |
of the exciting new features and changes
in this version of Flash.
| | 00:13 |
I'll show you some new time savers and
changes to the interface within the Flash IDE.
| | 00:18 |
We'll look at some new features and an
improved work flow for exporting out high
| | 00:21 |
quality video.
We'll also look at how to better profile
| | 00:25 |
your projects so you can identify
potential problem areas that might slow
| | 00:28 |
down your project's play back.
Finally, we'll also play with some
| | 00:32 |
exciting new capabilities when it comes
to testing and debugging your projects
| | 00:36 |
for mobile.
So sit back, relax and let's check out
| | 00:40 |
what's new in Flash Professional.
| | 00:43 |
| | Collapse this transcript |
| Using the exercise files| 00:00 |
In this course we'll be using sample
Flash files from a game called Monster
| | 00:03 |
Match-Up which is basically a matching
game.
| | 00:07 |
You can Download the exercise files from
the course page on the lynda.com library.
| | 00:12 |
Inside the Exercise File folder you'll
find that each movie has a corresponding folder.
| | 00:17 |
Each folder contains all the files needed
for that movie.
| | 00:21 |
You can follow along with me using these
file or use files of your own.
| | 00:25 |
The game used in this course is built to
be an App ultimately played on mobile devices.
| | 00:30 |
If you'd like to spend some more time
with the App itself.
| | 00:33 |
And learn about how to target mobile
devices, check out the course Building
| | 00:37 |
Mobile Apps for Multiple Devices with
Flash Professional with Paul Trani here
| | 00:41 |
in the lynda.com library.
| | 00:43 |
| | Collapse this transcript |
|
|
1. UI Changes and ImprovementsChanges to the Flash interface and performance improvements| 00:00 | The new version of Flash
Professional introduces a number of performance
| | 00:03 | improvements, as well as
changes to the user interface.
| | 00:06 | To demonstrate these, I'll be using the
file called Monster.fla in the exercise
| | 00:11 | files for this chapter.
| | 00:13 | Probably the first change that you'll
notice is that Flash has changed color
| | 00:16 | from previous version.
| | 00:18 | It's now using a dark- gray color for
the interface, which matches the colors
| | 00:21 | being used by Photoshop
and other Adobe softwares.
| | 00:25 | You do have the option to switch back
to the old lighter interface if you wish.
| | 00:29 | Simply go to the Edit menu and then
Preferences or if you're on Mac that's under
| | 00:33 | the Flash menu and then Preferences.
| | 00:35 | You can then choose Dark or Light
under the User Interface dropdown.
| | 00:39 | You can also choose to enable shading or not.
| | 00:42 | This simply applies from subtle
shading effects to the interface.
| | 00:46 | When creating extension panels, there's
also an accompanying set of JS APIs for
| | 00:51 | the new dark UI, which allows for
user interfaces with a similar theme.
| | 00:55 | One change to the stage area is the fact
that there's now unlimited pasteboard size.
| | 01:00 | I'm going to scroll up as far as I
can, and you can see the current upper
| | 01:04 | limit of the pasteboard.
| | 01:05 | If I add something in--I'll just drop a
quick circle--you can see the scrollbar
| | 01:09 | on the right update to
indicate I now have more pasteboard.
| | 01:12 | I'll scroll all the way up
again and draw another circle.
| | 01:16 | More pasteboard appears, and you get the idea.
| | 01:18 | This is ideal for people who might be
doing something like developing game
| | 01:22 | levels, who want to lay their
game's visual content out way across the
| | 01:26 | pasteboard, and then move through it.
| | 01:28 | Moving all around the stage in the
pasteboard is a pretty common thing to do
| | 01:31 | while working in Flash.
| | 01:33 | Now that I've scrolled all the way up to
the top of the pasteboard, I want to go
| | 01:37 | back down to the stage.
| | 01:38 | Flash now offers a super-easy way to center
your view back to the center of the stage.
| | 01:42 | Simply click the new Center Stage button,
located on the upper right of the screen.
| | 01:48 | Notice that centering the stage
hasn't changed the zoom level;
| | 01:51 | it's only set the document's vertical and
horizontal scrollbars back to the center.
| | 01:56 | You can also center the stage by
going to View > Magnification > Center the
| | 02:00 | Stage, or by using the keyboard
shortcut Ctrl+0 for PC or Command+0 for Mac.
| | 02:06 | As you work in the new version of Flash,
he'll notice enhancements to some of the panels.
| | 02:11 | Several have been redesigned or
simplified to improve efficiency and provide a
| | 02:14 | better user experience.
| | 02:16 | For instance, there are a number of
reduced options on the Preferences panel.
| | 02:20 | If you go to the Edit menu and then
Preferences--on a Mac that's, under the
| | 02:23 | Flash menu, then Preferences--there
are only five categories, of General Sync
| | 02:29 | Settings, Code Editor, Text, and Drawing.
| | 02:32 | In earlier versions there are a lot more.
| | 02:35 | Flash CS6 for example has 10 categories.
| | 02:38 | Some changes have also been
made to the Properties panel.
| | 02:41 | When I click on a piece of my content,
say this monster match-up movie clip,
| | 02:46 | notice that an Accessibility section
is now included in the Properties panel.
| | 02:50 | In previous versions of Flash,
accessibility properties were in a
| | 02:53 | totally separate panel.
| | 02:55 | Also take a look at the redesigned
Filters UI in the Properties panel.
| | 03:00 | I can add and remove filters easily here.
| | 03:04 | Copying and pasting and saving and other
filter functions are under this options dropdown.
| | 03:10 | Overall, it's a simpler interface
compared to the six-button interface that
| | 03:14 | existed in previous versions.
| | 03:16 | One other place where changes have been
made is to the Photoshop and Illustrator
| | 03:19 | file import dialogs.
| | 03:21 | We'll look at those a
little later in the course.
| | 03:24 | Let's head back to that Preferences panel.
| | 03:25 | I'll go the Edit and then
Preferences to open it up.
| | 03:29 | Take a look at the new
category of Sync Settings.
| | 03:33 | Flash professional is now
integrated with Creative Cloud.
| | 03:36 | This allows you to synchronize some of
your preferences settings to Cloud and
| | 03:39 | then across a maximum of two machines.
| | 03:42 | So for instance, you could customize
some preferences on your work computer,
| | 03:46 | sync that computer with Creative Cloud,
and then have your home computer adopt
| | 03:50 | those same preferences by
synching to cloud from home.
| | 03:54 | The Sync Preferences feature allows you to
maintain a preferences backup on the cloud.
| | 03:59 | That allows you to restore it and
reuse preferences in the case of having to
| | 04:03 | reinstall Flash Professional.
| | 04:05 | As you can see, the following sets of
preferences can be synched to Creative Cloud.
| | 04:09 | Application-level preferences--so
that's basically the stuff you said in the
| | 04:14 | General, Code Editor, Text
, and Drawing categories.
| | 04:17 | Default document setting, keyboard
shortcuts, grid, guide, and snapping settings
| | 04:22 | and sprite sheet settings.
| | 04:24 | You can kick off the sync by clicking
the Sync Settings now button, or by using
| | 04:29 | the Sync Settings button in the upper
right of the Flash interface, next to the
| | 04:32 | Workspaces dropdown.
| | 04:34 | Another new feature to look for is
that you can work in full-screen mode.
| | 04:37 | To get into full-screen mode press
F11 on Windows or Ctrl+Command+F on Mac.
| | 04:43 | You could also go to View > Screen
Mode > and then Full Screen Mode.
| | 04:49 | When you do this you get a little
dialog box that explains that in full-screen
| | 04:52 | mode all the panels are hidden
and only the stage is displayed.
| | 04:56 | Go ahead and click full-screen.
| | 04:59 | As the dialog box also said, you can use F4
to display the panels or close them again.
| | 05:05 | You can also hover the pointer on
these overlay frames along the edges of the
| | 05:09 | screen to display tools,
properties, and other panels.
| | 05:13 | Alternatively, you could also use keyboard
shortcuts to toggle tools or panels on and off.
| | 05:18 | For instance, I'll press Ctrl+K for the
Aligned panel or Ctrl+L for the library.
| | 05:23 | To get out of full-screen mode, press F11
again, or the Escaped key works as well.
| | 05:28 | Next, there's some changes to how
things look when you're testing a movie.
| | 05:31 | I'm going to preview my SWF, and
you'll notice that the preview interface
| | 05:35 | now excludes menu items like File, View,
Control, and Debug that were previously there.
| | 05:41 | The functionality from those menus are not gone;
| | 05:44 | they're just in different
places or have been replaced.
| | 05:47 | If you're looking for the Bandwidth
Profiler, well, that has been taken out
| | 05:51 | of Flash completely.
| | 05:52 | But you can learn more about an alternative
called Adobe Scout later on in the course.
| | 05:56 | The items related to debugging that
used to be under the now absent Debug menu
| | 06:02 | are back in the Flash IDE,
under the Debug menu there.
| | 06:06 | So you haven't really lost
functionality from the SWF Preview panel;
| | 06:09 | the items have mostly just been moved.
| | 06:11 | Finally, there's two areas related to
performance improvements to know about.
| | 06:15 | The new version of Flash now supports
high-DPI displays, including the Retina
| | 06:19 | display that's available
on the newest Mac book Pro.
| | 06:23 | This means that icons, fonts, drawing
on stage, general content rendering,
| | 06:28 | and basically the whole IDE itself
can be displayed with that advanced
| | 06:31 | clarity and crispness.
| | 06:33 | Flash Pro Creative Cloud enables
high-DPI display on Mac by default.
| | 06:37 | But if you did something like turn
off Retina display on Mac, Flash would
| | 06:41 | replicate that change in look as well.
| | 06:44 | Finally, performance-wise, you should notice
a much faster launch time for Flash itself.
| | 06:49 | It's also 64-bit.
| | 06:50 | So you'll see a significant
reduction in the time needed for opening and
| | 06:54 | working with large files.
| | 06:56 | Even when you're using Import to Stage
and Import to Library, the dialog where
| | 07:00 | you open up your files launches more quickly.
| | 07:03 | Overall, Flash has undergone
some major retooling under the hood.
| | 07:07 | It affects you now by working faster.
| | 07:10 | But for the future, it can
integrate in new improvements and features
| | 07:14 | efficiently and still perform well.
| | 07:17 | Part of the general cleanup as well has
been to remove a number of outdated or
| | 07:20 | little-used features and functionality.
| | 07:22 | We'll go over the most significant
of those near the end of this course.
| | 07:26 | Overall, the new version of
Flash has a new look with a dark UI.
| | 07:31 | It's made an effort to
simplify and streamline the interface.
| | 07:34 | It also gives you some new tools like
the Center Stage button an unlimited
| | 07:38 | pasteboard sized and the
ability to work in full screen mode.
| | Collapse this transcript |
| Distributing and swapping multiple symbols and bitmaps| 00:00 |
There are two new things you can do in
flash, one working with multiple selected
| | 00:04 |
symbols or bitmaps.
The first has to do with swapping, the
| | 00:08 |
second has to do with distributing to key
frames.
| | 00:11 |
Working in the file called swapping.fla,
will first take a look at swapping.
| | 00:15 |
So I've got three of our monsters on the
screen here and clicking on each you can
| | 00:19 |
see in the property inspector that they
are all movie clips.
| | 00:24 |
So I've bee playing dress up with them
using some of the bit maps in the images
| | 00:27 |
file in the library.
I'll turn on the bitmaps layer in the
| | 00:30 |
timeline and you can see that this guy on
the right has some funny teeth that I've
| | 00:34 |
added and re-sized to fit.
The middle guy has this shaggy purple
| | 00:38 |
hair and the monster on the left has this
like giant third eye.
| | 00:43 |
Now that's pretty funny but I think what
all these monsters need to make them look
| | 00:47 |
good is the mustache.
So I'm gonna select all three of the
| | 00:51 |
bitmaps set once and open the Properties
panel.
| | 00:55 |
Click this Swap button and choose
mustache from the swap bit map box, I'll
| | 00:59 |
click OK and now they've all got
mustaches.
| | 01:04 |
Granted, they need to be resized and
repositioned, but the fact that we could
| | 01:07 |
swap all three at the same time is what's
new.
| | 01:11 |
In previous versions, you would have had
to swap each image out one at a time.
| | 01:15 |
Swapping multiple objects out at once
works for symbols, too.
| | 01:19 |
If I select all three of my movie clips
at once, the same process follows.
| | 01:24 |
I can click Swap in the Properties panel.
And this time I'll change all three
| | 01:29 |
monsters to Card 9, Monster N.
And there we have it, three monsters with
| | 01:33 |
dapper mustaches ready for a night out.
The only thing to remember when swapping
| | 01:39 |
multiple items is that you can't swap
bitmaps for symbols, or symbols for bitmaps.
| | 01:46 |
So the second thing that's new with Flash
when working with multiple items is the
| | 01:50 |
ability to distribute multiple objects on
a layer into individual different key frames.
| | 01:56 |
Maybe have multiple items brought into
Flash from Illustrator.
| | 02:00 |
Or maybe you've got multiple items that
you've lined up for visual placement
| | 02:03 |
single keyframe.
And now you want them in separate frames.
| | 02:07 |
Whatever, this new feature will make
being able to distribute he items to
| | 02:11 |
individual keyframes easy.
So to demonstrate, I'm going to lock the
| | 02:16 |
monsters and bitmap layers.
And unlock and turn on the distribute layer.
| | 02:20 |
So here we have some buttons.
Looking in the property inspector, we can
| | 02:25 |
see that the first three easy, medium and
hard are movie clips.
| | 02:29 |
The new game and quit are both buttons
and the monster match-up image is a bitmap.
| | 02:37 |
I'm gonna hit Ctrl+A to select all six
items.
| | 02:39 |
At this point, I right-click over any of
the items and choose the new option of
| | 02:43 |
Distribute to Keyframes and there we go.
You can see that the original key frame,
| | 02:49 |
key frame one, is left blank.
And the six items are now spread out over
| | 02:53 |
six individual key frames on the
timeline.
| | 02:57 |
So there we have it, two new enhancements
to the timeline that can save you a
| | 03:00 |
little bit of time.
The ability to swap multiple bitmaps or
| | 03:04 |
symbols at once.
And, the ability to distribute multiple
| | 03:08 |
item out to multiple key frame.
| | 03:11 |
| | Collapse this transcript |
| Managing properties for multiple layers at once| 00:00 |
The new version of Flash Professional,
now offers the ability to affect multiple
| | 00:04 |
layer properties at once.
To demonstrate what's new in the most
| | 00:08 |
clear way possible, I'll compare the
differences in behavior between Flash
| | 00:11 |
CS6, and the new version of Flash.
We'll be working with the assets that
| | 00:16 |
make up a single card from the Monster
Match Up game.
| | 00:20 |
So you can see that I've got a file
called Monster.fla, open in Flash, and
| | 00:23 |
I've drilled down into the timeline of
the movie clip symbol, called card4MonsterN.
| | 00:28 |
You can see it's got three different
folders, with the appropriate content for
| | 00:33 |
the mouth, body and head, and the
background.
| | 00:37 |
Likewise, I've got MonsterCS6.fla, open
in Flash CS6.
| | 00:42 |
And I've drilled down into the timeline
of the same card for Monster and Movie clip.
| | 00:47 |
So, first in CS6, I'll select two out of
the three folders at the same time.
| | 00:52 |
Let's say I wanna expand both of these
folders at the same time.
| | 00:56 |
So, I could right-click and notice the
option of Expand All Folders.
| | 01:00 |
Well, that's not what I want.
That would open all three folders.
| | 01:04 |
So I'm just gonna select Expand Folder.
And what happens is that just the one
| | 01:10 |
folder, the Background folder is
expanded.
| | 01:13 |
Body Head is still closed.
Compare this to the new version of Flash
| | 01:16 |
where I can again select two out of the
three folders.
| | 01:21 |
Right-click and see the new option of
Expand Folders.
| | 01:25 |
Notice it's not folder, it's folders,
talking about multiple folders and when I
| | 01:29 |
select now both the Body Head and
Background folders are open.
| | 01:35 |
So it's a subtle difference but you can
see how the new behavior is more desirable.
| | 01:39 |
Related to this, if I make sure I still
have my two folders selected, I can
| | 01:42 |
right-click and Collapse Folders and they
both close.
| | 01:47 |
Of course, back in CS6 if you
right-click, you only have the option to
| | 01:50 |
collapse a single folder at a time.
So, now I'm going to open up my
| | 01:55 |
Background folder where we've got two
layers of shadow and background.
| | 02:01 |
If I wanna turn both of these into guide
layers, your choice in CS6 is pretty much
| | 02:04 |
to change these one at a time.
One way to do it would be double clicking
| | 02:09 |
on the Layer icon, and choosing Guide in
the Layer Properties box.
| | 02:15 |
Another option to get that same Layer
Properties box is right-click the layer,
| | 02:18 |
and choose Properties.
I'm going to cancel out of that.
| | 02:22 |
You could just right-click the layer and
select Guide.
| | 02:26 |
In the new version of Flash, you can
change both layers into guides and back
| | 02:30 |
at the same time.
I'm gonna select both the background and
| | 02:34 |
the shadow layer, right-click and choose
Guide.
| | 02:37 |
And you can see that they're both turned
into guides.
| | 02:41 |
Similarly, you could select both layers.
Right-click again and choose Properties
| | 02:45 |
and turn them both back into normal
layers this way.
| | 02:49 |
So toggling to guide layers and back for
more than one layer at the time is easy.
| | 02:54 |
A similar thing exists in the new version
of Flash for toggling multiple layers
| | 02:57 |
into mask layers.
So I'm going to open up the Mouth folder
| | 03:01 |
and mess up some of the layers here for
sake of demonstration.
| | 03:05 |
I'm gonna lock and hide the Mouth layer
because we won't be using that.
| | 03:09 |
Now, I'll turn the top layer, the Teeth
mask layer, into a regular layer, and
| | 03:13 |
when I do, the masked layers beneath it
turn into regular layers as well.
| | 03:18 |
So now, I'm gonna turn just the top layer
into a mask.
| | 03:21 |
I'm gonna right-click and choose Mask to
do that.
| | 03:26 |
So, we now have a mask layer, and a
masked layer.
| | 03:30 |
And now let's say we want to turn these
other two into masked layers as well.
| | 03:34 |
Instead of changing them separately like
you have to in CS6, I can select both at
| | 03:38 |
the same time, right-click, choose Layer
Properties, and choose Masked.
| | 03:43 |
And they're both masked layers, a nice
little time saver.
| | 03:48 |
So the new version of Flash Professional
makes it easy to toggle masks and guides
| | 03:52 |
on and off for multiple layers at once.
| | 03:55 |
| | Collapse this transcript |
|
|
2. Importing, Graphics Manipulation, and Video ExportSimplified Photoshop and Illustrator file import| 00:00 |
When importing in both Illustrator and
Photoshop files, the file import dialogue
| | 00:04 |
you see has been greatly simplified in
the new version of Flash.
| | 00:09 |
Let's take a look first at Photoshop
files starting in Flash CS6, so we can
| | 00:12 |
compare against what the new dialogue
looks like.
| | 00:16 |
So in Flash CS6, using a blank FLA file,
I'll choose File>Import>Import to stage,
| | 00:21 |
or of course Import to library will work
as well.
| | 00:26 |
And then for our example, choose the file
called banner_recipe.psd.
| | 00:31 |
As you've probably seen in the past, you
have this layer preview pane that allows
| | 00:35 |
you to select each layer separately.
For this layer called print recipe, which
| | 00:40 |
is a text layer, I have the option to
import the layer as editable text, vector
| | 00:43 |
outlines or a flatten bitmap image.
Of course there are a number of other
| | 00:49 |
options I can affect lower in the
dialogue as well.
| | 00:52 |
For non text layers, like the Printer
layer, some of the choices I could make
| | 00:56 |
here include importing the layer as a bit
map with editable layer styles or, a
| | 01:00 |
flattened bit map image.
The point is really that you can affect
| | 01:05 |
each layer separately.
Compare this to the new version of Flash.
| | 01:10 |
I'll import the same banner_recipe.psd
file.
| | 01:13 |
The import process is still the same.
File > Import > Import to Stage.
| | 01:19 |
But once I've selected my file, you'll
notice right away that the layer preview
| | 01:22 |
pane is gone.
You can't step through the individual
| | 01:26 |
layers of the PSD file anymore.
So the choices you make in this import
| | 01:29 |
dialog are applied to all the layers.
The options for Layers, that were
| | 01:34 |
presented in CS 6, have been condensed to
maintain editable pass and effects, or a
| | 01:38 |
single flattened bit map.
The options for Text layers are the same
| | 01:43 |
as they were in CS 6, Editable Text,
Vector Outlines, or a Flattened Bit Map image.
| | 01:49 |
But of course, by making your selection
here, you're affecting all the text layers.
| | 01:53 |
So you can see that the import dialogue
really has been simplified.
| | 01:57 |
And those same principles have been
applied to the import dialogue for
| | 02:00 |
Illustrator files.
I'll start importing the file called
| | 02:05 |
giraffe.ai in Flash CS6, so we can
compare again.
| | 02:09 |
So I'll go to File>Import>Import to Stage
and choose giraffe.ai.
| | 02:15 |
And again, we can select individual
layers and affect the settings for them
| | 02:18 |
one by one.
For instance, this pos4 layer, I could
| | 02:21 |
import as bitmap, or create movie clip.
For this first path layer, I could import
| | 02:26 |
as editable path, or bitmap.
Now I'll inport the same file into the
| | 02:30 |
new version of Flash.
And again you can see that the choices
| | 02:37 |
have been condensed into sections for
layers and text layers but you can't
| | 02:41 |
affect indivisual layers one at a time.
Beyond this point things aren't really different.
| | 02:47 |
I'm just gonna click Okay and my visual
assets are imported in.
| | 02:51 |
And I'm on my way.
The only other thing to note is that for
| | 02:55 |
both PSD and AI files hidden layers
bundled into a layer comp stay hidden.
| | 03:02 |
They can't be selected or edited when
importing a file.
| | 03:05 |
So again, for both illustrator and
Photoshop files, the choices in the file
| | 03:09 |
import dialogue has been greatly
simplified in the new version of Flash.
| | 03:13 |
.
| | 03:13 |
| | Collapse this transcript |
| Scaling content to predefined anchor points| 00:00 |
In Flash, you can now pin visual assets
to predefined anchor points on the stage,
| | 00:04 |
when scaling the stage size.
Well here's what I mean, in the file
| | 00:08 |
called scaleTimelineAnimation.fla, we
have some simple animation.
| | 00:11 |
The background image that says Monster
Match-up animates in, and then movie
| | 00:16 |
clips that contain animation for a
variety of different monsters, appear in
| | 00:20 |
succession, as you move on down the
timeline.
| | 00:25 |
So when I click on the paste board, you
can see that we're at a stage size of 800
| | 00:29 |
by 480.
To help us see how our stage scaling is
| | 00:33 |
going to affect things, I've got ruler
guides along the right an bottom edges of
| | 00:36 |
the stage.
So I'm going to zoom out to about 25%, so
| | 00:41 |
we can really see what happens when we
scale the stage.
| | 00:45 |
We're going to try a pretty dramatic
change in stage dimension to something
| | 00:49 |
really big like 1920 X 1080.
So, in the properties panel for the
| | 00:54 |
document, I'm going to click the wrench
next to the size fields to bring up the
| | 00:57 |
document settings panel.
Here I'm gonna type in my new stage
| | 01:02 |
dimensions of 1,920 by 1,080.
Here's the choice to scale content.
| | 01:07 |
I'm gonna check the check-box, an when I
do, the option to scale locked an hidden
| | 01:11 |
layers is enabled.
Now that's fine.
| | 01:14 |
Down here, Anchor, is the new option,
where we can choose the location of the
| | 01:18 |
anchor point, that we want our content to
scale from.
| | 01:22 |
And just so we have something to compare
against for next time, I'm not going to
| | 01:25 |
choose any anchor point.
I'm going to click OK and we can see the
| | 01:29 |
new stage size as well as the content
having scaled proportionally as well.
| | 01:34 |
It's in the same relative location to
where it was at the smaller stage size.
| | 01:39 |
I'm going to undo out of this so that we
go back to original sizes.
| | 01:43 |
Let's compare this to scaling with an
anchor point chosen.
| | 01:46 |
So I'm gonna click on the wrench again,
change the stage size to 1920 by 1080 again.
| | 01:52 |
Check Scale Content, and this time I'm
gonna choose to scale out and down from
| | 01:56 |
the upper left.
When I click OK, we can see the new stage
| | 02:00 |
size, as well as the content having
scaled proportionally.
| | 02:04 |
This time since we chose the scale from
the upper left and go out and down, all
| | 02:08 |
the visual assets still appear on the
stage, but relative to that upper left
| | 02:12 |
anchor point.
I'm gonna Ctrl + Z out of the one last
| | 02:17 |
time, so we go back to our original
sizes.
| | 02:19 |
Let's compare this to a different
setting.
| | 02:22 |
So I'm gonna click the wrench again.
Change the stage size to 1920 by 1080 again.
| | 02:27 |
Check Scale Content.
And this time choose the anchor point on
| | 02:32 |
the lower right.
So our content will scale up and to the left.
| | 02:36 |
When I click OK, the content has scaled
up again proportional to the new stage
| | 02:40 |
size, but since the anchor point was at
the bottom right, everything blew up and
| | 02:43 |
to the left.
So some of the content actually bleeds
| | 02:48 |
off the stage this time.
Note also that as I move the play head
| | 02:51 |
down the time line, the scale change has
also been applied to all the other movie
| | 02:55 |
clips on the stage.
So in the new version of Flash
| | 02:59 |
Professional, you now have the option to
set an anchor point from which your
| | 03:03 |
content should scale when resizing the
state.
| | 03:07 |
| | Collapse this transcript |
| Live preview for drawing tools| 00:00 |
In the new version of Flash, you can now
instantly preview a shape, when using the
| | 00:04 |
Drawing tools.
To demonstrate what this means in Flash
| | 00:08 |
CS6, I'm going to draw an oval.
Notice how as I Click and Drag to draw,
| | 00:12 |
only the outlines of the shape are
visible.
| | 00:15 |
You can see the Stroke and Fill colors,
only when I release the mouse.
| | 00:20 |
When I draw an oval in the new version of
Flash, you'll notice that while I'm
| | 00:23 |
drawing the Outline is visible, but so is
the Stroke and Fill color.
| | 00:28 |
This live preview feature is enabled for
most of the drawing tools in Flash.
| | 00:32 |
| | Collapse this transcript |
| Improved features and workflow for exporting video| 00:00 |
With previous versions of Flash, you can
export content to SWF, AVI, and MOV files.
| | 00:07 |
However this process was not as easy as
point-and-click.
| | 00:10 |
You had to work with things like being
dependent on third-party libraries or
| | 00:14 |
movie clips not being supported.
Flash has improved on these tripping points.
| | 00:18 |
The first thing to note, is the new work
flow, in which you can export MLV files,
| | 00:22 |
directly from within flash.
Note that the only choice, is MLV files.
| | 00:27 |
If you then want to convert the MLV to
another format, the next step is to use
| | 00:31 |
Adobe Media Encoder, to do that.
Other improvements include built in
| | 00:37 |
support for animation, using nested movie
clips and ActionScript-driven animations,
| | 00:41 |
easily adding in an alpha channel to
replace your stage background color and
| | 00:45 |
being able to expect high quality video
that doesn't drop frames.
| | 00:51 |
So, your exported video should match your
SWF.
| | 00:54 |
I've got the file called
videoTimeline.fla open to demonstrate
| | 00:57 |
many of the new features.
Basically, this file shows the monsters
| | 01:01 |
used in the game in succession.
I'll test my movie so we can take a quick
| | 01:05 |
look at the first few seconds of the
animation.
| | 01:08 |
Overall, the whole timeline lasts about
33 seconds.
| | 01:11 |
(NOISE) (NOISE) (MUSIC) Taking a quick
look at the FLA file, we see that the
| | 01:19 |
Intro Screen and Monsters Layer have some
simple motion tweens /g.
| | 01:30 |
Basically, The Monster Match-Up logo
animating in, followed by a monster,
| | 01:34 |
which is a movie clip.
Sliding on down the time line, we see
| | 01:37 |
that additional monsters, again, all
movie clips appear on the screen at
| | 01:40 |
different points.
Notice the audio layer, which has little
| | 01:44 |
audio clips times with the appearance of
each monster.
| | 01:47 |
Also, notice the stage size of 800 by
480, as well as the really awful green
| | 01:51 |
stage background color.
That's there so we can see down the line
| | 01:56 |
how it goes away when we embedded an
alpha channel.
| | 01:59 |
So the next step's to export this out to
MOV, or to go to File> Export> Export Video.
| | 02:05 |
On the resulting dialog box, notice that
your render width and heighth match the
| | 02:09 |
stage size and you can't change it.
We can click the checkbox to ignore the
| | 02:14 |
stage color and then code in an alpha
channel instead.
| | 02:18 |
Checking Convert Video in Adobe Media
Encoder simply tells Flash to open up the
| | 02:22 |
exported MOV in Media Encoder when it's
done exporting out.
| | 02:27 |
It basically just saves you the steps of
encoding it yourself.
| | 02:31 |
You can choose if the video export should
end when the last frame is reached or you
| | 02:34 |
can specify a specific point in time that
you want it to stop at.
| | 02:39 |
Finally, of course, it's a good idea to
double check the path to where you want
| | 02:42 |
to save the video.
When I click Export, you see a progress
| | 02:46 |
box telling us that it's recording Flash
content.
| | 02:49 |
After a few moments, the export is done
and Adobe Media Encoder opens up automatically.
| | 02:55 |
From here you can go on to export out to
whatever end format you may need.
| | 02:59 |
For now, I'll just go to my file explorer
and open up the exported MOV file.
| | 03:04 |
Watching it you can see that the
animations and sounds are smooth and look
| | 03:06 |
pretty much the same way the SWF did.
The biggest difference to note is the
| | 03:11 |
black background.
The green stage color has been replaced
| | 03:14 |
with an alpha channel.
Let's take a quick look at how the export
| | 03:18 |
process works for ActionScript driven
animation.
| | 03:21 |
I'm gonna open the file called
VideoAs.fla.
| | 03:25 |
In this file, the main timeline is only
one frame long.
| | 03:28 |
With the action script that controls it
on the actions layer.
| | 03:31 |
We're not really going to look at the
code.
| | 03:33 |
The important thing is that when I test
my movie, the end animation and audio in
| | 03:36 |
this file are about the same as the one
we just worked with.
| | 03:39 |
(SOUND) The export to MOV process is
similar to before as well.
| | 03:54 |
I'll choose file export then export
video.
| | 03:57 |
I'm going to uncheck convert video in
adobe media encoder since we've already
| | 04:01 |
seen how that works.
The thing to do differently this time, is
| | 04:05 |
instead of choosing, stop exporting when
the last frame is reached, choose stop
| | 04:09 |
exporting after time elapsed.
I know the total length of my action
| | 04:14 |
script driven animations is about 33
seconds, so I'll type 33.00.
| | 04:19 |
Since hours an minutes aren't relevant, I
can just leave that bit off.
| | 04:23 |
Its also important to double check the
location the MOV file is going to be
| | 04:27 |
exported to.
You'll notice its still pointing to the
| | 04:30 |
video timeline folder and I want this MOV
file to end up in the videoAS folder.
| | 04:37 |
With that I'll click to export flash
things about it for just a few moments
| | 04:40 |
and now I can go to my file explorer,
open up my MOV file and view the results.
| | 04:46 |
You can see that the ActionScript driven
animation is exported just fine.
| | 04:50 |
(MUSIC).
There are of course a million different
| | 05:04 |
things that you might be looking for when
trying this out on your own files.
| | 05:08 |
Perhaps your sounds are set to stream on
the timeline.
| | 05:10 |
Maybe you have files with stage
dimensions much larger than this example.
| | 05:15 |
Or perhaps HD quality video is your
intended output.
| | 05:18 |
These are all handled by the new
workflow.
| | 05:21 |
So, Flash Professional has provided a new
work flow for exporting high quality
| | 05:25 |
videos that simplies the steps to Adobe
Media Encoder, supports nested movie clip
| | 05:29 |
animation, ActionScript driven animation,
alpha channels, and won't drop frames.
| | 05:36 |
| | Collapse this transcript |
|
|
3. Coding and Streamlining ContentUsing the new code editor| 00:00 |
In this version of Flash Professional,
the old ActionScript editor has been
| | 00:03 |
replaced with a new one.
The new code editor is a port of
| | 00:07 |
Sentilla, which is an open source code
editing component.
| | 00:11 |
To demonstrate a few things about how the
new editor works, I've got Monster.fla
| | 00:16 |
open as well as Main.as and Card.as.
Looking in the Properties panel for the
| | 00:22 |
FLA, you can see that Main is the
document class.
| | 00:26 |
In our file structure, it's in the same
directory as the FLA.
| | 00:29 |
Car.as is a custom class that's a few
directories further down, in the com then
| | 00:34 |
monstermatch, then animation folder.
So I'm gonna start by clicking on frame
| | 00:42 |
one of the time line and hitting F9 to
open the Actions panel.
| | 00:46 |
The first thing you'll probably notice is
that the new code editor is more sparse
| | 00:49 |
than the previous one.
Buttons like Checks and Text, Auto
| | 00:53 |
format, and so on, are gone.
The options you do have are to Insert
| | 00:57 |
Instance Path and Name.
The Find and Replace, which we'll talk
| | 01:02 |
about in detail in a different movie,
Code Snippets, and Help.
| | 01:06 |
Here in this left panel of the editor,
what was known as the Actions Toolbox is gone.
| | 01:10 |
In previous versions such as CS6, this
was a clickable reference to built-in
| | 01:15 |
ActionScript classes.
Now, one behavior in the new editor has
| | 01:19 |
to do with single-line versus multi-line
comments.
| | 01:23 |
This new editor uses the multi-line
commenting syntax regardless of how many
| | 01:26 |
lines of code you're trying to comment.
For instance, if I select two lines of
| | 01:31 |
code, right-click and choose Comment
Selection, the slashes and asterisks
| | 01:34 |
appear at the appropriate places for a
multi-line comment as you'd expect.
| | 01:40 |
I'm gonna undo that.
Now if I highlight just one line of code,
| | 01:43 |
right-click and choose Comment Selection,
I still get the slash asterisks format.
| | 01:49 |
I'm gonna hit Ctrl+Z to undo that.
Now you can of course, still type in
| | 01:53 |
single line comments like so but when
using the Context menu like I just
| | 01:56 |
showed, you'll always end up with the
multi-line comments syntax.
| | 02:00 |
Now I'm going to remove this comment as
well.
| | 02:04 |
One useful feature of the editor is a red
line down the left hand side, and the
| | 02:07 |
ability to collapse and expand blocks of
code.
| | 02:11 |
For instance, if I click somewhere within
this nested if statement, the red line on
| | 02:15 |
the left side of the screen, indicates
the block of code that makes up the if
| | 02:19 |
statement between lines 14 and 23.
Compare this to if I click within the
| | 02:24 |
opening curly brace of the outer if
statement.
| | 02:27 |
The red line encompasses everything
within that block of code.
| | 02:30 |
Or, I could click within the opening line
of the function definition and have the
| | 02:34 |
entire function indicated by the red
line.
| | 02:37 |
I can then also click on the contract and
expand toggle to hide or show blocks of code.
| | 02:44 |
When you've got a zillion lines of code,
this can be really useful to help focus
| | 02:47 |
in on one area or another, of your
script.
| | 02:50 |
Now there is a trick to point out to make
sure that code hinting works for you.
| | 02:54 |
In a frame script like the one we're
looking at here that's attached to frame
| | 02:58 |
one, in the FLA, you don't really have to
worry about it.
| | 03:01 |
For instance, I could type in a couple
lines of code here that I'm gonna declare
| | 03:06 |
a MovieClip instance.
And already you can see that my code
| | 03:10 |
hinting is working.
And on my next line, I'll type in myMC.,
| | 03:15 |
and here you can see all the methods and
properties of MovieClip.
| | 03:23 |
So I'm gonna delete that and again,
working within a frame script is not
| | 03:26 |
where you have to be careful.
It's where you're working in an external
| | 03:29 |
ActionScript file.
I'm gonna switch over to the Main.as
| | 03:33 |
ActionScript file.
And first off, before we do anything.
| | 03:37 |
Notice that this Main.as class is
importing the custom class called Card.
| | 03:43 |
So Main can access all the methods and
properties defined in Card.
| | 03:47 |
Now a little further down, on about line
47, we see an instance of that card class
| | 03:51 |
being created.
It's being referred to by the name of
| | 03:55 |
card with a lower case c.
Now let's say I wanna create a new
| | 03:59 |
variable just inside the start of this
class definition.
| | 04:02 |
So let's say around line 57 here, with
these other variable declarations.
| | 04:07 |
So I'll type in private, var, myMC, and
I'll data type it as a MovieClip, and
| | 04:12 |
there's my code hinting, already working.
And I can type in again, myMC., and
| | 04:19 |
again, there's all our methods and
properties for MovieClip.
| | 04:24 |
So I'm gonna get rid of line 58 there.
And now scroll down to about line 388.
| | 04:29 |
Here you can see that card instance that
we just pointed out being used.
| | 04:38 |
And if I wanna add some code to this, I
could type in card., and here's my code
| | 04:42 |
hinting, with all my methods and classes.
Notice here's a method called callbackEndAn.
| | 04:49 |
If we flip over to Card.as, here's that
function declared right here.
| | 04:54 |
So clearly, our code hinting is working.
And that's all well and good.
| | 04:57 |
But the thing to know is that for code
hinting to continue to work, I have to
| | 05:01 |
have the FLA open and that FLA has to be
associated with these ActionScript files.
| | 05:07 |
So it could be associated via the
document class, like Main is for Monster.fla.
| | 05:13 |
The FLA and ActionScript files could also
be associated through a classpath that
| | 05:17 |
you've set up for an individual FLA.
You do that in the ActionScripts settings.
| | 05:24 |
It could also be associated through a
classpath that you've set up to affect
| | 05:27 |
all files through the Flash Preferences.
I'm talking about the one you find when
| | 05:32 |
you go to the Edit menu, or the Flash
menu if you're on Mac, and then Preferences.
| | 05:36 |
Then look in the ActionScript 3 settings
in the code editor area.
| | 05:44 |
Now watch what happens when I close the
FLA.
| | 05:48 |
If I go back to the Main.as file and try
typing in card., the code hinting is gone.
| | 05:56 |
I'll go back up to the top, where we were
working before.
| | 05:59 |
So I'm gonna retype this line and even
when trying to instantiate one of the
| | 06:04 |
most fundamental classes, MovieClip.
You can see again that the code hinting
| | 06:10 |
is not working.
So the take away is basically to make
| | 06:14 |
sure that when working in an
ActionScript.as file within the new
| | 06:17 |
version of Flash, make sure you have an
FLA that's been associated with that
| | 06:20 |
ActionScript file open.
That will ensure that your code hinting
| | 06:26 |
is going to work.
There is a known issue with the new code
| | 06:29 |
editor and code hinting.
When there are a large number of files
| | 06:33 |
present in the classpath of the FLA, code
hinting doesn't work.
| | 06:37 |
To resolve this you can go to the Flash
preferences, that's the Edit menu and
| | 06:40 |
then Preferences.
Of course, on Mac that's under the Flash
| | 06:44 |
menu and then Preferences.
Then in the code editor area.
| | 06:48 |
Increase the number of cache files to a
larger number.
| | 06:51 |
You could also consider deleting or
moving unwanted or unused files from the
| | 06:55 |
classpath of the FLA.
While we're here in the Flash preferences
| | 06:59 |
for the code editor, I'd like to quickly
point out that you have at the bottom of
| | 07:02 |
the screen a button for ActionScript 3
settings.
| | 07:06 |
That's because support for ActionScript 1
and 2 has been completely dropped from Flash.
| | 07:12 |
I'll talk a little bit more about that
later on in this course.
| | 07:14 |
So we've had to look at the new code
editor in Flash.
| | 07:18 |
While several smaller things are
different in this editor as compared to
| | 07:21 |
the editor in previous versions of Flash.
Probably the biggest thing to remember
| | 07:26 |
about it, is the trick we just saw of
keeping an associated FLA file open.
| | 07:31 |
While working in ActionScript files.
| | 07:33 |
| | Collapse this transcript |
| Using cross-file Find and Replace| 00:00 |
The Find and Replace functionality in
Flash has been changed in a number of
| | 00:03 |
ways in the most recent version.
To demonstrate, I've opened Monster.fla
| | 00:08 |
and the main.as ActionScript file in
Flash.
| | 00:12 |
In the fla, I'll start by opening the
Actions Panel for the script that's
| | 00:15 |
located on frame one.
To open up find and replace here, I can
| | 00:20 |
hit Ctrl+f or Cmd+f on a Mac, or I can
click the magnifying glass icon.
| | 00:25 |
To open up, Find and Replace.
So interface is pretty simple, and
| | 00:28 |
different from previous versions.
I can type in my search term here, I'll
| | 00:33 |
put in options, and I can use the arrows
to step through the different instances
| | 00:36 |
of this word in the code.
To Find and Replace, you just open the
| | 00:41 |
drop down, and choose Find and Replace.
You can also see that the dialog updates
| | 00:45 |
with the field to put what text you want
to replace with.
| | 00:50 |
And, you also get the Replace or Replace
All buttons, clicking the Cog icon,
| | 00:53 |
affords me the options of whole word, or
match case.
| | 00:58 |
Once you've opened up Find and Replace,
in the dropdown, and the choices of a
| | 01:01 |
whole word and match case, Flash will
remember that, and have them open for you
| | 01:05 |
next you use Find and Replace.
So that's like, the super simple Find and
| | 01:11 |
Replace for code in the ActionScript page
just as in previous versions of Flash,
| | 01:15 |
there's also the Advanced Find and
Replace dialogue box that can find more
| | 01:18 |
than just text.
To get there from here, we click the
| | 01:22 |
Advanced button.
This is the same panel you'd get if you
| | 01:26 |
went to Edit>Find and Replace or if you
hit Ctrl+f or Cmd+f.
| | 01:32 |
If you are outside the Actions Panel, so
I'll get the Actions Panel out of the way
| | 01:35 |
and open up the options and results
accordion in Find and Replace so you can
| | 01:38 |
see all the options.
So one of the biggest changes from
| | 01:43 |
previous versions of Flash is in this top
search drop down to specify if you're
| | 01:47 |
looking for code or other text.
In previous version of Flash, this was
| | 01:52 |
all lumped together.
So I'll change the drop-down to Text and
| | 01:56 |
type in the word easy.
Notice that Text, Fields, Contents is
| | 02:01 |
selected, as well as Frames, Layers,
Parameters.
| | 02:05 |
When I find all, three results present
themselves.
| | 02:09 |
When I click the first one, we're taken
to the timeline of the intro screen
| | 02:13 |
symbol, and it points out the easy_btn
layer.
| | 02:17 |
The second result, take us to a layer
called easy, within the easy button movie clip.
| | 02:24 |
The third result, takes us to the actual
text in the Text Box that says easy.
| | 02:29 |
So that's great.
Now what if I change the search from text
| | 02:32 |
to code?
When I find all the text options that we
| | 02:36 |
saw before are excluded and well there
isn't any action script code in the FLA
| | 02:39 |
that uses the word easy.
Well may be easy is used elsewhere in our project.
| | 02:47 |
So here's the other largest change to
find and replace.
| | 02:50 |
In previous versions, this context drop
down only gave the choice of current
| | 02:54 |
document or current scene.
In the newest version, we've also got the
| | 02:59 |
choices of current frame or all open
files.
| | 03:02 |
I'm gonna choose all open files and click
find all.
| | 03:05 |
And now you can see that we've got about
a million places in the main.as document
| | 03:09 |
that utilize the word easy.
So, Flash now gives us the ability to
| | 03:13 |
find and replace across files.
So, most of the changes to the Find and
| | 03:18 |
Replace functionality are simply a
difference in the layout of the interface.
| | 03:23 |
The most significant additions are the
ability to differentiate between
| | 03:26 |
searching through text versus code, as
well as being able to do a cross file
| | 03:30 |
Find and Replace.
| | 03:33 |
| | Collapse this transcript |
| Enabling advanced telemetry data within Flash for Scout| 00:00 |
Adobe Scout is the newest profiling tool
for Flash content running on both the
| | 00:04 |
desktop through Flash Player and on
mobile devices using Adobe AIR.
| | 00:09 |
In this movie, I'll give a brief overview
of what Scout does, and offer some
| | 00:12 |
resources if you haven't tried it.
If you have used Scout before, that won't
| | 00:17 |
be new to you, but I will show you the
new feature in Flash, that allows you to
| | 00:20 |
easily enable advanced telemetry.
So, Scout, itself, isn't new, it was
| | 00:26 |
known as Project Monocle for some time in
Adobe Labs, and was released as Scout in
| | 00:30 |
late 2012 as part of the Creative Cloud
game developer tools.
| | 00:36 |
Scout relies on a feature called
telemetry, that was introduced in Flash
| | 00:40 |
Player 11.4 and Adobe AIR 3.4.
This feature gathers detailed information
| | 00:45 |
about the internals of the Flash run time
and the action script code that it executes.
| | 00:51 |
Then, it sends all that out to Scout.
Scout presents this data graphically, so
| | 00:55 |
that you can quickly diagnose performance
problems with your content.
| | 00:59 |
Performance problems like potential
dropped frames or memory leaks.
| | 01:03 |
All you need to use Scout is the software
itself as well as the SWF.
| | 01:07 |
And or webpage that your users will be
running.
| | 01:10 |
You don't need a special debugger version
of Flash Player.
| | 01:14 |
You simply launch your content, it can be
inside a browser, through the stand-alone
| | 01:18 |
version of Flash Player, or through Adobe
AIR, and then the related data simply
| | 01:21 |
appears in Scout.
There's also, a slightly different
| | 01:26 |
workflow for mobile called Remote
Profiling, where Scout and the test SWF
| | 01:30 |
run on two separate machines.
For this movie, I'm just gonna
| | 01:34 |
demonstrate Scout and my test SWF on one
machine.
| | 01:39 |
I've got Scout downloaded and open and
you can see all the different types of
| | 01:42 |
data that are available to us.
You'll notice that the basic telemetry
| | 01:47 |
option is grayed out.
That's the data collected by default.
| | 01:51 |
The rest of the choices are optional.
So, I also have our Monster Match-Up game
| | 01:54 |
and I'll go ahead and hit Control > Enter
to preview my SWF.
| | 01:58 |
I'll rearrange my screen here so we can
see Scout in the background and the game
| | 02:01 |
in the front.
As I start playing the game, you can see
| | 02:05 |
data starting to fill in in Scout.
So I'll just play to the end of one easy round.
| | 02:21 |
And so you can see the information that
Scout tells us here.
| | 02:24 |
For instance, here in this area marked
Framed Timeline, the red line represents
| | 02:28 |
the budget time that we have to keep
below on each frame if we want to meet
| | 02:32 |
the frame rate we want to achieve.
For our SWF running at 20 frames per
| | 02:38 |
second, we have a budget of 50
milliseconds per frame.
| | 02:41 |
If we spend more than 50 milliseconds per
frame our game will start stuttering and
| | 02:45 |
skipping frames.
And, we can see that, for the most part,
| | 02:48 |
our game stays below budget, and should
play just fine.
| | 02:52 |
The individual bars are also color coded
depending on how much time is spent on
| | 02:56 |
what tasks.
We can see in this key over here on the
| | 02:59 |
right, that time spent time dealing with
Action Script is blue, Display List
| | 03:02 |
Rendering is green, and so on.
So that's the basic default level of
| | 03:07 |
information that you get.
Notice that while we selected all these
| | 03:11 |
different other types of information on
the left, like Action Script Sampler and
| | 03:15 |
CPU Usage, that information hasn't come
through.
| | 03:19 |
For instance, if I click in this area
that displays details about Action
| | 03:22 |
Script, nothing shows up.
To access all the data that's available,
| | 03:26 |
we need to Enable Advance Telemetry on
the SWF.
| | 03:30 |
And then have Scout collect the data
again.
| | 03:32 |
The reason Adobe doesn't expose all this
information by default is to prevent
| | 03:36 |
other people from using Scout to easily
acquire these details about your content.
| | 03:41 |
Up to this point, Enabling Advanced
Telemetry in Flash Builder 4.7 was a
| | 03:45 |
matter of clicks.
In Flash it wasn't so straightforward.
| | 03:50 |
You had to go through a couple of steps
involving an outside Python Script.
| | 03:54 |
Now, in this version of Flash, Enabling
Advanced Telemetry for Scout is also a
| | 03:57 |
matter of just a few clicks.
So, I'm gonna get rid of this data here.
| | 04:05 |
Now, I'll move back to my FLA.
Notice we're targeting Air 3.6 for iOS here.
| | 04:11 |
I've chosen that because there's two
places you need to make changes for iOS.
| | 04:16 |
Everything else needs a change in just
one spot.
| | 04:19 |
So that one spot that you need to modify
for all outputs, is under the File Menu,
| | 04:22 |
then Publish Settings.
Then in the Options for SWF, Open the
| | 04:27 |
Advanced area, and simply click Enable
Detailed Telemetry.
| | 04:32 |
Notice you can also choose to provide a
password.
| | 04:35 |
If you do this, you can access the
Detailed Telemetry data for your
| | 04:38 |
Application in Scout.
Only after you've provided that same password.
| | 04:43 |
For now, I'm gonna Click Okay.
For the second spot you need to change,
| | 04:46 |
if you're publishing for iOS devices, is
in the Properties Panel.
| | 04:50 |
So I'm gonna Click the Wrench Icon next
to the Target Dropdown.
| | 04:54 |
On the Air for iOS Settings Dialogue, I'm
gonna switch to the Deployment Tab.
| | 05:00 |
Then, I'm gonna simply select the Enable
Sampler Option down in the Telemetry
| | 05:04 |
Options section and then Click Okay.
With that, I can test my movie again from Flash.
| | 05:10 |
And again, I'll rearrange my screens so
we can see Scout collecting data in the
| | 05:14 |
background while I play the game.
I'll do the same thing.
| | 05:17 |
I'll just play one easy round of the
game.
| | 05:27 |
So I'll close my SWF and go back to
Scout.
| | 05:29 |
This time, since I Enabled the Advanced
Telemetry Settings, now when I look and
| | 05:33 |
say the Action Script Panel below, I can
see some information about the Action
| | 05:36 |
Script that executed during this
particular section on the Frame Timeline.
| | 05:43 |
I'm not gonna go over all the different
other types of data, but you get the idea
| | 05:46 |
that there is more information to help us
profile the performance of our projects.
| | 05:51 |
So now, you can turn on Advanced
Telemetry for Scout, from within Flash.
| | 05:55 |
Again, Scout, isn't the new feature, it's
the ability to turn on the Advanced
| | 05:59 |
Telemetry for Scout from within Flash.
Also, a quick note, that as of the time
| | 06:04 |
of this recording, the full version of
Scout is free for a limited time.
| | 06:09 |
It's part of the Creative Cloud game
developer tools.
| | 06:13 |
That basically boils down to it's free
for Creative Cloud subscribers.
| | 06:17 |
In the future, Scout will transition to a
paid offering.
| | 06:19 |
But, it will still be available for free.
With the Advanced Telemetry features disabled.
| | 06:24 |
Finally, if you'd like more information
on how to get started with Scout, or more
| | 06:28 |
on how to interpret the data that it
shows you, check out these resources.
| | 06:33 |
The first is where to actually download
Scout.
| | 06:37 |
This second page is a great getting
started article.
| | 06:41 |
Here's some information about using Scout
with Flash Builder.
| | 06:44 |
And finally, here's a more advanced
article on how Scout and Flash Player
| | 06:48 |
work together.
| | 06:49 |
| | Collapse this transcript |
| Utilizing JSAPI improvements| 00:00 |
Flash provides a set of commands and
functions that you can use to write your
| | 00:04 |
own little reusable codes snippets, to
automate a task.
| | 00:08 |
They extend regular JavaScript to include
the Flash document object model.
| | 00:13 |
Since they extend Java Script, the
commands and functions available for you
| | 00:17 |
are commonly referred to as JSAPI's.
The JS of course referring to JavaScript.
| | 00:22 |
You use the JSAPIs to create your own
reusable Flash JavaScript code snippet
| | 00:27 |
files, which have the extension of JSFL.
There's some new ways to use JSFL files
| | 00:32 |
in Flash, so to demonstrate I'm using the
file called MosterSmallLibrary.fla.
| | 00:37 |
But there's nothing on the stage but if
you look in the library in the Cards
| | 00:42 |
folder we have two monsters.
One of them is this little flying monster
| | 00:47 |
and the second one is a teddy bear
monster.
| | 00:52 |
Notice that we also have a number of
symbols in the Screens folder that are
| | 00:55 |
used to make these monsters animations.
So, let's say I want to export out a
| | 01:01 |
Sprite Sheet of these monsters using
JSFL.
| | 01:04 |
I've opened the file called Sprite Sheet
Generator Ex.jsfl.
| | 01:09 |
This file will go through your library.
And export each symbol out to a Sprite Sheet.
| | 01:13 |
Scrolling through, there's a lot of
options that are available like what data
| | 01:17 |
format you want to use like Starling or
Json.
| | 01:21 |
That's on line 50.
You can choose whether to trim or stack
| | 01:23 |
the frames.
You can effect the shape, padding, and
| | 01:26 |
border padding and so on.
These are the same features that you can
| | 01:30 |
set when you export a Sprite Sheet out
from this stage or the library.
| | 01:33 |
So at the bottom of the code where it
says exporter.export Sprite Sheet this
| | 01:37 |
tells flash where I wanna put the
exported Sprite Sheet.
| | 01:41 |
You can see that I'll be exporting my
spreadsheet out to a folder called test
| | 01:45 |
that's sitting in the c drive of my
computer.
| | 01:50 |
And here my File Explorer, you can see
that the test folder is already to go.
| | 01:54 |
So to use this JSFL file.
You would have to replace the path that I
| | 01:58 |
have here.
C:\test.
| | 02:02 |
With the path on your computer.
Where you want the Sprite Sheet to go for you.
| | 02:06 |
Notice the part at the end that says
JSAPI Monster.
| | 02:09 |
That's going to be the name of the
exported Sprite Sheet.
| | 02:12 |
Here where it says PNG, you can choose to
make the Sprite Sheet a PNG or a JPEG.
| | 02:17 |
So here's one way to use this JSFL.
The method itself isn't new.
| | 02:22 |
But the way I behaves as that works is.
So I'll make sure that I have my FLA open
| | 02:27 |
and then I'll bring up my Windows
Explorer and re-size and re-position it
| | 02:30 |
so I can see both Flash and explorer at
once.
| | 02:34 |
Now I'm gonna navigate to where my JSFL
file is, and now I'm just gonna click and
| | 02:39 |
drag the JSFL from file explorer to the
.FLA.
| | 02:43 |
This little dialog box appears, asking me
if I want to edit the file or run it as a command.
| | 02:49 |
In previous versions of Flash this box
did not appear, but now that it has, I'll
| | 02:53 |
choose run as command.
When I click OK, it doesn't look like
| | 02:57 |
much happened, but the Sprite sheet
should've exported, at least for me, out
| | 03:01 |
to the test folder on the c drive.
And if I navigate there, there, indeed,
| | 03:07 |
is my Sprite Sheet.
What's really an exciting new feature, is
| | 03:11 |
that error messages, for JSAPI's, have
been improved to include contextual data.
| | 03:16 |
Error messages now contain the line
number, a problem statement with exact
| | 03:19 |
error messages, file names and more, to
help you improve your debugging experience.
| | 03:25 |
To demonstrate, I'm gonna go back to my
JSFL file, and mess it up on purpose.
| | 03:30 |
I'm gonna add a subfolder to the path of
the location, where I want the Sprite
| | 03:33 |
Sheet to be exported out to.
Then I'll save the change.
| | 03:37 |
So instead of exporting to the test
folder, I'm going to export out to test forward/ona.
| | 03:43 |
I'm gonna save the change.
And of course, in my test folder, there
| | 03:46 |
is no subfolder called ona, so this
should generate an error.
| | 03:51 |
So I'm gonna flip back to my FLA, and
this time, run my JSFL file.
| | 03:56 |
In a different way, by going to the
Command> Run Command.
| | 04:01 |
Then I'll navigate to the spot where my
JSFL file lives.
| | 04:05 |
When I click Open, I get an error message
that tells me, hey, a JavaScript error
| | 04:09 |
occurred at line 77 of
spritesheetgenerateex.jsfl.
| | 04:14 |
The problem is that the argument number
one is invalid.
| | 04:18 |
And of course that is the problem.
On line 77, the first arrangement we pass
| | 04:22 |
into exports Sprite Sheet specifies a
location on the computer test/ana that
| | 04:27 |
doesn't exist.
So, error message is actually meaningful
| | 04:32 |
which is great.
In the past, error messages were pretty
| | 04:35 |
unhelpful, saying things like.
Could not complete operation because of
| | 04:39 |
an unknown error, or the following
JavaScript errors occurred, but then it
| | 04:42 |
wouldn't tell you what the errors were.
So, JSFL error messages have been greatly
| | 04:47 |
improved in the new version of Flash.
You'll see them whether dragging and
| | 04:51 |
dropping the JSFL.
Or running the command from within flash.
| | 04:55 |
Finally as with most releases of flash
there are also a number of changes and
| | 04:58 |
addition to SAPI with this release.So be
sure to check out the Adobe
| | 05:02 |
documentations to see what's new.
| | 05:05 |
| | Collapse this transcript |
|
|
4. Mobile Testing EnhancementsTesting and debugging on iOS via USB detection| 00:00 | Testing and debugging your projects
from within flash via USB on both android
| | 00:05 | and iOS is now available.
| | 00:08 | Debugging via USB on iOS up to
now hasn't been available, so this
| | 00:13 | really exciting.
| | 00:15 | There's also a slightly new work
flow to kicking off this process.
| | 00:18 | So, lets take a look at that now.
| | 00:20 | I've got Monster Match-up open here.
| | 00:23 | And you can see that I've selected
AIR 3.6 for Android for my target.
| | 00:27 | I've also got my mobile device, it's
an Android phone, plugged in via USB.
| | 00:32 | So here's what's different.
| | 00:34 | The first time I want to test on USB,
I have to go to the Control menu,
| | 00:39 | then Test Movie.
| | 00:40 | On device via USB, then refresh device list.
| | 00:45 | This will go out and find all
connected devices available for testing.
| | 00:49 | Now to test, the process is about
the same as it's been in the past.
| | 00:53 | I'll go to Control, Test movie on
device via USB and you can see my
| | 00:58 | Android device listed here.
| | 01:00 | EDBE7845 is kind of a goofy name, but
when I select it, the AIR for Android
| | 01:06 | setting box pops up.
| | 01:08 | If install application on the connected
Android device and, launch application
| | 01:13 | on the connected android device aren't
already checked, go ahead and check them.
| | 01:18 | Now pick the check box next to my
device, I'll type in my P12 certificate
| | 01:23 | password above, and check to
remember it for this session.
| | 01:27 | There's just one more thing I want
to do before actually sending this to
| | 01:30 | my device.
| | 01:31 | I'll click over to the general tab
and make sure that the aspect ratio is
| | 01:35 | landscape instead of portrait, which it is.
| | 01:38 | And then on the permissions
tab, I want to check Internet.
| | 01:42 | Now I can click Publish and Flash
thinks about it for just a minute.
| | 01:47 | And now we can go over to
the phone and try out the game.
| | 01:55 | This is all just as easy for iOS.
| | 01:58 | This time we'll debug on iOS via USB
which is something you haven't been able
| | 02:02 | to do in the past.
| | 02:03 | So first I'll unplug my Android so
it's out of the way and plug in an
| | 02:07 | iPod Touch.
| | 02:08 | I'm working now in the FLA called Monster iOS.
| | 02:13 | So let's take a look first at some of
the code that runs this game so we have an
| | 02:18 | idea of what to expect to see in the debugger.
| | 02:20 | The Main.as file is really where all
the action script that runs the game is.
| | 02:26 | I'm gonna do a quick search on the word trace.
| | 02:29 | There are a lot of trace statements
that will send messages out to the
| | 02:32 | debugger and they'll tell us things
like if we've matched two cards or not, as
| | 02:36 | we play the game.
| | 02:38 | I wanna point out this trace
statement on line 74 that says "Welcome" right
| | 02:42 | after the game starts.
| | 02:44 | I'm also gonna put in a break point on line 300.
| | 02:48 | It's in a function called CreateBoard
that actually puts the monster cards
| | 02:52 | on the screen.
| | 02:53 | When we debug, our game will pause here.
| | 02:56 | So, back in our FLA, the target is AIR 3
.6, for iOS, and I'll click the wrench
| | 03:02 | to open the AIR for iOS Settings box.
| | 03:05 | Under the General tab, I'll make sure
that my aspect ratio is set to landscape,
| | 03:09 | devices set to iPhone and iPad, and
that the resolution is set to high.
| | 03:15 | On the deployment tab I've already got
my correct certificates in so I'm going
| | 03:19 | to type in my password.
| | 03:21 | I'm also gonna double check my app ID
looks okay and then make sure that install
| | 03:25 | application on the connected iOS
device is checked and down here is my iPod.
| | 03:31 | If you don't see your device listed,
you could click the Refresh button here.
| | 03:36 | So I'll click okay, and now go to debug,
debug movie, on device USB, and Lynda
| | 03:42 | iPod touch is my iPod.
| | 03:44 | We'll wait for this to publish, and
click okay when it tells us the app has been
| | 03:48 | installed on the connected device.
| | 03:51 | The debugger pops open, we can see
right away some information, as well as the
| | 03:55 | trace statement that said, welcome.
| | 03:57 | So, let's switch over to
the iPod, and take a look.
| | 04:00 | And indeed, the game is running.
| | 04:02 | So, I'll choose medium, and it looks
like the game doesn't go any further,
| | 04:07 | what's happened, is that we've
hit that break point, from line 300.
| | 04:11 | Back in the Debugger, we can
see the break point highlighted.
| | 04:15 | So, in the debugger I'll
choose debug, then continue.
| | 04:19 | And we can go on playing the game,
and seeing all the tray statements that
| | 04:22 | come out as we play.
| | 04:27 | So, when I'm done debugging, I'll go
to debug remove all break points and
| | 04:31 | end debug session.
| | 04:33 | So, to debug or to test applications
on mobile devices, via USB, there's that
| | 04:38 | new little extra step, where you have
to tell Flash to refresh the device list,
| | 04:43 | before actually testing or debugging.
| | 04:45 | What's really exciting, in this
version of Flash, is that you can debug for
| | 04:49 | iOS, over USB.
| | Collapse this transcript |
| Debugging on iOS using Interpreter mode| 00:00 |
When you want to quickly debug or test
your air applications written for iOS,
| | 00:04 |
you might like using Interpreter mode.
With interpreter mode selected, air
| | 00:09 |
applications are installed without first
converting to ARM code.
| | 00:13 |
This simplifies the air app installation
process, saving time required to test
| | 00:17 |
your applications.
Utilizing Interpreter mode takes just a
| | 00:21 |
few steps.
I've got Monster Match Up open, and have
| | 00:25 |
the target set to Air 3.6, for iOS.
Next, I'll click the wrench, beside the
| | 00:30 |
target drop down, to bring up the Air for
iOS, settings dialog.
| | 00:35 |
I'll click to the deployment tab.
Provided you've got your certificate and
| | 00:38 |
provisioning details ready to go, you can
proceed to the iOS deployment type drop down.
| | 00:44 |
From here I can select device testing in
interpreter mode, or device debugging in
| | 00:49 |
interpreter mode.
Depending on what you've chosen, from
| | 00:53 |
here, you can go ahead and publish and
proceed to either test or debug your applications.
| | 00:57 |
But since we're using Interpreter mode,
the resulting swifts can stay as swifts,
| | 01:01 |
and not have to be cross compiled, so the
whole testing process is faster.
| | 01:06 |
So I'm gonna choose Device Testing in
Interpreter Mode, and click Publish.
| | 01:11 |
So an important note, the Interpreter
Mode should only be used for testing or
| | 01:16 |
debugging purposes.
The AIR installation files produced using
| | 01:20 |
the interpreter mode cannot be uploaded
to the app store, so just use this for testing.
| | 01:26 |
So Flash now allows you to more quickly
test and debug for iOS through the new
| | 01:30 |
option of Interpreter Mode.
Again, the option to use Interpreter Mode
| | 01:35 |
is in the AIR for iOS settings under the
Deployment tab.
| | 01:38 |
| | Collapse this transcript |
| Testing on multiple devices at the same time| 00:00 |
A really exciting new feature in flash,
is that you can test on multiple devices
| | 00:04 |
connected by a USB at once.
That's really useful because you can
| | 00:09 |
check out your application performance
across a spectrum of devices with varying
| | 00:13 |
screen sizes, OS versions, and hardware
configurations all at once.
| | 00:18 |
Debugging on multiple devices isn't
really an option, but testing is.
| | 00:23 |
So let's try that out now.
So I've got error 3.6 for Anroid,
| | 00:28 |
selected as my target, and I have two
Android devices plugged into my computer
| | 00:32 |
via USB.
One's an Android tablet and the other is
| | 00:36 |
a phone.
Now I'll go to the Control menu, test
| | 00:39 |
movie, on device via USB and then refresh
device list.
| | 00:45 |
Flash will go out and detect both
devices.
| | 00:49 |
Now in the properties panel, I'm gonna
click on the Wrench icon, next to AIR 3.6
| | 00:52 |
for Android to bring up the AIR for
Android settings box.
| | 00:57 |
I'm gonna move over to the deployment
tab.
| | 01:00 |
Here, near the bottom, where it lists the
devices I can choose from, here are both
| | 01:04 |
of my devices listed, albeit, with goofy
serial numbers as identifiers.
| | 01:09 |
Notice, that there's also this Refresh
button that exist.
| | 01:12 |
If you decided to plug in additional
devices, you could do so, hit Refresh,
| | 01:16 |
and then have the new devices pop up in
the list of available choices.
| | 01:21 |
So, I already have my publish settings
set up in terms of my P12 Certificate and
| | 01:25 |
icons for the app and so on, so, I'm just
gonna click publish.
| | 01:30 |
So, Flash thinks about it and, there we
go, our APK file has been created.
| | 01:36 |
And now, Monster Match-Up is ready for me
to test out on both my tablet and my phone.
| | 01:43 |
So now, Flash offers you the ability to
test on multiple connected devices at the
| | 01:47 |
same time.
| | 01:48 |
| | Collapse this transcript |
|
|
ConclusionOther important updates to Flash| 00:00 |
One goal with this release of Flash was
focus on performance improvements and
| | 00:03 |
retooling under the hood.
Indeed Flash is now a 64 bit application
| | 00:08 |
and you'll notice overall performance and
speed improvements when opening and
| | 00:12 |
publishing files.
This retooling will also planned and
| | 00:16 |
future editions integrate well.
In line with this stream lining, another
| | 00:21 |
focus of this release of flash, was to
eliminate features and functionality
| | 00:25 |
perceived to be little used or out dated.
So being there are a number of dropped features.
| | 00:32 |
There's more to the dropped features list
than what we'll mention here, but I'll
| | 00:35 |
highlight some of the larger ones, so you
can be aware.
| | 00:39 |
One dropped feature is that support for
Action Script 1 and Action Script 2 has
| | 00:43 |
been completely removed.
This is perhaps not surprising as Action
| | 00:48 |
Script 3 has been around since 2006.
But it does mean that if you need to
| | 00:52 |
write or maintain files using the older
versions of Action Script.
| | 00:57 |
You should keep a copy of Flash CS6 or
older around.
| | 01:00 |
Let's take a quick look at how legacy
Action Script content is treated in this
| | 01:04 |
new version of Flash.
To start I'm gonna open in Flash CS6, the
| | 01:09 |
file called AS2content.fla.
It's very simple, I have a movie click on
| | 01:14 |
the stage, it's a star and it's got an
instance name of star.
| | 01:20 |
There's also a movie clip that's acting
as a button with an instance name of
| | 01:23 |
Click button.
On the Action Script layer, there's some
| | 01:27 |
simple code that animates the star across
the stage.
| | 01:32 |
When I click the button, we see code
that's been attached to the Click Button
| | 01:35 |
instance itself, not to the timeline.
When the button is clicked, a new browser
| | 01:40 |
window pointing to Adobe.com will open
up.
| | 01:43 |
I'll do a quick publish and that works
just fine.
| | 01:50 |
So I'll close the file and close flash
CS6.
| | 01:53 |
Now I'll open the same FLA in the new
version of Flash.
| | 01:58 |
When I try to open we get this error
message.
| | 02:00 |
It informs us that the document will now
be set to publish Action Script 3.
| | 02:05 |
In addition code attacked to symbol
instances or components will be removed.
| | 02:10 |
It won't be retained, but just not work
or get commented out or any other thing.
| | 02:15 |
It will just be removed.
This is kind of consistent with the way
| | 02:18 |
ActionScript 3 works in that you can't
attach ActionScript to symbol instances.
| | 02:24 |
I'll click OK, and let's check out the
FLA.
| | 02:26 |
So first clicking on the stage, looking
in the Property Inspector, just as the
| | 02:30 |
warning box said, notice that Action
Script 3 is selected for our script choice.
| | 02:36 |
Action Script 2 and 1 aren't even
available anymore.
| | 02:39 |
Now, I'll select the Click Me button, and
when I try to open up the Actions panel,
| | 02:43 |
just like the warning said, the code that
made this clickable is gone.
| | 02:47 |
Now, I'll click to my Action Script layer
on the timeline.
| | 02:53 |
The code that was added here is still
present but, of course publishing results
| | 02:57 |
in an action script error since I'm using
Action Script 2 syntax and the file is
| | 03:01 |
now targeting Action Script 3.
Finally a quick note about components.
| | 03:07 |
Action Script 2 components will be
carried forward as placeholders, but they
| | 03:11 |
can't be used to create new content on
stage.
| | 03:14 |
Also not surprisingly they'll generate
compiled errors in Action Script 3.
| | 03:18 |
So again if you need to write or maintain
files that use older versions of Action
| | 03:22 |
Script, you should keep a copy of Flash
CS6 or earlier available.
| | 03:28 |
As of the recording of this movie, Flash
Pro 6 will still be available to creative
| | 03:32 |
cloud subscribers for those who will
still need to work with legacy content.
| | 03:38 |
Another feature that has been dropped out
of flash is TLF text.
| | 03:42 |
I've got a file open in Flash CS 6 called
TLFtext.fla and you can see that it's got
| | 03:47 |
two TLF textboxes.
The top one is an editable text box and
| | 03:52 |
the one on the bottom is a static text
box with text flowing into three columns.
| | 03:57 |
I'll close this out and open the file in
the new version of Flash.
| | 04:00 |
When I do, we get a message that TLF text
will be converted to classic text.
| | 04:06 |
Indeed you can see clicking on the text
boxes that we have two classic text boxes
| | 04:09 |
and the column formatting on the bottom
text box is gone.
| | 04:14 |
A replacement for TLF text is reportedly
in the works.
| | 04:17 |
But for now, the work-around, if you
really need TLF text features is to
| | 04:20 |
continue working with CS6 or older
versions of Flash that support it.
| | 04:26 |
Now let's take a look at the Tools panel.
And notice that the Bone tool has been
| | 04:30 |
removed and thus IK animation.
So with IK gone, let's take a quick look
| | 04:34 |
at what happens when you open a file with
this kind of animation in the new version
| | 04:38 |
of Flash.
In Flash CS6, I've got giraffeIK.fla
| | 04:43 |
open, and it's an animation of a giraffe
walking that was created with the Bone tool.
| | 04:50 |
When I attempt to open this in the new
version of Flash, a warning dialog
| | 04:54 |
informs us that IK animation is no longer
supported.
| | 04:58 |
And the animation spans have been
converted to static frames.
| | 05:02 |
And indeed we have frame-by-frame
animation with key frames for our giraffe.
| | 05:06 |
If you want to do IK animation, again,
you should use an older version of flash
| | 05:10 |
or you might want to consider an
extension for flash called Drag and Bones
| | 05:13 |
that does a similar type of motion.
Moving on I've opened the FLA called
| | 05:19 |
video timeline.
If you've watched previous movies in this
| | 05:23 |
course, you may have already noticed the
absence of a familiar panel in the flash interface.
| | 05:28 |
That of the motion editor.
In the past of course it had appeared
| | 05:31 |
right down here next to the timeline.
It's not just hidden, it's actually been
| | 05:35 |
taken out of flash.
Motion tweens, and classic tweens as
| | 05:38 |
well, are still in Flash.
Here's some motion tweens right here.
| | 05:42 |
And I could still right click to set key
frames for individual properties.
| | 05:47 |
However the editing and easing controls
that were in the Motion editor are gone.
| | 05:51 |
As of now, there's not a replacement.
Another familiar tool that's been removed
| | 05:56 |
is the Bandwidth Profiler.
If I preview this swift, you'll notice
| | 05:59 |
that the View menu where the band with
profiler appeared, is gone.
| | 06:03 |
Oh, by the way, so are the other menus of
file control and debug that's used to
| | 06:06 |
appear at the top of the preview as well.
The functionality that appeared in those
| | 06:12 |
menus have basically been moved to other
places and I talked about that earlier in
| | 06:15 |
the course.
If you're looking for something to help
| | 06:19 |
identify bottlenecks in your projects
take a look at the movie earlier on about
| | 06:22 |
Adobe Scout, it works very differently
than the Bandwidth Profiler did.
| | 06:27 |
They are very different tools, but it
would be a good way to find out
| | 06:30 |
information such as what frames in your
timeline might have too much going on for
| | 06:34 |
smooth playback.
Now I'm going to move back to Flash CS6
| | 06:40 |
and open up a blank FLA file.
If I go to the Properties panel and open
| | 06:44 |
up the document properties by clicking
the little Wrench icon.
| | 06:48 |
Notice the option of Auto Save, which
lets you specify how often you want Flash
| | 06:52 |
to auto save your document for you.
Auto Save has been taken out of the new
| | 06:57 |
version of Flash.
Now don't get this confused with Auto Recovery.
| | 07:01 |
I'm gonna flip over to the new version of
flash, an the place to find auto recovery
| | 07:05 |
is under the Edit menu and then
Preferences.
| | 07:09 |
On the Mac, go to the Flash menu, and
choose Preferences.
| | 07:13 |
So here is auto recovery under the
General tab.
| | 07:15 |
Auto Recovery creates a back up recovery
snap shot FLA file, saved along side your
| | 07:20 |
original FLA at regular intervals.
For instance our file here the recovery
| | 07:27 |
would be called recovery underscore video
timeline.fla.
| | 07:32 |
Our recover file could be used to recover
an FLA file in the case of a fatal error
| | 07:36 |
like flash crashes and you have unsaved
changes or your jumps on your keyboard
| | 07:39 |
and suddenly turns off your computer or
what have you.
| | 07:45 |
So Auto Recovery is still available in
flash but auto save is not.
| | 07:51 |
Piggy backing on the topic of saving in
the new version of Flash.
| | 07:54 |
When I go to File and then Save As.
Notice my choices here in the file type
| | 08:00 |
drop down are FLA or XFL.
In Flash CS6, if I go to File > Save As,
| | 08:05 |
I can choose to save as Flash CS6 or
Flash CS5.5 or Flash CS5.
| | 08:14 |
So don't let this freak you out, this
doesn't mean that you can't save
| | 08:18 |
backwards compatible FLA's anymore.
Since Flash CS5, you've been able to save
| | 08:23 |
in both the FLA and XFL formats.
When you save using the new version of
| | 08:28 |
Flash, the saved FLA or XFL files are
internally stamped, if you will, with
| | 08:32 |
this newest Flash file version.
But that's fine, because Flash CS 5.5 and
| | 08:39 |
later releases, are able to open future
versions of these files.
| | 08:44 |
So basically, we don't see the choices to
pick CS6 or CS5.5 explicitly, because 5.5
| | 08:50 |
and older are future compatible.
They can open files that were saved in
| | 08:56 |
the newest version of Flash.
Let's try this quickly.
| | 09:00 |
I'll save as and call this video timeline
back.fla.
| | 09:05 |
I'll also save video timeline back.xfl.
Now, I'll head back over to cf6 and try
| | 09:14 |
to open the fla.
And it does open.
| | 09:21 |
We do get a warning that basically says
"hey, if your FLA has stuff that the new
| | 09:25 |
version of Flash supports, but Flash CS6
doesn't, well that newer unsupported
| | 09:29 |
stuff is gonna be skipped over".
But, the FLA opens up just fine.
| | 09:36 |
And let's open up the XFL.
We still get that same warning but again
| | 09:45 |
the file opens up just fine.
Finally, I'm gonna mention just a few
| | 09:50 |
more select dropped features in the new
version of Flash.
| | 09:54 |
Here in Flash CS 6, if I go to the Edit
menu, there's this options of customized
| | 09:58 |
tools panel where you can well, customize
your Tools panel.
| | 10:03 |
This has now been dropped out.
You can see the choice of Customized
| | 10:07 |
Tools panel is missing here.
But, you can still can create Customized
| | 10:11 |
panels in the new version of Flash using
JSFL.
| | 10:14 |
Also, notice that the Deco Tool is now
gone.
| | 10:18 |
Finally, the Strings panel, the Spelling
panel, and the Project panels, have also
| | 10:22 |
been dropped from the new version of
Flash.
| | 10:25 |
Now this may have seemed like quite the
litany of things that have been taken out
| | 10:28 |
of Flash.
There's actually a number of other items
| | 10:32 |
on the removed features list, albeit
smaller ones that few people use.
| | 10:36 |
Remember that some of the main aims for
this release of Flash were to retool
| | 10:40 |
under the hood to enable performance
improvements, more easily implement
| | 10:44 |
future features and to remove little used
or outdated features.
| | 10:50 |
And this release I'd say has certainly
done that.
| | 10:54 |
It's worth noting that with the advent of
Creative Cloud, Adobe will be moving to a
| | 10:57 |
more frequent release cadence for Flash
Pro.
| | 11:01 |
So, some of the features you might be
hoping for could come in incremental
| | 11:04 |
changes, without waiting for the larger
CS releases as has been the case in the past.
| | 11:10 |
| | Collapse this transcript |
| Next steps| 00:00 |
Thanks for joining me in this course.
Since Flash is now part of the Creative
| | 00:04 |
Cloud, its features and functionality
will be updated in the future on an
| | 00:07 |
ongoing basis.
So being, this course will also be
| | 00:12 |
updated on a regular basis.
In the meantime, I wish you all the best
| | 00:15 |
in using the new features that you
learned about here, to make it even
| | 00:19 |
easier to create fun, compelling content
for desktop and mobile.
| | 00:25 |
This is Anastasia McCune wishing you all
the best.
| | 00:28 |
| | Collapse this transcript |
|
|
