Notice: This Wiki is now read only and edits are no longer possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.
Difference between revisions of "UIGraphics : Specifications : FileFormats"
m (→PNG - Portable Network Graphics) |
m |
||
(3 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | Return to the main '''[[ | + | Return to the main '''[[User Interface Guidelines#UI Graphics (3.x Updates)|UI Graphics (3.x Updates)]]''' section on the UI Best Practices page. |
Line 30: | Line 30: | ||
*Wizard Banner | *Wizard Banner | ||
− | + | ||
== SVG - Scalable Vector Graphics format == | == SVG - Scalable Vector Graphics format == | ||
SVG is a language for describing both two-dimensional and animated vector-based graphics in XML. One of its distinguishing attributes is its scalability: One size of an image will scale nicely to unlimited sizes. While there is great potential in using SVG for user interface graphics, especially on palettes and in diagrams, it currently has limited use in the tooling. | SVG is a language for describing both two-dimensional and animated vector-based graphics in XML. One of its distinguishing attributes is its scalability: One size of an image will scale nicely to unlimited sizes. While there is great potential in using SVG for user interface graphics, especially on palettes and in diagrams, it currently has limited use in the tooling. | ||
+ | |||
SVG is used for the following types of graphics in Eclipse-based tooling: | SVG is used for the following types of graphics in Eclipse-based tooling: | ||
Line 67: | Line 68: | ||
*Product icons (Mac) | *Product icons (Mac) | ||
+ | |||
== XPM - X PixMap format == | == XPM - X PixMap format == | ||
Line 75: | Line 77: | ||
*Product icons (Linux) | *Product icons (Linux) | ||
+ | |||
+ | |||
+ | ==Resources== | ||
+ | *Mac | ||
+ | **http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/index.html? | ||
+ | **http://www.oreillynet.com/pub/a/mac/2001/05/24/aqua_design.html?page=1 | ||
+ | *Windows and Mac | ||
+ | **http://www.altuit.com/webs/altuit2/StandaloneBuilderTutorial/BuildingIconsforMacOSXandWindowsXP.htm |
Latest revision as of 19:55, 14 November 2007
Return to the main UI Graphics (3.x Updates) section on the UI Best Practices page.
Contents
GIF - Graphics Interchange Format
GIF is the most common file format used in Eclipse-based tools. GIF images are raster-based, can have transparency, and tend to use a small amount of memory and disk space. Each GIF file contains a color palette of up to 256 individual colors. This format is most suited to images that use flat colors or have a limited number of colors. It is not a suitable format for photographic images.
The lossless compression method used in the GIF format suggests that the compressed image is identical to original image. However, because GIF is not capable of full color, images than contain greater than 256 colors will loose some of the original color through dithering, which creates the illusion of greater color depth by approximating the original colors used. Because of their physical size, 16 x 16 pixel icons can only accommodate 256 individual colors, so dithering is never a concern. However, it is something to be aware of when creating larger images.
GIF is used for the following types of graphics in Eclipse-based tooling:
- Product
- View (includes Perspective and Fast View)
- Toolbar (includes Toolbar Wizard)
- Local Toolbar
- Model Object
- Object Overlay (includes Underlay)
- Wizard Banner (some not yet converted to PNG)
- Table
- Palette
- Diagram (exceptions noted below under SVG)
- Progress Indicator
- Miscellaneous (there might be exceptions)
PNG - Portable Network Graphics
PNG is a bitmapped image format that employs lossless data compression. PNG was created to improve upon and replace the GIF format, as an image-file format not requiring a patent license. PNG is pronounced "ping" (/pɪŋ/ in IPA), but can be spoken "P-N-G" (as described at http://en.wikipedia.org/wiki/PNG). One of the great values of PNG format is it's support for alphas or transparency, allowing bleed through of the background on which these graphics sit.
PNG is used for the following types of graphics in Eclipse-based tooling:
- Wizard Banner
SVG - Scalable Vector Graphics format
SVG is a language for describing both two-dimensional and animated vector-based graphics in XML. One of its distinguishing attributes is its scalability: One size of an image will scale nicely to unlimited sizes. While there is great potential in using SVG for user interface graphics, especially on palettes and in diagrams, it currently has limited use in the tooling.
SVG is used for the following types of graphics in Eclipse-based tooling:
- Diagram (Action Bar only)
In designing graphics for SVG output, use a minimal number of elements in each image, especially for small 16 x 16 icons. This will help ensure image clarity, and fewer elements will keep the file size small.
BMP - Bit map format
BMP is the standard Microsoft Windows raster image format.
BMP is used for the following types of graphics in Eclipse-based tooling:
- Pointer
- Cursor
ICO - Icon format
ICO format is used on the Microsoft Windows operating system and is required for product install and launch icons, including desktop, treeview, and menu icons.
ICO is used for the following type of graphics in Eclipse-based tooling:
- Product icons (Windows)
ICNS - Mac Icon format
<Description to come>
- Product icons (Mac)
XPM - X PixMap format
XPM is an ASCII image format that supports transparent color. This image format is used on Linux and is required for product install and launch icons, including desktop, treeview, and menu icons.
XPM is used for the following type of graphics in Eclipse-based tooling:
- Product icons (Linux)