Developing Webs logo
Web DW-Main DW-Photoshop
Visit the message board for solutions or post a question Check out the Classes offered for free at Developing Webs Voice Chat submit a tutorial, resources, article, font for publication consideration and earn a one way link back to your site Get more specifics about the Developing Webs Voice chat room and its room members View the current news at Developing Webs alternative sites which are resources for your d3evelopment needs Join Developing Webs Chat Link to us on your web page to help support this resource! Check out Developing Webs At yahoo groups! Developing Webs Home Adobe Photoshop Tutorials Macromedia Flash Tutorials Jasc Paint Shop Pro Tutorials Adobe Illustrator Animation basics Some Basic PHP tutorials Perl Tutorials HTML Tutorials Cascading Style Sheets javascript Front Page Tutorials Macromedia Dream Weaver Tutorials dreamweaver Publishing your site, FTP, ChMod, Promotions Tools to help you create your site Free and shareware fonts to download Photographs to use in your projects Shop for your site needs Free Online classes REcommend this site to others Log in or edit your information when logged in Developingwebs Log Out Change My Account details and preferences
RSS Newsfeed
for your site
DW News
DW Forum
Right click on button and copy shortcut

Add to My Yahoo!

Remember to book mark this site!

Request a Tutorial

Dripping Blood

published with permission by KJA Forums;

  • By tape, From KJA Forums; published with permission
  •  If you have no idea what photoshop or image ready are this tutorial isnt for you. I am just teaching how to make a blood drip and not how to use the program.


1. Start by having a blood drip render, you can make this yourself or you can use this one

2. Position it where you want it.


3. Make a duplicate of this layer because you will need it to make the different positions. This image is a JPG, bit is it was a gif, you would have to switch the mode to RGB by clicking Image=> mode=> RGB to duplicate the layer.

4. Select the end of the drip on the duplicate layer like this using the lasso tool, giving the top of the selection a curve so when you fit it to the tube its coming from, it fits.

5.  I've cut a curve in the drip to match it up to the end of the syringe.
It should be a different layer to the original so now move the cut to the end of the syringe. It should look like the image on the right.

 6. You can see the other layer so just use the paint brush to cover over that in the background color. (To save doing this you can cut out the blood drip/syringe from the back ground and make them their own layer and hide the previous layer each time but I couldn't be asked to do that it all works out the same...kind of. BUT if you want something behind the drip you will have to do this)

7. Use the smudge tool to blend the blood edge to the edge of the syringe to make it look a little more real by smoothing out the joint.

8. Go back to the original layer and duplicate it to make the next layer
now do every thing you did to the last layer but cut so there is more of the drip my next frame looked like the image on the right
9. Same as the previous layer smudge to fill gaps and make more real, and smooth transitions between drip and where it was moved it.

10. You can add more layers between these two to make your animation a little smoother 

11. Repeat the procedure several times taking more of the drip each time, positioning it in the next sequential position for animation, and smoothing the joints.

12. For the middle of the animation, the blood wont just drip off it will hang a bit then separate from the blood on the syringe so for these frames cut the frames like this...

stretched the blood

 separated the blood but made the blood like that because it doesn't just disappear it will 'spring' back to the syringe

increased separation

increased separation

this frame the blood is back at the syringe now for the rest of the frames just carry on the drip out of the screen so it can loop back to the first frame and drip, drip on!

Creating the animation-  Now that you have all your frames save your work and take your work to image ready to animate!

13. Click the button on the bottom of the toolbox to jump to Image Ready
14. Open your animation panel. Turn all layer eyes off by the original layer.

15. Create a  new frame for each each layer you made in Photoshop.  Click the new frame button on the bottom of the animation panel. Turn off the current layer, and turn on the next layer for the animation. Position the frame so the syringe is in the same place as pervious( it should already be in position is you did it right..)

16. Repeat step 15 for each of the layers, making each layer visible a separate frame.

17. Finally go to the file menu and ''save optimized as...'' . Set it to GIF  format.


"Building The Web Into a Nicer Place -- One Site At A Time"
Developing Webs Group Copyright © 2001-2018 All Rights Reserved
Privacy and Legal