Splitting Liquid Shapes (like how cells divide) - Adobe After Effects tutorial

Watch solid shapes break apart like they're made of liquid gross crap. This is kind of how cells divide. But not really. Someone asked me about how to divide cells and after I told them what I read on Wikipedia and they said they just needed to animate it I told them to just draw it. But really there is a simpler solution, with much much less drawing.
It uses the often overlooked roughen edges effect and it's pretty darn versatile. You'll be making cool stuff with this in no time... or space.
Music by PremiumBeat.com. License this music: bit.ly/1RMxi0O
If you have any questions just let me know in the comments.
Download this project file: gumroad.com/l/...
Twitter
/ ecabrams
Google+
plus.google.co...
Facebook
/ 193708234045591
Website
Evanabrams.com
Suggest a tutorial topic: docs.google.co...

[@Einat710]

I highly appreciate you took the time to elaborate what every effect is doing in general and not just what numbers to put in. This is SO important for the learning process and many tutorials skip that part. thank you very much for the video. I feel I am a better designer now.

[@davidRKjunior]

6 years later and still an AMAZING video! Thank you!

[@Evirgili8]

OMG man! the way you explain all the effect properties is so clarifying. That video worth the subscription. CONGRATS FROM BARCELONA!

[@nobananaman]

Seriously one of the best tutorials I've ever watched. High quality thorough, informative, entertaining. Thanks for contributing.

[@NDKY67]

At last a tutor that doesn't just march through a series of instructions and takes time to explain the theory behind the After Effects tools. Great tutorial, very helpful thank you : )

[@alanrudge3282]

Love this tutorial. Doing great looking stuff by being smart with simple effects and keyframing. Every step is clear and it sparks a million ideas. Just how a tutorial should be!

[@ECAbrams]

+Alan Rudge glad you enjoy it.

[@juliandavis5045]

Thanks for the great tutorials. You're the only AfterEffects dude on KZbin that actually explains what things do, and it's awesome. Keep doin' what you're doin', Evan.

[@Najobajo]

I absolutely love you for this. I can't express enough how amazing you are as a teacher. To the point, easy to understand, concise and thorough and always entertaining (which makes 20 mins seem like 5). So glad you made the leap away from Premium Beat for your own following. THANK YOU!!!!

[@morganmendieta3738]

This is a great tutorial. I really like how you explain the process in an open way rather then just making something and having to follow step by step. I feel like It's more open to interpretation of use rather then just a paint by numbers tutorial. great also fun hosting.

[@ECAbrams]

Excellent! Then that is a mission accomplished for this channel :)

[@helenechen5457]

to skip directly to the tutorial, start at 3:15.

[@sharpywilliam4513]

Why on my sane mind would I ever want to skip anything the amazing ECAbrams has to say???

[@helenechen5457]

in case you're really pressed for time and zooming through several tutorials like i was when i made this comment. i had to make an effect similar to this and was feverishly searching YT for help. i know i'm not the only one who does this. plus - you can always come back to the video and watch the whole thing. i don't know why this comment was so controversial. i like ECAbrams and watch his vids all the way through as well, but sometimes you need those extra few minutes for your deadline! let those who have never scrambled for a solution at the last minute throw the first stone, jeez.

[@somehannahperson]

@Carla Young uh, that comment was 2 years ago. I think she finished the job by now...

[@pratikjain134]

Superb tutorials..Please never stop doing these :)

[@ECAbrams]

Pratik Jain I'll try. Eventually I will die in a horrible badger related accident as foretold by a roadside fortune teller. But until then I'll try.

[@pratikjain134]

Haha you won't we all need you and your tutorials :)

[@valeriautreras]

ECAbrams

[@craigernstzen2372]

This is great, thanks. I will be following more of your lessons. The fun level just went up a few notches because of your causal approach to teaching.

[@nseriously2704]

Evan! Your charisma and teaching skills are fascinating!

