Applying Bones to Images in Flash

In this tutorial, learn how to apply the bone tool to images and Photoshop files in Adobe Flash CS4.

Advertisement

137 Comments

  1. Juan says:

    I loved as much as you will receive carried out right here.
    The sketch is attractive, your authored material stylish.
    nonetheless, you command get bought an shakiness over that you
    wish be delivering the following. unwell unquestionably come more
    formerly again as exactly the same nearly a lot often inside case you
    shield this increase.

  2. Quincy says:

    Whats up are using WordPress for your site platform? I’m new to the blog world
    but I’m trying to get started and set up my own. Do you need any coding knowledge to make your own blog?
    Any help would be really appreciated!

  3. noizz says:

    Yea. Thank you.

    This little trick is esaily discoverable without any tutorial. What is not, however, is the way of retaining the picture while applying curvature to the now movable image?

    How to bend the fill, so that it is visible exactly as a whole, when, for example, the editable area is curved circa 45 grades to either side?

  4. Justin Nixon says:

    The bone tool is not showing up on my flash

  5. Mounzer Adas says:

    Saved my life thanks

  6. Mr. SIFLER says:

    Thanks!

  7. endlessummery says:

    Спасибо)))

  8. Sim Mateen says:

    You saved my life! I love you bro!

  9. Beretta Johnson says:

    Thank You!!!

  10. TheDeathofGrace says:

    Ok I searched everywhere and the best answer I could find was that sometimes your photos will simply scramble. You have to trace them into flash via another layer on top.

  11. TheDeathofGrace says:

    it does work when i just try to do it with a rectangle that i place on the stage.

  12. TheDeathofGrace says:

    i cant get this to work. i have tried everything. what happens is i can see the bones but when i go to move them it breaks my image into pieces.

  13. rafanavega says:

    Thank you for the information.

  14. BeanieStudioz says:

    can you apply this to transparent images ?

  15. mustafas00 says:

    this is suck!

  16. Alek Einstein says:

    well we get the the point. all his tutorial was about was how to add the bones that manipulate you image(s). He doesn’t need to show you how to make a proper animation.

  17. Murphy84779 says:

    Whenever I try this, the image becomes scrambled. I’ve done it step-by-step like this, and every time it happens. Help??

  18. hoang nguyen says:

    cs6

  19. hoang nguyen says:

    is this still the same as the new version

  20. StefAnimator says:

    i don’t get how i can make animations with adobe flash.. i can’t draw anything nice because i’m missing some tool in flash and i can’t import images from photoshop either because you can’t use the bone tool on it..

  21. charecash xasa says:

    can you help mee add me on skype: nickps3zombies

  22. Arnesh Roychowdhury says:

    nice, works! but I have one *little* problem! When I apply the bone and move it it becomes like… thousand copies of that pic! pls help is you can!

  23. marcus6291 says:

    Hi mate I saw your comment on the flash tutorial and wondered if you could help me out.I did everything that you said . When i checked the library the png was the only thing there. When i tried to apply the bone tool it wouldn’t let me and when i broke it apart and applied the bone tool the image broke up and started doing weird shit. I’m just trying to make an animation of a guy strumming a guitar so the arm is the only thing i am intending to move. I made the guy in photoshop if that helps.

  24. VUTFC says:

    He doesn’t seem to realise that it didn’t work.

  25. lghal1 says:

    it sais that my symbol is “too complex”. what do i do?

  26. Erick says:

    Great Tutorial!

  27. pim megens says:

    seems all nice and easy but I cant even insert a fucking bone tool

  28. Roxanne Villanueva says:

    thanks a lot!!

  29. anzeha98 says:

    Could someone help me with this. Everytime i draw something even if it is just a dot or line, a blue rectangle comes around it and i can t use the bone tool.PLEASE HELP ME!!!

  30. anzeha98 says:

    [..YouTube..] Could someone help me with this. Everytime i draw something even if it is just a dot or line, a blue rectangle comes around it and i can t use the bone tool.PLEASE HELP ME!!!

  31. BatFan0411 says:

    Can you import you own drawing’s to flash and is cs6 similar to this?

  32. BatFan0411 says:

    [..YouTube..] Can you import you own drawing’s to flash and is cs6 similar to this?

  33. NoahBHS says:

    I don’t get what you guys are talking about, it works!

  34. NoahBHS says:

    [..YouTube..] I don’t get what you guys are talking about, it works!

  35. Vivien Chan says:

    i Like it.thanks.but you made the whole image controlled by the bones,can only the arm there be?cuz most of time we need one part of body to move.can u help?

  36. Connie Chan says:

    [..YouTube..] i Like it.thanks.but you made the whole image controlled by the bones,can only the arm there be?cuz most of time we need one part of body to move.can u help?

  37. Vivien Chan says:

    [..YouTube..] i Like it.thanks.but you made the whole image controlled by the bones,can only the arm there be?cuz most of time we need one part of body to move.can u help?

  38. AuryOtaku says:

    i did what you said, but it wont allow me to add the bones to my image. (i saved as png in photoshop and im working with the symbol copy) is there anything i have to do to the image so it will allow me to add bones without turning the image into a mask?

  39. AuryOtaku says:

    [..YouTube..] i did what you said, but it wont allow me to add the bones to my image. (i saved as png in photoshop and im working with the symbol copy) is there anything i have to do to the image so it will allow me to add bones without turning the image into a mask?

  40. AnthonyGTA5 says:

    2″666″0 watches :O

  41. AnthonyGTA5 says:

    [..YouTube..] 2″666″0 watches :O

  42. Sergiu Vacari says:

    Can anyone help me please????I watched this tutorial and I tried few methods and it doesn’t work. I tried to trace the bitmap image and then apply bone tool, it doesn’t work, can’t make it animated, I mean the image. I tried to break apart in photoshop CS5.5 and save them in PNG file, import into flash, break apart but still the same problem.. doesn’t work. Then I tried to import PSD file, the same story..What shall I do? Or what do I do wrong? Please help!!!Thanks in advance

  43. [..YouTube..] Can anyone help me please????I watched this tutorial and I tried few methods and it doesn’t work. I tried to trace the bitmap image and then apply bone tool, it doesn’t work, can’t make it animated, I mean the image. I tried to break apart in photoshop CS5.5 and save them in PNG file, import into flash, break apart but still the same problem.. doesn’t work. Then I tried to import PSD file, the same story..What shall I do? Or what do I do wrong? Please help!!!Thanks in advance

  44. SergiuVacari says:

    [..YouTube..] Can anyone help me please????I watched this tutorial and I tried few methods and it doesn’t work. I tried to trace the bitmap image and then apply bone tool, it doesn’t work, can’t make it animated, I mean the image. I tried to break apart in photoshop CS5.5 and save them in PNG file, import into flash, break apart but still the same problem.. doesn’t work. Then I tried to import PSD file, the same story..What shall I do? Or what do I do wrong? Please help!!!Thanks in advance

    • Karen Webster says:

      I am also having the problem that if I can get an image to actually animate, then it breaks apart at the end. Did you get an answer? I do know that you need to make each part a movie clip which you can do really easily when you import to stage. I found that if I make some “fake” places to connect the bone tool, then hide them- that works too. I would appreciate any help you can give me.
      Thank you,
      Karen

  45. dragondude2256 says:

    is it possible just to make the arm move and not the entire image?

  46. [..YouTube..] is it possible just to make the arm move and not the entire image?

  47. KingOfTheBeyond23 says:

    Still doesn’t work for me. D:

  48. [..YouTube..] Still doesn’t work for me. D:

  49. karan2053 says:

    do u know such a tutorial cuz thts my query too??

  50. karan2053 says:

    [..YouTube..] do u know such a tutorial cuz thts my query too??

  51. karan2053 says:

    [..YouTube..] @GenzorX do u know such a tutorial cuz thts my query too??

  52. Koreman11 says:

    It doesn’t work. CS5.5: Image imported, broken apart, then applied the bone tool. Yet it doesn’t draw bones. The entire image becomes an “IK Shape”. No clue. Tried several images.

  53. Koreman11 says:

    [..YouTube..] It doesn’t work. CS5.5: Image imported, broken apart, then applied the bone tool. Yet it doesn’t draw bones. The entire image becomes an “IK Shape”. No clue. Tried several images.

    • Karen Webster says:

      Please let me know if you have figured out the bone tool, because it looks like I am having the same problem.
      Thanks,
      k

  54. TypStaffan says:

    Do you think you could explain that a bit more detailed? If I have a Photoshop image, what should I do?

  55. TypStaffan says:

    [..YouTube..] Do you think you could explain that a bit more detailed? If I have a Photoshop image, what should I do?

  56. TypStaffan says:

    [..YouTube..] @GenzorX Do you think you could explain that a bit more detailed? If I have a Photoshop image, what should I do?

  57. H3llHoundd says:

    Hello im working on an animation project and I have imported a psd file of a picture that I painted in photoshop cs5 which has layers, then I chose the layer that I want to work on and when I click break apart and use the bone tool the picture breaks to pieces, Can anyone tell me what I should do?

  58. H3llHoundd says:

    [..YouTube..] Hello im working on an animation project and I have imported a psd file of a picture that I painted in photoshop cs5 which has layers, then I chose the layer that I want to work on and when I click break apart and use the bone tool the picture breaks to pieces, Can anyone tell me what I should do?

  59. ej4t says:

    my bone image is gone how to fix it arghhhh!!

  60. ej4t says:

    [..YouTube..] my bone image is gone how to fix it arghhhh!!

  61. AqworldsUzmakiHakim says:

    Thanks

  62. oventoster09 says:

    need istaller ?? just Copy/Paste lick below and then erase the space between the (A and the dot) …..!!adf .ly/2GKUx

  63. Harry Allington Wood says:

    @tilbury: e its a group, and when i try this method of breaking apart the image. i can apply the bone tool, but then only the fill moves and not the outline or thumb.i hope that this has made sense, as any help would be really appreciated.thanksharry

  64. [..YouTube..] @tilbury: e its a group, and when i try this method of breaking apart the image. i can apply the bone tool, but then only the fill moves and not the outline or thumb.i hope that this has made sense, as any help would be really appreciated.thanksharry

  65. tilbury says:

    [..YouTube..] @tilbury: e its a group, and when i try this method of breaking apart the image. i can apply the bone tool, but then only the fill moves and not the outline or thumb.i hope that this has made sense, as any help would be really appreciated.thanksharry

  66. Harry Allington Wood says:

    hello, I’m a big fan of your tutorials they have been helping me loads, but i keep on ending up with the same problem.basically i want to animate a drawing that i have made in Illustrator, i have all the libs, eyes and what not, in their own layers. the problem is that as say for an example i have an arm which is drawn using the pen tool with a black outline and a grey fill, and it has a thumb which is just an outline also drawn using the pen tool, but i cannot add the bone tool to them becaus

  67. [..YouTube..] hello, I’m a big fan of your tutorials they have been helping me loads, but i keep on ending up with the same problem.basically i want to animate a drawing that i have made in Illustrator, i have all the libs, eyes and what not, in their own layers. the problem is that as say for an example i have an arm which is drawn using the pen tool with a black outline and a grey fill, and it has a thumb which is just an outline also drawn using the pen tool, but i cannot add the bone tool to them becaus

  68. tilbury says:

    [..YouTube..] hello, I’m a big fan of your tutorials they have been helping me loads, but i keep on ending up with the same problem.basically i want to animate a drawing that i have made in Illustrator, i have all the libs, eyes and what not, in their own layers. the problem is that as say for an example i have an arm which is drawn using the pen tool with a black outline and a grey fill, and it has a thumb which is just an outline also drawn using the pen tool, but i cannot add the bone tool to them becaus

  69. syneatnrc says:

    it says my image is to complex………..i drew it on flash! and broke it apart!……….why wont it let me use the bone tool?

  70. syneatnrc says:

    [..YouTube..] it says my image is to complex………..i drew it on flash! and broke it apart!……….why wont it let me use the bone tool?

  71. harowTHEharun says:

    can’t you see that it’s not animating the image but the mask?

  72. [..YouTube..] can’t you see that it’s not animating the image but the mask?

  73. harowTHEharun says:

    can’t you see that it’s not animating the image?

  74. [..YouTube..] can’t you see that it’s not animating the image?

  75. harowTHEharun says:

    can’t you see that it’s not animating the image?

  76. GenzorX says:

    Typing on my iPhone sucks, but yea

  77. GenzorX says:

    [..YouTube..] Typing on my iPhone sucks, but yea

  78. GenzorX says:

    Pretty much a fail tutorial. You need to break the images into parts and them save these parts without a background in Photoshop as a PNG file. The import the PNG files into your library in Flash. You will notice that in your PNG files in your library will then pair up with another file called symbols. These symbols are file that flash recognize asImages that can be animated. Construct these symbols onto the stage as you like then add the bone tools.

  79. GenzorX says:

    [..YouTube..] Pretty much a fail tutorial. You need to break the images into parts and them save these parts without a background in Photoshop as a PNG file. The import the PNG files into your library in Flash. You will notice that in your PNG files in your library will then pair up with another file called symbols. These symbols are file that flash recognize asImages that can be animated. Construct these symbols onto the stage as you like then add the bone tools.

  80. 999Bemyself says:

    I agree >.<“

  81. 999Bemyself says:

    [..YouTube..] I agree >.<“

  82. 999Bemyself says:

    [..YouTube..] @dlburkhart1 I agree >.<“

  83. JohnnyTest says:

    Check the last few seconds of the video: he ran into the exact same bug everybody else has been getting.

  84. TheMPVL says:

    [..YouTube..] here is one free screen capture software it cals cam studio just do google search for camstudio and its first result

  85. TheMPVL says:

    [..YouTube..] @horsechik here is one free screen capture software it cals cam studio just do google search for camstudio and its first result

  86. TheMPVL says:

    [..YouTube..] there is one screen recording software and its freeit calls camstudio you can download it at :

  87. TheMPVL says:

    [..YouTube..] @horsechik there is one screen recording software and its freeit calls camstudio you can download it at :

  88. bazookoidben says:

    I’m having a little trouble, even though I can use the bone tool, it just seems to have white shapes move over the arm I am trying to animate, I’m not sure if it is something I am doing wrong.

  89. bazookoidben says:

    [..YouTube..] I’m having a little trouble, even though I can use the bone tool, it just seems to have white shapes move over the arm I am trying to animate, I’m not sure if it is something I am doing wrong.

  90. Tawab says:

    When you break the jpg image apart to apply bone tool, it misses up the whole picture, how can u fix that so it only moves where the bone tool is applied in the area? plz help :)

  91. shoubbu says:

    Thank youuuu!!!!

  92. shoubbu says:

    [..YouTube..] Thank youuuu!!!!

  93. rmillis3860 says:

    Thank you so much. You answered my question.

  94. rmillis3860 says:

    [..YouTube..] Thank you so much. You answered my question.

  95. David Burkhart says:

    This did not help. If you’ll notice when manipulating the armature, the only thing that moves is a mask over the image. The image itself never changes.

  96. dlburkhart1 says:

    [..YouTube..] This did not help. If you’ll notice when manipulating the armature, the only thing that moves is a mask over the image. The image itself never changes.

  97. [..YouTube..] I had imported an image from photoshop into flash, which was my main problem–I had to basically trace the image in flash for it to move properly–for some reason imported images don’t work right with it.

  98. [..YouTube..] @anennmido I had imported an image from photoshop into flash, which was my main problem–I had to basically trace the image in flash for it to move properly–for some reason imported images don’t work right with it.

  99. anennmido says:

    [..YouTube..] @TheNinthDragon did you ever figure this out? I’m having the same problem and can’t seem to fix it

  100. anennmido says:

    [..YouTube..] @TheNinthDragon did you ever figure this out? I’m having the same problem and can’t fix it.

  101. poojumper says:

    it doesn’t apply to the fill of the image!

  102. poojumper says:

    [..YouTube..] it doesn’t apply to the fill of the image!

  103. [..YouTube..] lets say i just use my camera to film something, and then i want to add some effects like fire and blood… HOW ?

  104. HTFITMBSE says:

    [..YouTube..] thank you thank you very much

  105. vjsophie says:

    [..YouTube..] thx!

  106. [..YouTube..] Your tutorials truly rock =)

  107. TheNinthDragon says:

    How would you do this without the image being cut off when you move it? I was trying to do a walk-cycle, but when I move it the leg or arm will become distorted and it won’t move right…

  108. [..YouTube..] How would you do this without the image being cut off when you move it? I was trying to do a walk-cycle, but when I move it the leg or arm will become distorted and it won’t move right…

  109. [..YouTube..] thank you so much this helped a lot!

  110. [..YouTube..] does this works on PNG Image Files too?

  111. neogeo328 says:

    How do I prevent the lines from getting thicker when I use bone tool? After I apply a bone and I rotate the object a bit, the lines get thicker. Also, how do I prevent some lines from disappearing?

  112. neogeo328 says:

    [..YouTube..] How do I prevent the lines from getting thicker when I use bone tool? After I apply a bone and I rotate the object a bit, the lines get thicker.Also, how do I prevent some lines from disappearing?

  113. Simstyle12 says:

    Wow flash seems more easy and easyer the more tutorials i watch

  114. Simstyle12 says:

    [..YouTube..] Wow flash seems more easy and easyer the more tutorials i watch

  115. waynegraphix says:

    [..YouTube..] Long story short, import jpeg, break it apart, then use bone tool. BREAK APART first to make it similar to a fill.

  116. Wayne Strickland says:

    you might try trace bitmap. It breaks it down to the “little dots” then you can select individual parts ie arms legs head etc. and group them then bone tool them

  117. waynegraphix says:

    [..YouTube..] you might try trace bitmap. It breaks it down to the “little dots” then you can select individual parts ie arms legs head etc. and group them then bone tool them

  118. organicactor says:

    [..YouTube..] Excellent tutorial. You break it down so ease. Thanks, I think you saved me many frustrated ours. I really like your tutorials.

  119. BogoblinGamer says:

    @damanfrommars Don’t use hypercam for gods sake. Use a program called camstudio. Hypercam has a watermark and produces low quality videos. If you wanted to pay for screen cap, you could use Camtasia Studio. For mac, the best program to use is Screenflow, though it costs quite a lot.

  120. [..YouTube..] @damanfrommars Don’t use hypercam for gods sake. Use a program called camstudio. Hypercam has a watermark and produces low quality videos. If you wanted to pay for screen cap, you could use Camtasia Studio.For mac, the best program to use is Screenflow, though it costs quite a lot.

  121. BogoblinGamer says:

    @DrFlanigan You could vectorise it in Illustrator or trace the bitmap in flash. If you are doing this though, it is best to use a simpler image to keep the file size down.

  122. [..YouTube..] @DrFlanigan You could vectorise it in Illustrator or trace the bitmap in flash. If you are doing this though, it is best to use a simpler image to keep the file size down.

  123. upload says:

    and what the hell is disfiguring the image gonna accomplish

  124. upload says:

    [..YouTube..] and what the hell is disfiguring the image gonna accomplish

  125. [..YouTube..] you have to pretty much cut them up in to different parts and make them symbols you can’t do bones on an image

  126. [..YouTube..] Nice tutorial, but you could have cut out all the small comments… drags out the video longer than necessary.

  127. Peťo D says:

    WTF is that? ur image didnt move !!

  128. PETKKKO says:

    [..YouTube..] WTF is that?ur image didnt move !!

  129. Tom Crotty says:

    You can also do that with trace bitmap, which is better, as it makes shapes so you can animate images of characters.

  130. anim8ordude says:

    [..YouTube..] You can also do that with trace bitmap, which is better, as it makes shapes so you can animate images of characters.

  131. DrFlanigan says:

    [..YouTube..] The image in your tutorial stayed fixed but the outline moved…If i imported an image of an animated person, im pretty sure the same thing would happen, how do i make it so that the actual image moves with the bones?

  132. [..YouTube..] thanks!!

  133. Incredible Tutorials says:

    I use a screen capturing software. There are many types out there depending on if you’re using a PC or Mac.

  134. horsechik says:

    how do you record these? .. surely you dont just have a camera set on the screen..?

Leave a Comment

 

— required *

— required *