Spriter User Interface

The main Spriter window is comprised of two regions. The region on the left allows you to preview the different outputs of the current Spriter project. The rightmost region allows you to edit the project.

Output views

• Image - displays a preview of the sprite sheet that will be generated. You can also rearrage images by dragging sprites around, select sprites, access sprite properties and remove sprites.
• CSS - displays a preview of the CSS required for the sprite sheet
• Preview - displays a HTML preview of the different sprites in the sheet

Project views

• Layout- allows you to configure basic project settings such as sprite sheet size and packing method
• Files - allows you add and remove images from the sprite sheet
• CSS - contains settings for customizing the CSS
• Effects - allows effects to be added to images in the sprite sheet
• Optimize - allows the output sprite sheet to be post processed using OptiPNG. (This view will only be available if the OptiPNG addin is installed and loaded)