[@ethanpoisson3528]

THANK YOU SO MUCH FOR TELLING ME ABOUT THE EDIT SPEED GRAPH. EVERY TUTORIAL MINE HAS BEEN DIFFERENT AND IVE BEEN SO CONFUSED. THANK YOU!!!

[@OysteLover]

ECAbrams, your tutorials and dialogue are the best!

[@jaceharrisoncrowley]

This is the most amusing tutorial I've watched (funny and enjoyable) I am watching it again and enjoying every ridiculous fractal reference.

[@therelentlessminds]

One of the best tutorials Ive seen on here. Thank you

[@Justthisrode]

This i's literally the best tutorial I have ever watched

[@marciaunderwood5645]

Exactly what I was after. New to using AE and this was a tutorial that helped me learn the tool better outside of just the one trick of the moment I was searching on- while still being succinct and pro and amusing. Many many thanks!!

[@toddlawrimore3577]

As always, great work. I've used all those filters before but never considered stacking them the way you have. Thank you for sharing.

[@WaffleTheQueenz]

Thanks for making these tutorials! They have a really great balance of humor and useful information.

[@ECAbrams]

thewaffles There's information in here? News to me :) Glad you like them.

[@penumbra9009]

your tuts are awesome! i try to catch them all. please keep doing them! would also love any kind of bigger package of tutorials you might make...

[@mendistudio]

Damn! Every time I look for a particular effect I need... BOOM there he is! Thanks so much.

[@NonHelicoptere]

Amazing work! Really good tutorials, and the way you say «about» is part of the learning too.

[@ECAbrams]

+NonHelicoptere I believe I pronounce "about" much the same as everyone I am conversing with on a daily basis. It seems as normal to me as I am sure your pronunciation sounds normal to you.

[@jjjim1]

awesome tutorial, seriously man. fun and not alot of fluff. appreciate you putting this together!

[@greeni616]

OMG I've been searching for this effect for a long time. I'll walk through all channel to learn more effects. (It's a little difficult to find the effects in my Chinese version of AE LOL it took me so long) Thanks for sharing.

[@emblematicMedia]

You make great tutorials brother, easy to follow, fun to watch, keep up the good work!

[@RallohE]

Good to see ya back on KZbin!

[@ECAbrams]

***** It's nice to be back. Maybe I'll even post consistently this time?

[@scatterbrainart]

Great tutorial, man. I'm sometimes tasked to do biological animations and this technique will come in super handy for animating bacteria multiplication.

[@yjy7179]

Great video! I want to know if this would work as well with lower opacity settings... no overlapping?

[@nico_valerga]

ECA making hard things easy....or not but whatever...tutorials are great. Thank you from Argentina!

[@kukuku6128]

hi Evan - great tutorial! I wonder how would you achieve the same liquid effect but with the objects that have stroke? Thanks!

[@healym67]

Great tutorial- fun to listen to- Evan, I love how much fun you have with this and don't take yourself too seriously. I actually want to do a tutorial video on cell division, and this was (almost) just the thing. The problem is that I want to do this with a different fill color than the stroke color, and that creates problems. Instead of the cell dividing in the middle, one kind of hatches out of the other. I applied trim paths to each circle and then offset the start and end, adding keyframes in the process to tighten it up a bit (I was pretty proud of myself for figuring this out- I'm pretty much an AE beginner) but it doesn't look as good as I'd like. Any suggestions?

[@jovisjoseph]

best tutorial ever...keep making such great stuff man...i really liked you way of presentation

[@thehomme]

Excellent. I did the same thing with a blur and choke but it wasn’t sticky enough. Adding the middle rectangle makes all the difference. And wow... did roughen edges grow up or what. I remember it as some lame filter from photoshop 3.

[@sharpywilliam4513]

No but really, you deffinitely know how to teach! If you have some sort of paid individual classes, let me know, I dont mind paying for classes of this quality.

