Create Sprites with or without framed animations to use in your Game.
Pixart can be accessed via the bottom Toolbar > Build > Pixart.
The Toolbar will display all available Sprites in your game. If they are animated the animation will play in the preview.
Tap the + icon on the left to create new sprites. You can choose to search for pixel art assets from the asset library or create from scratch. The plus can also be used to duplicate or delete the selected Sprite.
Drag Sprites into your scene from the Bottom Toolbar to add them to your game.
Select a Sprite then tap the pencil icon to open it in the Pixart Editor.
| Brush Tool | Paint pixels. With the Brush selected tap again to select different Brush Tool Types |
| Line Tool | Draw a straight line. With the Line Tool selected tap again to select different Line Tool Types |
| Select Area | Select an area of your pixel art. With the Select Area Tool selected tap again to select different Selects Area Types |
| Fill Tool | Fill an area with a solid color |
| Erase Tool | Erase pixel |
| Color Picker | Select a pixel to select it's color from the color palette |
| ↶ Undo | Undo the last action |
| ↷ Redo | Redo the last undid action |
| Lock | Lock the movement and/or transform of selected pixels. See Lock Types for more info |
| Random | randomly selects a color from the color palette for each pixel as you draw |
| Play | Test the Frame animation |
| Brush | Paint using a solid brush |
| Spray | Spray pixels at an area. Control the size and density of the spray with the sliders on the right. |
| Frame | Select an area of pixels and paint them |
| Line | Draw a straight line |
| Rectangle | Draw the outline of a rectangle |
| Filled Rectangle | Draw a solid rectangle |
| Circle | Draw the outline of a circle |
| Filled Circle | Draw a solid circle |
| Select Area | Select an area based on the Brush size |
| Select Rectangle | Draw a rectangle to select all pixels within it |
| Magic Wand | Select a pixel to select all pixels of the same color that are touching |
When an area is selected a Widget will appear that allows you to transform the selected pixels
| Move | Move the selected pixels |
| Rotate | Rotate the selected pixels by 90° (only available if the selected area is uniform) |
| Flip Horizontal | Flip the selected pixels horizontally |
| Flip Vertical | Flip the selected pixels vertically |
| Duplicate | Duplicate the selected pixels |
| Scale | Scale the selected pixels |
Lock types are used when transforming a selected area of pixels or using the line tool.
| Free | Move, Rotate or Scale freely |
| Horizontal | Move, Rotate or Scale only on the horizontal axis |
| Vertical | Move, Rotate or Scale only on the vertical axis |
| Diagonal | Move, Rotate or Scale only diagonally |
| Tool Size Slider | Adjust the size of the selected tool. An outline of the brush size appears on the canvas as you adjust the slider. This slider is used by multiple tools and can be set at different sizes for each. |
Select the Colors Tab to select or edit a color or color palette
Tap the Menu icon on the left to Create a new palette or duplicate/rename the selected palette.
Tap a color from the row of swatches to draw with that color.
Tap the pencil icon on a selected color to edit that color.
Select the Frames tab to create or edit framed animation.
Tap the Menu icon on the left to Create a new Frame or duplicate/rename the selected Frame.
Tap the Manage tab to edit the Sprites settings
| General Settings | |
| Show Pixel Grid | Show a grid where each square = 1 pixel |
| Black Background | Make the background black instead of a grey checkered pattern |
| Onion Skin Frames | Select how many Frames are previewed when using Onion Skinning* |
| Sprite Settings | |
| Name | Give your Sprite a name |
| Width | Set the width of the Sprite |
| Height | Set the height of the Sprite |
| Animation Frames | Set the frame rate for the Sprite's animation |
The value set in the Animation Frames setting is the number of runtime frames each Sprite frame will be displayed for when being played.
Example:
HypeHype runs at 60 frames per second so at the default value of 12 you will get 5 frames each second (5x12=60)
In animation Onion Skinning is the process of showing frames before and/or after the current frame being drawn to help create smoother animations.
When using Onion Skinning the selected frame is at full opacity while the other displayed frame(s) will be semi transparent. The amount of transparency will depend on how many frames are visible at once and how far each frame is from the selected frame.
To use Symmetrical Drawing Mode zoom out until you can see the whole canvas and some space around it. Outside the canvas in the upper left corner there are two handles, one for each axis. Drag the handles to set the center line of either axis or both. They can be placed anywhere.
Once a center line has been placed pixels drawn on one side will be mirrored on the other.