- Prizm Icon Design Guidelines
- 05 May 2011 10:35:46 am
- Last edited by JosJuice on 03 Aug 2017 02:22:55 pm; edited 11 times in total
First, I would like to thank Tari for his icon creation and extraction tools which helped me a lot when creating this topic, and everyone else involved in Prizm hacking for allowing us all to be able to do what we can do with the Prizm right now.
Icons are a part of Prizm add-ins that are usually considered unimportant. They don't affect the add-in itself, but it's still a good idea to create a nice set of icons for any program. Users will see it even when they aren't running the program, and if the Main Menu is full of icons that don't adhere to a few guidelines, navigating the menu can be confusing.
Style
The object that's the main focus of the icon shouldn't take up all of the 92x64 pixels that it has access to. It should generally be a bit smaller since the background and other elements also need a bit of space. The official icons from Casio are somewhat colorful, a bit 3D-looking, have shadows and are slightly translucent. You can follow the style of these if you want to, or create your own kind of icon. 2D sprites usually work fine if they aren't too similar to the backgrounds.
Example icons:
Selected/Unselected
In all add-ins, two icons must be provided - the selected icon, and the unselected icon. The two icons should show the same objects with different backgrounds - not objects that are completely different from each other or the same objects with minor variations. There is one exception, though. When placing text in the icon (this should only be done in special cases, not for writing the name of the add-in!), the text in the unselected icon should be white with a black outline and the text in the selected icon should be black with a white outline. Run-Matrix and Equation are examples of this. The unselected icon needs to have a pure black background, and the selected icon needs to have this background:
If no custom icon has been made for your program, the background with nothing on top of it should be used for the selected icon. Never make the selected icon pure black!
Areas drawn by the OS
The Prizm OS is a bit unusual when it comes to icons, as it draws on top of certain areas. Those areas are marked in red here:
The square on the top right area of the icon will always be completely unseen, and anything important shouldn't be placed there. However, hiding defects or other odd things there is not recommended, since some users might use something other than the OS to view the icons. The larger area on the bottom is where the name of the add-in will be placed. The main focus of the icon shouldn't be under it, but the area won't be completely covered, so things that aren't very important can be placed there. For example, a small part of the ruler in the icons of Conversion and Geometry is placed there, and an unimportant part of one of the images in the Picture Plot icon is also placed there. The name of the add-in should never be included in the icon since the OS takes care of including it.
Icons are a part of Prizm add-ins that are usually considered unimportant. They don't affect the add-in itself, but it's still a good idea to create a nice set of icons for any program. Users will see it even when they aren't running the program, and if the Main Menu is full of icons that don't adhere to a few guidelines, navigating the menu can be confusing.
Style
The object that's the main focus of the icon shouldn't take up all of the 92x64 pixels that it has access to. It should generally be a bit smaller since the background and other elements also need a bit of space. The official icons from Casio are somewhat colorful, a bit 3D-looking, have shadows and are slightly translucent. You can follow the style of these if you want to, or create your own kind of icon. 2D sprites usually work fine if they aren't too similar to the backgrounds.
Example icons:
Selected/Unselected
In all add-ins, two icons must be provided - the selected icon, and the unselected icon. The two icons should show the same objects with different backgrounds - not objects that are completely different from each other or the same objects with minor variations. There is one exception, though. When placing text in the icon (this should only be done in special cases, not for writing the name of the add-in!), the text in the unselected icon should be white with a black outline and the text in the selected icon should be black with a white outline. Run-Matrix and Equation are examples of this. The unselected icon needs to have a pure black background, and the selected icon needs to have this background:
If no custom icon has been made for your program, the background with nothing on top of it should be used for the selected icon. Never make the selected icon pure black!
Areas drawn by the OS
The Prizm OS is a bit unusual when it comes to icons, as it draws on top of certain areas. Those areas are marked in red here:
The square on the top right area of the icon will always be completely unseen, and anything important shouldn't be placed there. However, hiding defects or other odd things there is not recommended, since some users might use something other than the OS to view the icons. The larger area on the bottom is where the name of the add-in will be placed. The main focus of the icon shouldn't be under it, but the area won't be completely covered, so things that aren't very important can be placed there. For example, a small part of the ruler in the icons of Conversion and Geometry is placed there, and an unimportant part of one of the images in the Picture Plot icon is also placed there. The name of the add-in should never be included in the icon since the OS takes care of including it.