[@ECAbrams]

Thanks for saying so. Actually, individual classes will be a thing coming very soon. I'll be tweeting the details shortly, once the booking system is live.

[@sharpywilliam4513]

ECAbrams Welp, let me give this man a Follow.

[@selfishbirch]

THANK YOU! actually a great tutorial. I got everything, the result is great, voice is great, and it is even fun to watch

[@rafaeldetovar9168]

You can do a effect like this more simple but with minor level of control. Just need to use a gaussian blur and level effect in a adjustment layer and boom!! you have liquid effect, precompose and change the color or whatever you want. :) Great tutorial by the way. Thanks for the knowledge.

[@gusmaiawork]

Are you planning on doing the filling up tutorial any time soon? I would love to see that. Huge props!

[@ECAbrams]

Soon I think. There isn't much to it though. It's mostly about manipulating paths over time.

[@gusmaiawork]

ECAbrams Thanks for the reply! Looking forward to see that, sounds quite interesting.

[@formxshape]

Adjustment layer above your shapes + Fast box blur + Curves, Alpha, Hard graph - tone down adjustment layer transparency, tweak blur amount and curve graph till the liquid effect is crisp and keeping your shapes to the same size as originals. Turn up opacity to 100%. Throw in a Transform layer, play with scale, CC composite back original, to get little droplets behind your main shape movements. Also time echo can work.

[@josemanuelerre]

This is just amazing!! I'd love to know how to do the filling. Because I'm a mess and I can't figure it out as I'd like. Thank you for all your knowledge you are giving us !!!

[@saharzaki2310]

you simply just press control D to duplicate each layer and just make each of the sizes smaller

[@phuanhmatrix]

It's helpful, it's easy to follow and it's FUN! Trillion thanks buddy!

[@italiaandroid5044]

This is the funniest tutorial I've ever seen with a lot of "Fractal wiiii"... ahahah! Cheers mate, awesome! Simply awesome!

[@burkischerercgi4813]

Love the tutorial. Thanks a million! What about if I wanted the result of my animation just being outlined white in the end? So no filling but only outline.

[@ECAbrams]

There are a few methods to get edges of things. You might use the find edges effect for example. But, depending on how clean of a look you're after, that might not work. You can put edges on any layer with the layer styles. You might even create this kind of effect entirely inside a shape layer using offsets that could have a stroke as the outline. Do those ideas get you started?

[@BlackSkyoo7]

Oh man, I recently started editing again and I was looking through your tutorials when I realize the latest video was 3 months ago. I thought you quit youtube and for a second I felt sad because your way of explaination is the best. BUT- NOW THAT YOUR BACK HERE ARE MY TUTORIAL SUGGESTIONS- Something with flames POTATOES cucumber? but seriously, do you do any 3D stuff? Would love to learn some of that. :D

[@ECAbrams]

Adi Sharma I don't care for 3d stuff. And I believe that 3d is best left to c4d or some other dedicated program. I've really spent my days getting deep into Ae and it has left little time for other programs.

[@leetothevi]

Dude u are amazing... keep these videos coming man :)!!!

[@ECAbrams]

LeeToTheVi I'll try my best.

[@jelly._.cube86]

Thanks Evan! am a newbie to AE, I did the G R O S S Letter A and it looks pretty sleek ...hehe

[@neilgs2638]

Another gem! Your tutorials are always extremely helpful. Thank you for explaining Roughen Edges so well -- I will be using those tricks for many many applications. Will also be using the dividing "cells" effect in my movie. I would like to suggest a tutorial: how to fake the "Hyperlapse" effect using video footage.

[@dewangt]

it is so much fun to learn after effects from a Canadian Seth Rogen. i hope im not the first one of tell you that. thank you for all the amazing and punny tutorials Evan. really appreciate it

[@ECAbrams]

+Dewang Trivedi Glad you enjoy the tutorials. Did you know that the celebrity Seth Rogen is also Canadian. He's from Vancouver on Canada's west coast.

