Pixel Art Animation with JuiceFX | Simon Sanchez | Skillshare

Pixel Art Animation with JuiceFX

Simon Sanchez, Game Designer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
6 Lessons (27m)
    • 1. Quick Tour

      8:45
    • 2. Slime Idle

      1:59
    • 3. Character Animations

      4:58
    • 4. Button Animations

      3:07
    • 5. Bush Idle

      1:54
    • 6. Tree Idle

      6:24

About This Class

In this class I will teach you how to make quick and fluid animations for your pixel art with a new tool called JuiceFX.

With this tool you can quickly make different animations just by moving sliders, then you can export those animations to use in your videogame, for example.

We will start with a quick tour around the software, and then we're going to work in some small projects.

187b7453

This class is part of a pack of classes about pixel art, you can decide to take all of them (Suggested for beginners) or to take the ones you prefer.

Part 1: Introduction to Pixel Art

Part 2: Making an Item Set

Part 3: Make a Sideview Pixel Art Mockup

Part 4: Make a Topdown Pixel Art Mockup

Part 5: Pixel Art Animation

Part 6: Convert Any Image to Pixel Art

Part 7: Animate an Explosion in Pixel Art

Part 8: Make a Topdown Pixel Art Interior

Part 9: Pixel Art Animation with JuiceFX

Transcripts

