Blog03-Getting to Know Adobe Flash/Animate
A while back, before starting to use Flash, the first thing I looked up were the hotkeys that I expected I would be using most regularly and wrote them down to help me remember them. I know that some creative software are alike with details like this, but I like to check to be certain so I don’t waste time figuring it out myself when I don’t necessarily need to do that. Even if I don’t remember, I feel that writing them down is still worthwhile as I can then use those notes as a quick reference point for myself while working or for if I need to update my graphics tablet’s properties.
To affect frames within the Flash/Animate Timeline, one needs to remember to select/highlight the frames (or soon to be frames if one’s action is to create new frames) that they would like to apply an action to beforehand.
To insert a Frame (extends a frames length), press ‘F5’.
To insert a Keyframe (automatically fills new frame with the previous frame’s contents), press ‘F6’.
To insert a Blank Keyframe (does as described), press ‘F7’.
To Delete a Frame (can delete any of the above frame types), one can press ‘Shift’ + ‘F5’.
[Clear a Keyframe = ‘Shift + F6’].
Step Forwards a Frame = ‘>’, Step Backwards a Frame = ‘<’.
Figure.1 (frame-types.jpg, 2018).
Representation of Frame Types: A keyframe is shown as a dot on the frame. If a frame has something on it, it will show a black dot and the frame itself will be grey. If it shows an outline of a dot and the frame is white, it means there isn’t anything on that frame. If the frame looks blank and white, that means there isn’t any keyframe there and that the previous keyframe is blank. If a frame is blank but is grey, that means it is displaying what was put on the previous keyframe. A rectangle shows where the gap between two keyframes ends.
Notes about How to Move Around the Stage (The Flash/Animate name for ‘Canvas’):
Zoom In = ‘Ctrl’ + ‘+’...OR... Zoom Out = ‘Ctrl’ + ‘-‘.
I had made a custom hotkey (for me = ‘Ctrl’ + ‘5’) for ‘Fit in Window’ by going to: ‘Edit’ > ‘Keyboard Shortcuts...’, selecting a command and pressing the plus arrow below to create a new shortcut (hotkey). It is also a good way of checking for the commands and their hotkeys that may appear hidden or may not be mentioned by others on the internet.
Pan Stage (Canvas) = Hold down ‘Spacebar’.
I had also written down hotkeys for some of the tools that can be used in Adobe Flash/Animate, however I personally don’t use them. I prefer just clicking on a lot of these buttons with my stylus as I don’t see them as being too far out of reach anyway. I will still place the ones that I felt I would be most regularly using down below in case anyone reading this would prefer to use them (although you can just hover over the tool buttons & Flash/Animate will tell you anyway. The hotkeys for the commands in the menus that do have one are clearly displayed too):
Paint Bucket Tool (add/change colour of fill): ‘K’
Ink Bottle Tool (add/change colour of stroke): ‘S’
Creating a custom hotkey for the ‘Free Transform Tool’ may be a good idea
[Extra = Pen Tool: ‘P’ (to create neat vector paths)]
The Pen Tool seems to have more to using it than the others. This YouTube tutorial by Alphonso Dunn is the best I’ve found at explaining the Pen Tool and how to use it (It’s relevant for Photoshop too):
Here are some general tips that I have gathered over time:
One can import scanned sketches or create draft sketches on one layer within Adobe Flash/Animate and then create the clean, final lineart of the drawings over the top on another layer.
When doing 2D animation, have the separate body parts on separate layers (it makes it easier to alter drawings as it lessens the chances of destroying what’s there unintentionally).
Make a habit of locking layers not in use.
The Flash plugin ‘Keyframe Caddy’ would be worthwhile downloading if one is making and animating graphic symbols (As it makes the process quicker and easier) [Look within references for details].
Select and right click on a layer to choose ‘Guide’ if you’d like whatever is on that layer to not show up in the final render/export (Do the same thing to change it back to a normal layer again).
I found the Pluralsight tutorial: “You’re First Day in Flash” by Alex Hernandez very useful in getting to know the basics and what Adobe Flash/Animate could do overall (Naturally Flash and Animate would be pretty similar as they are two versions of the same software, so this is relevant for both).
After researching into the software itself, I looked for information on what I was planning to make by this point: a 2D rig. So, I researched into animating with symbols and animating with bones, and it turns out that it is possible to combine the two 2D rigging methods together. After finding this out, I decided to make that my goal [The three tutorials I found useful (in their own ways) when it comes to Flash/Animate bones are in the reference list below]. I had to experiment a little afterwards to get my 2D rig working though (It seems my 2D rig turned out to be a little more complex than the tutorial examples, so I’m not sure if all of what I did with my 2D rig would be in them).
Here is a tutorial on the differences between the different types of Flash/Animate symbols:
There is an option in the properties window when a movie clip symbol is selected that allows you to alter how the movie clip behaves. The options are: ‘Loop’ (go through the frames within that symbol continuously throughout animation), ‘Play Once’ (only go through the frames within that symbol once) or ‘Single Frame’ (don’t move through the frames at all = static image, unless animated manually) (Crowne Prince, 2013).
This is quite a good tutorial on how to use symbols to construct a flexible 2D rig:
This 2D bone rig tutorial is probably the most useful of the three mentioned earlier:
I had also found a tutorial on how to create looping backgrounds as I thought that it would be a good way of showcasing my 2D animation cycle(s). (But I only plan on acting on this myself if I have time). [This tutorial can be found in the reference list below].
ArtTips (2017). Bone Tool Animate CC Character Rigging Tutorial [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=v84zAJi704k&t=914s
Crowne Prince (2014). How to make a dang infinite looping background in Flash [YouTube.com]. Retrieved April 19, 2018, from: https://www.youtube.com/watch?annotation_id=annotation_614195711&feature=iv&src_vid=YTJvLBrSkIU&v=lkFz91K6Dvs
Crowne Prince (2013). How to make your own dang Flash puppets [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=YTJvLBrSkIU&t=192s
Draw with Jazza (2016). How to make Flexible Character Animation (For Games and More!) - Animate CC Tutorial [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=OLkrOTEJugg
Draw with Jazza (2014). How Flash Symbols Work - Graphics, Buttons and Movie Clips [YouTube Tut], Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=ZiJr3gqTcPM
frame-types.jpg [Screenshot] (2018). Perth, Australia: Norman, H.
Hernandez, A. (2014, Sept). Creating Sprite Sheets in Flash for Edge Animate [Pluralsight Tut]. Retrieved April 9, 2018, from: https://app.pluralsight.com/library/courses/sprite-sheets-flash-edge-animate-1795/table-of-contents
Hernandez, A. (2014, Aug). Your First Day in Flash [Pluralsight Tut]. Retrieved April 9, 2018, from: https://app.pluralsight.com/library/courses/your-first-day-flash-1741/table-of-contents
hexjibber (2011). How To Animate with Bones in Flash CS5: 004 Symbols [YouTube Tut]. Retrieved April 19, 2018, from: https://www.youtube.com/watch?v=9vg5-HcAXdg
KnowFlash (2011). FlashLearner.com - Animation Made Easy With The Bone Tool [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=_L3W4QsOgQk
MonkeyCrazy (2015). Absolute beginners easiest guide to using Keyframe Caddy tutorial [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=APsL1iY-9k8
Trav, T. (2016). [How To] Get KeyFrame Caddy for Adobe Animate CC 2015 [YouTube Tut]. Retrieved April 14, 2018, from: https://www.youtube.com/watch?v=tByUd1oeKKc