[@dewangt]

Wow. I did not know that. Thanks for the info

[@n8kress]

feels like seth rogan is teaching me fractals in after effects. i love it.

[@voldrice]

I enjoyed your tutorial a lot! It got me to a pretty nice point with splitting two shapes in a project. However my question is what if I wanted one of the shapes that just split change into a color? My teacher recommended to put my shapes on different layers. In your video they are all in one layer. I tried putting them on separate layers but they don't look nearly as good when they split as they do when they're one shape layer. So how would I change colors then without affecting the entire layer? If you would so kind to answer.

[@ECAbrams]

+Rita Vark you can make groups inside the shape layer that contain fill and stroke information if you like. Have you tried that?

[@ravenblake1035]

+ECAbrams your way of explaining thing is so much fun and informative, thank you for doing this.

[@Handcraftedcc]

Best tutorial person ever!

[@BraulioPallares]

Good to see you again!... I've been waiting for a while.

[@adrianamoine2509]

always fun to watch your tutorials :)

[@ECAbrams]

Thanks! Glad you enjoy them.

[@2modern2Bgenius]

My god, your tutorials are amazing. i learned so much

[@ECAbrams]

well thank you kindly

[@StansTechVideos]

Hi Evan, loved this tutorial, keep up the great work! Very well explained and easy to understand and follow :) Just one question, (a bit off topic), I was wondering what camera you used to record the introduction to this video. It looked very good quality and I'm looking into buying a decent camera for making videos and just wondering what sort of cameras other people use. Thanks!

[@ECAbrams]

Stan's Tech Videos It's an old Canon 60d. Not much special about it. Lots of light, EF 35mm 1.2 lens. Not much to write home about.

[@oceancampbell9222]

Great tutorial! Is there any chance you would be able to make a tutorial of an object being filled up with liquid?

[@MihaiDolganiuc]

Not only your tutorials are informative, they are also fun to watch! I am laughing hard ... :D "if only i knew an effect ... ohhh wait I do" :D Thanks for sharing!

[@lorenfriesen6661]

I might subscribe just for the awareness of the unimportance of your work. Or maybe it's the self-loathing channeled through the task of creating splitting cells, realizing that is how you started as a life form. Either way great stuff, thank you.

[@ECAbrams]

Sounds like this channel was a real bring down in 2015. We try to stay more positive these days.

[@fluffymeow769]

I enjoy watching this. You're awesome. Thank you for making such a cool tutorial.

[@SpongeBranded]

Wonderful tutorial, can't wait to toy around with this! Thanks so much and keep up the great work! :)

[@JimboHamster]

sorry for not on the topic.. i watched your Infinite Door Animation in After Effects tutorial, i repeated step by step like you and it is perfect, but when i tried of myself idea like etc,scaling up and down circle (instead of opening door) it animates weird,mix , apparently due cycle expression and layer beginning position , and i dont know how move next layers that doest weird animation , please can you do tutorial about this , for perfect set up these things for perfect animation.Thanks.

[@JesseMoffett]

YOU DID...THE THIIING! lol Abrams humor is awesome!

[@KayTang0822]

do u have a tutorial on splitting the A ?

[@GabrielePieraccini]

Great tutorial, thanks. What if I wanna add a border and have no fill?

[@ECAbrams]

There are a few ways. We can create outlines from elements using effects like the find edges and cartoon effects. Those might help. But there are also methods for doing a similar thing to this but with shape layers only that involves merge paths and a couple of offset modifier. That might be more appropriate? It really depends on the look. We might also use the stroke layer style, or stroke effect. It really depends on how versatile you might need the final look to be.

[@mattstirling7494]

So flippin' good. Thanks ECAbrams!

[@ParanoidFactoid]

