Piskel Image Editor

In this lecture we're going to talk about the pixel art software. I will be using throughout this course. I'm going to be using preschool and you can see right here I've got it up if you want to use preschool . The nice thing about it is that it's a web browser based program so you can use it in any operating system. Just use it in the web browser in Chrome for example so if you go to w w w dot Biscoe app dot com and that's spelled P S K E L A P P dot com you will come up with this. You can go to offline versions if you need to download an offline version and use this pixel or program without the internet. You can do that and that's available on Windows and Mac OS otherwise. Actually I need to log out right here. Otherwise you're going to press log in. It's going to take you to your Google account emos you can select an e-mail to log in with and it'll take you to kind of an overview that should have a list of all your saved projects your public your private your deleted projects and some stats down here. So to get started to create a new project or a new canvas I guess to draw on you're going to go to create preschool and it should come up with a new window here you can scroll in and out with a mouse button to zoom. Now one of the reasons I chose this program is because it's absolutely free. It doesn't have a lot of features to it. It's kind of basic but it's free and it has some of the important features that we're going to need . First of all you can do animations with it so you can add new frames this way and do animations absolutely free. It also has layers. Over here you can see we've got layers on the side. So even though it's got some only some basics it has all of the basics. So that's what's important about it. Over here on the left hand side we've got the different tools we have a normal pen tool which has both a left mouse button and a right now button for a primary and secondary colors like in left click click here to draw the primary color. Right click to draw the secondary color which in this case is actually a transparent color so it erases . But it could be set to any color and we've got that vertical mirror pen. This will draw and mirror exactly what you drew on one side so if you're drawn a spaceship it's going to be really nice because it will keep everything symmetrical in your pixel art so that that's super useful. And I mean look I can you can draw a pretty cool looking spaceship without even doing anything. We also have the paint bucket tool which obviously just fills an entire space with the color you were using the paint or pixels of the same color. This will only affect the pixels. There are a certain color so if I paint this in it's going to do all that because that's all black. But if I had a different color in here so let me add a different color here. And I want to pay every all the black things blue I can choose this and it will fill all the black even if they're not connected. So you can see they're not connected anymore but they're all black and I can make them all blue. Still even if they're not connected. So that's what that does. And the eraser tool you can use to erase pretty basic stroke tool allows you to draw lines which is important because you can get nice clean lines rectangle tool pretty obvious Jarek type rectangles circular tool draw circles. We have a move tool or we can move stuff around on the canvas a shape selection which is just it allows you to select everything that's kind of touching. So you can select that rectangle selection lasso selections you can select a specific lasso type shape if you need it has light in and darken which we're probably never going to use. But if you left click on something it will try and lighten it a little bit and then if you think if you right click now it looks like it's still dark or light. And that shift is cool because then only if you hold the shift it doesn't do quite so randomly control it looks like control darkens yield control. So that's not really useful dithering. This will just draw but only at every other line. So we're not going to go into a lot of what that means but it allows you to basically create a checkerboard and then finally the color picker if you miss the color and you need it back if it's not in your palette you can color pick to grab that color. Obviously it's best if you just have it in your palette if you want you can use there's hot keys if you hover over each of these It'll show you the hot keys the suction to hockey is as I'm just going s select the entire thing and press delete. And that gets rid of it all over here on the right hand side. Now we've got our this is the preview window which will preview our animation. We currently don't have an animation but let's create one real quick so I'm going to do a stick figure guy. A stick figure guy. Sweet. OK so I've got a stick figure guy here and we're going to add a new frame and you can see it's blinking over here because the preview is actually animated. If we toggle the onion skin we will build to see where he was in the previous frame. So this could a new frame using this onion skin we're going to draw this leg like that that leg like that. And this arm like this and this arm like this and have his head forwards and this is the worst animation in the world. But you get the idea and we can slow this down to four frames per second. And he's like maybe doing a dance of some sort here so we've got an animation with the two different frames and that's what this is for we could turn off onion skinning now so we can't see it. Now you also have the ability to do layers which just if you needed to for your animation you could create certain maybe arms on their own layer legs on their own layer to simplify things so you don't have to worry about coloring over things you already like. You probably won't be using that a lot. We also have the transformed tools and the palette. Now I have this basic palette right here that I created. If you do current colors this does all the colors on the on the screen currently we can create a new palettes that is to create new palette in this. I'm just going to call this new palette. We've got our colors right here and we can add a new color and select Red maybe add another color select green add another color. I'm just getting some random colors here and save. Now I've got this new palette we can choose from the different palettes that we've created here or we can edit palettes that we've already created just for the colors that we need over here on the very far hand right corner we've got our preferences. What we want the background to look like layer preview opacity grid if we want to turn on a grid to pixel grid 3 pixel grid. It just helps you to see the individual pixels easier. You can resize the canvas with an anchor point. You can save this or you can save in your browser to your gallery or save off line. I'd recommend saving both to your gallery and off line. I don't really see the sense in saving in your browser. We can export the sprite as a sheet. This would be if you need to bring this into a game of any sort. And then finally you can import sprites as well or other images. So that's a basic overview of the program that we're going to be using. Like I said it's really basic simple but it has all the basics that we need and it's absolutely free and should work for everyone. So that's why I chose it. Thank you guys so much for watching and I'll see you guys in the next lecture.