1. Quick Tour: Hey, in this bonus sexual, we're going to take a look at the stool. Cal Trees, FX. This section is not the sponsor. I was given a key off the software from a student. So we treats FX. You can easily make certain animations for your bigs alert. So if you search on Google for Theresa X, you will go through the's each page where you can buy the software and you will have some information. All right, so we're going to have a quick tour around these software. So when you open it, you would have something like this. All right, You have wonderful sprayed. So because there is no documentation about the software, we are just going to play around with the things and see what everything does. So you have new to make a new brush ache to save it, loaded to save a preset, so different configurations off the bars to load a preset on someone. So we're going to start with burst, right? We're going to modify here unless you can see, we are already seeing the effect both our animation. If you click simulate, you will see what your current animation looks like. So we're going to move horizontal That right now let's try with more damping witness. So this way you can play with the different throws. Have vertical. All right, let's see some skew on this. You can see already we have some really interesting stuff. We also have flash, for example. We can increased the intensity. We can change the color to our rail. Simulate. We've been changed its name. And there we have on attack animation, for example. We're gonna also shake these little bit kindness more. Did that right? You can play it. Animation. Bieber's doesn't make any difference if they see us had actually d. So this way you cannot really noticed. It is like that while if we make something like that, if you're right, click. Sorry. If you middle click on the bars, you will reset the default value. All right, so we're going to come here to stained on the's are animations that repeat over time, as you can see. So we're going to check the HD with making something, for example, like that. So as you can see it this way, we have a Pixar animation, so it gets the firm bar. If I press HD, then it doesn't cab that deformation. So this is really high resolution pictures art, But when we start working with less resolution were clearly going to see the difference between pixel on h et You also have here the preview scale. So that's the scale of Tiberius on dicamba size. If you're working with bigger spreads, so you have a limit off 512 by 512. So we're going toe, keep playing a little bit with values, so there you can see the difference. All right, you can go the presets on reset to reset all the values. You have some FX, for example. Great skill. I'm blur. Have some color. You can add an old line, for example. Really See you contained you can play a ballet. You have some quick pallets, right? And you have some other options. For example, fade out this way you can destroy your sprite, make things like these. You can make it affected by gravity. So if you have a glass, for example my fight hate on the week. That's be of all right. It's a really skull stuff. It has to have some presets. You can champ, for example, Ah hit a strong hit grave and so on. I have something all right. On some other things. You have layers, you can deactivate them, Move them and you can low some other sprites, right and turn on tissue can move it above. If you have a layer selected with Ray clicked on moving, you can move your layer right on. You can animate individual layers. So let's reset the animation and we're going to take a look to less things to change the anchor point and come toe expert our animation. So I'm going to go toe times on green, too. Increase here to school. As you can see, we have a nerd on anchor point here at the bottom you and Greek show mask and here we have it. If you want, I can click a move thes anchor point to get up, for example. And now it's moving like this. Come on, it here the musical on So are right. So let's keep it like that. Now we can click render You can see we have a cat on the animation. You can come here to render time on increased stays to to for example, right. You can save us being sheep. This is going to generate a spreadsheet. You can save each in the bigger frame on its own. Bong, you can say a give which is going to be saved on the insulation folder off the software on you can go and said We're going to say as being she here, here, the best up aunt. Here we have it. As you can see, it is a lot of frames. You can decrease the number of flames here on f b s. Right, Let's render again. And now we have less frames. In the next video, we're going to start making some Greek animations with these somewhere. 2. Slime Idle: Hi. In this video, we're going to make a quick idol animation for a slime on trees FX. So we're going to start by loading a sprite here. I'm going to subject us. Lame students eat pieces are really low resolution Islam, and we're going to create an Ural Animation we're going to go to tamed. I'm you're going to increase a recent title here. I'm vertical with these. I'm very going to change the anchor point to here at the bottom. So this way it's not moving, and we're going to keep it on the floor like that. There we go right away. You're gonna have to show the mass to move the anchor point you can do it shows simply by left clicking, right. As you can see, we have a lot of information. I got ism for the firming s sprites are not perfect. You're going to use actually in this case, and you will can a lot less off the formacion. All right, We're going to increase the render time here to to render right next to concede. We only kind of spark individual frames on the age of the mold. That's case you can decide to use Big sell or HD, you can always showing all the individual frames on a spreadsheet with other tools later. I'm just going to export this as vixen, right? Save slamed. I'm here. We have the spreadsheet. As you can see, they are a lot of frames, but it is a really fluid animation interacts video. We're going to make some attack animations for character. 3. Character Animations: in this video. We're going to make a quick attack animation for our character. So this information is going to be played when the character is attacked. So instead of Stein, we're going to use burst. So we're going to start with adding a flash. We're going to go a little bit to share with some rather right. This flash needs to be faster. That and we're going to hell. For example, some skill. Print your central axis. You're going to place the anchor point here, right? It is a bit more smooth here that let's see what we have own. Sq. That's lower thistle. Little bit. See? Let's make thes faster. Anya Solis Play with values Sunday. Dad, I think it's fine. The answer can check the presets. Here we have one hit, right? Uh, we can export thes render safety and she Jarrett there we can say a preset, for example. Jerk. There, Sarah shoes a tag. And then if we lower, for example, this lame again, we can select the layer load. Preset. Yes, on. We opened that file on there. We have the same preset right now. We're going to animate a strong attack. So we're issues going toe exact rate a little bit. Sees with some shake that, for example, it sees some vertical here. That way, right. I think that works for me. Render see SAPIEN She chereque their back strong. And we can also save these for a set. And we can test it on this lame smoke thes. Here we go on. We're going to animate on evil animation. We're going to go to presets reset on this case time. Let's see what we can do. Some vertical here. It works fine. In this case because a respondent is really lower solution. We might want to switch toe HD. Right? So that's what we come. Some breathing, right? So H d se frames We're going to make on your folder for thesis. Right? Let's come here. Okay. We have each frame on each individual layer. Internet video. We're going to make some quick animations for bottles on a video game 4. Button Animations: in this video we're going to make to animations for about, um, for a video game, very going to make a select animation on a press animation. So because thesis ESP rate is really low resolution, we're going to switch Toe HD to avoid extreme deformation. We're going to go to time and we're going to start with the select animation. So we're going to add some rotation. For example, we're going to change t anchor point on the middle, and there is already looking pretty good. But we can add some shampoo, for example, that maybe less you can input Augusta number. Right clicking on you can input value here like that. Let's see what us we can do some scale. These right on that is looking pretty good for me so we can render thes We're going to say reset, select. So if we have more bottoms, we can use that Brissett All right, then we're going toe reset and actually know where she's going to go to burst. We're going to animate our kids are breast bottom animation. So we're going to use flash this this case and going to use Sion. Let's see what else All right, Maybe less time here like that. And we're going to stairs to fade out. So let's enabled Kiss. We're going to add some delay. So it seems like there is a book right now on dispersion off the software where if you use brake on HD, the sh other animation is really smile. So the pieces so we can use fade out right now on this version, at least on a city. So we're going to keep it like that. Saeb reset. We're going to name thes like, for example, on interacts Video. We're going to animate a bash, it'll animation. 5. Bush Idle: in this video, we're going to animate the little animation off a bash on Juries FX. So it's going to be a bread is similar to this lame. We're going to move with the anchor point to the same place and we're going to go to time. Alice Starving some X sq it is. We have some wine. Maybe we can move thes if it low that and some why Skew moved time A little bit off rotation some sometimes right? And as a at some way, we weren't that there is actually looking pretty cool. You can switch to HD to see it. The Cindric credit goes on HD burning pixel. It looks nice. Of course, you can always clean up your spreadsheet later. So you have some were big still here at the bottom that you can qualify. But it is a really fast software to make really fly animations to your straight so you can render thes. In my case, I'm not going to did what? Intellects video. We're going to animate a more complex animation with several layers. We're going to animate the either animation off three 6. Tree Idle: in this video, we're going to animate the eagle animation off a tree on trees FX. So they have several layers. So and green too low a spread of the 1st 1 can seek. EI cab. My trees separated on several parts. I had the tranq, the top, a shadow, some flowers, a background and some apples and going to start with loathing t oppose. Then get up then and going to load the tranq, the shadow flowers on the ground and green to turn down the layers on care we helped and green to move my flowers. I've offed each other and there we have something like this. So we're going to start with the tree, sir, with it up and going to move the anchor point here, Alice, go to time. So let's see. Well, that we can move in my case. Not going to your stairs, but maybe summary. Cental like this. Right? Some rotation we can use on some eggs. Sq, begin other. Some shampoo. Ah, astringency. When it shams, you have some m d pixel here. You can right click and move the trunk. Some pictures down. That perfect. Let's see. With some wave, we're going to move it a little bit. That on Perfect. All right, so that's what we can. That's animated couples a little bit. I smoked the anchor point of this'll the middle. Rick Dees It's as a sham, some irritation unless it agrees a little bitty effect. Things here right now. Let's go to the flowers. It's, uh, some wave. Let's just play a little bit with the values, right? Let's go with the shadow now and going to move younger point here. I'm too drunk like that. You can keep playing with values, etc. So I think that looks fine. I am going through under days. Has been she free evil on here? We have the animation, so this concludes this bonus section. It wasa quick tour toe a new tool. I am pretty sure that this stool is going to be updated on is going to add more feature on . It's going to come more powerful. So if you're interested, I think it's a radical tool. It still needs some modification is cancelled bags something's toe correct some things to add. But right now it's can get some really cool animations really fast, So I cup that you have in sureties of sections. Thanks and have a nice day