So this is the second one I did. And I got it working. These are definitely more detailed than the beginner book I went through (though that covered a wider range of media types). I like that you're showing how to do stuff that most people would just buy a plugin for. But I have to admit that I'm at a loss for how to use it. Which might say something about my lack of imagination. Perhaps I need to do a few more. And then try to mix the tricks up. When I said before it doesn't really solve my problem, I guess what I mean is that none of these tricks are quite what I have envisioned. Which is a lot like music. I might hear something I think would sound good. But then try picking up an instrument and doodling around to create for real the ideal I would like to hear. It never quite works out that way, even if I wind up somewhat pleased by the final product. This will sound weird, but have you thought about doing a series on animation design theory? Color, shape, movement in time, the difference between too static and boring versus too busy and distracting... etc. I'd certainly watch it. Thanks again.

[@ECAbrams]

+Paranoid Factoid It's recommended that to make good piece you should first have a plan or direction. What do you want to create? You can mash a bunch of of tricks together make a mess but you need direction and focus to make something worth watching. You may find the process more enjoyable if you tackle projects that have concrete goals and objectives, and then look for tutorials covering how to solve problems that crop up in that project.

[@ParanoidFactoid]

Agreed.

[@sasawedx]

I subbed because of his personality

[@Mbahamut666]

Awesome, clear and very useful. Keep it up!

[@GNSproductions114]

Hello Sir, I'm really a fan of your site, I love all these aids you bring beginners in the field of motion design professionals alike. I want to please you bring me clarification on a subject, I have researched in vain because I did not find answers satisfied. If you want I state these questions: - What's a template after effect? - If I had to make a skin for a TV channel, what would be the process to follow, I mean what software used preferably, and in what format make my work to the customer. I'm not a pro in this area but my thirst for learning is boundless. Thank you for helping me to accept. God bless you and reward you long hundredfold all the good you are doing.

[@ECAbrams]

GNS productions a template is usually just a saved .aep file that people open and modify by entering text, images, and vector graphics into usually precomped and unlocked layers to create interesting things with minimal skill and effort. I don't know what a "skin" is in this context. Can you give me an example? If it's some kind of repeated graphics or bumpers or "what's on next" kind of stuff then you should maybe make that in Ae and deliver it in .aep format so people can open and modify it. Does that help and make sense?

[@GNSproductions114]

ECAbrams By "skin" i mean "ident" , "brand". However, this answer helps me understand the process of TV idents production and marketing. Thank you very much SIR.

[@Urbanmediashowcase]

welcome back bro!!!

[@SuperVideogamer9]

I followed along all the steps but my square still looks square with the roughen edge effect and doesn't have that nice curve to the separation... any help >~

[@Cameronshe]

Awesome tutorial! Just wondering how you filled up the cell right in the beginning? It looks great so I would really like to know! Thanks.

[@ECAbrams]

Cameron shefer boswell sure, I might get onto that one. It's mostly just shapes.

[@Cameronshe]

I had a quick look at the project files - I might be able to figure it out from taking a closer look at that. Looked liked you masked the shapes and then keyframed the paths?

[@ECAbrams]

Cameron shefer boswell yeah that's about it. I think a tutorial would help folks on the "why" of it so they can apply the method to many things.

[@Cameronshe]

Agreed! I would definitely watch that tutorial!

[@atropper]

thats great, how can i do this with 2 different looks of cells? lets say one is black and the other pink? how did you design yours? thanks

[@ECAbrams]

+asaf tropper so you would like a click cell to divide into one pink and one black? Or what is dividing into what? I designed mine by drawing. Not much to it.

[@atropper]

what i meant was: lets say i have an evel cell and a good cell. the animation im going for is that the good overcome the bad. so the question is how to make 2 different looking cells (bad is black and good is pink), using your effect the black will be observed inside the pink. i hope i made my self clear - and may the force be with you!!

[@LoofTroop]

I already started a project and i have two circles in separate layers. how would i go about with bringing them together in contrast to having two ellipses and a rectangle all in one layer.

[@ECAbrams]

you could precompose then, and use either an adjustment layer with similar effects, or just apply the effects to that comp? does that work for you situation?

[@LoofTroop]

@@ECAbrams Yep that works. thanks!

[@jasonbourne5527]

Hi Evan! I'm your real fan..love every your tutorial and waiting for new ones! Can you please suggest me a tool for compressing AE projects(i mean videos) without losing a quality? Thanks in advance. Arslan.

[@evapieters9185]

thank you so much :D Very clear tutorial and I loved your funny comments during it :)

[@theCrone123]

Thanks Mr. Abrams! awesome and also entertaining as always :)

[@ericrubinoff2967]

Excellent tutorial thank you for taking the time to do it!

[@laurpc]

Really helpful thanks! Happy holidays! :D

[@ВераОмельян-ф1з]

Thank you so much for great video! I tried to make this lesson till the end but... failed!((( Problems with the Stroke. It works with layers ignoring effects. how can I explain...hmm... I add "merge layers" and "stroke" but I see that stroke is on original layes "rectangle+2 ellipses", no stroke at smooth line which we've made by "roughen edges". What's wrong with me? :D

[@dalebauer2398]

Hey Evan, I'm going to school for this exact thing, motion graphics and I'm wondering if you got your start in school for the same thing?

[@ECAbrams]

+Dale Bauer when I went to school this wasn't a thing.

[@dalebauer2398]

When did you start to learn this stuff out for yourself?

[@ECAbrams]

+Dale Bauer Probably high school. But there is no wrong way to learn... unless it's by smooshing a book into your eye. That only teaches the fundamental incompatibility of books and eyes.

[@jacobjames106]

How would I start with the eclipse being Purple, then split into two as if it was splitting between two colours? for example by starting at purple it would split the two blobs into red and blue?

[@DarioMestre]

is it possible to do the same with strokes?

I love your humor, great tutorial!

[@LoganHemenway]

Thanks Evan!

[@rafaelaoliveira3013]

Hi Evan, I tried to do the letter A in the same as the shapes, but something went wrong, it's really bad. Could you do a tutorial just about this? Thanks!

[@kokolight2]

how is your Adobe After Effects client colored blue and black ? it is so awesome!

[@ECAbrams]

kokolight2 I'm using Ae CC 2014.2, those are teh default colours.

[@kokolight2]

so cool! thanks for the quick response! love your videos!

[@ohhMeko]

Amazing work, really! Already a sub. A question on the spliting 'A' how did you achive that shadow? Looks really nice ;)

[@DSTRone]

Would also like to know! Thanks!

[@MatthewRogers13]

this is great tutorial. The "give me your drugs" part had me rolling. Informative and funny. keep up the great work!

[@avtones7400]

best youtube tutorials!!!

[@AddlerMartin]

Saved my work, man. Thanks

[@ddiboo]

Thank u so much! ♡

[@Mustang-bl2vz]

You Rock Dude I like your way of description :) LOL after effects-ing I like that :D

[@madeleinewelsch9971]

Hi! How did you make the separated shapes rotate/move before joining back together?

[@Kinnetikz]

Is there a way to do this that’s supported by bodymovin for web export?

[@matthewmolloy5090]

thanks Evan. Educational and entertaining

[@2modern2Bgenius]

Was gonna ask how you keep your outer edges straight while making the blobs inside super messy, but i saw that you have masks. But how do you keep the outer edges of the a straight on the sides? is it in the numbers?

[@ECAbrams]

It's all in the numbers. You have to strike the balance in understanding what exactly is happening in the effects we are using.

[@ashley_roca]

Is there a way to do this with shapes that just have stroke and no fill? I've tried experimenting with merge paths to see if that would help with anything, but no matter what I do, even when the rectangle shape has a vertical scale of 0, the stroke is still visible, and thus, the shapes never fully separate.