Home > Image Object Packs > Function Icons

Function Icons

Image Object Pack for IconWorkshop

Available to users of the Professional EditionAvailable to users of the Home Edition

Description

Usage: Creation of icons for application toolbars, menus and websites.

Contents: 488 Objects - hi-res PNG with alpha channel

Author: Liam McKay Custom icon creation service available from the author.

License Type : Royalty-free, third-party pack user license (see Agreement)

Recommended Products:

Axialis IconWorkshop

File Size: 4.51 MB

Downloads: 47285

Pack reserved for registered customers - Trial pack available

This pack is reserved for registered customers. A valid product key is required to download the full version containing all the objects (488 objects). If you are not registered, you can download the Trial Pack which contains a limited number of objects (40 objects, including derived ones). Using this pack you'll be able to create a few sample icons. You need the Trial Version of Axialis IconWorkshop to use this pack.

Description

Function Object Pack is composed of 488 objects (read more about objects) which permit creating icons for toolbars in 48x48, 32x32, 24x24 and 16x16 formats. Using drag & drop, you can create icons by associating basic objects and action overlays. The style is clean and professional which make them suitable for commercial applications.

Below is an example of an icon set which can be done in a few minutes using this pack:

122 objects are provided in 4 different sizes. The pack permits creating toolbars icons in 48x48, 32x32, 24x24 and 16x16 as required in modern applications compatible with Windows Vista multi-DPI capabilities. The original drawings of the objects are larger and aligned on a 4-pixel boundary to produce perfect looking icons. When you add an object to an icon, the image is scaled down resulting in a crisp and sharp hi-quality icons as as shown below:

Object Size
Icon Size
192x192
48x48
128x128
32x32
96x96
24x24
64x64
16x16
     

License Agreement

All the object remains properties of Liam McKay. You can use them royalty-free to create icons and use them in personal and commercial projects as long as you respect the terms of the User License Agreement.

The pack is based on an icon set by Liam McKay from weFunction.com. This company offers graphic design services for icons, skins, logos, websites. If you need additional custom icons in the same style, we recommend that you contact the team for a quote.

Contents of the Pack

The pack contains 488 image objects (122 icons in 4 sizes). Objects are optimized for 48x48, 32x32, 24x24 and 16x16 icon creation but they can be used for other sizes. Large objects are provided in PNG formats. A set of ready-to-use icons in ICO format is also provided at smaller size (folder "ICO")

Here is the list of objects included in the pack (red lines have been added for copyright reasons). The objects are shown in final sizes as present in ICO files: 48x48 to 16x16. The objects are provided in larger sizes (192x192 to 64x64) for better visual results during downscaling. Several other objects are also available to create more buttons and compisite icons with various overlays (see below).

Folders "48x48, 32x32, 24x24, 16x16"

Folder "Button"
(Image objects are provided in 4 sizes 192x192, 128x128, 96x96, 64x64)

Folder "Overlays"
(Image objects are provided in 4 sizes 192x192, 128x128, 96x96, 64x64)

 

What is an object and how to create icons from objects?

An object is a simple graphical object provided in high resolution. Objects also contain an alpha channel which permits to create interesting effects like semi-transparency, lighning, outer or inner glow, shadows...

An object usually contains one part of the drawing witch cannot be used alone. You need to combine several objects together in order to create the final artwork. This can be done very easily by simple mouse drag & drops in Axialis products.

To get more information about objects, icons and icon creation, visit the links below:

 What is an Image Object?

 How to use Image Objects to create Icons?

How to use the icons in your toolbars?

If you want to add icons in application toolbars, we don't recommend to make individual ICO files. It is possible but all the GUI SDK tools use image strips instead. A image strip is a large image containing all the icons placed side-by-side. Accepted file format is BMP (recent SDKs accept PNG also). Once the image strip is programatically loaded in the application GUI, the toolbars and menus are populated with the icons.

If you want to learn more about the ability of IconWorkshop to open and edit image strips for toolbars, we recommend to read these topics:

 What is an Image Strip?

 How to create Icons for Toolbars using Image Strips?

Create a image strip for a toolbar

We'll create a 32x32 RGB/A (32 BPP) image strip. Latest versions of the GUI SDKs such as MFC (version included in Visual C++ 2008 SP1 of Feature Pack) support toolbar icons in 32 BPP RGB with alpha channel. The alpha channel permits to create icons with smooth borders, shadows and transparency. This is the state-of-the art in professional icon creation. To create the icons, we'll use the objects included in pack "iKon".

1. Choose File > New > Filmstrip for Toolbar or press Ctrl+T. A Dialog box opens, choose "RGB/A with Alpha Channel" and "32x32" in size of images. Specify also the number of images you wish to add in the image strip, 8 for example.

2. The new document is created. At the top of the window is displayed a list containing 8 blank entries. You can select the images to edit in this list. Using this feature you'll be able to edit each image separately (even if they share the same bitmap). IconWorkshop separes them virtually to help you working on the image strip.

3. Select the first image in the list "Image 0". Note that image numbers start at 0 to match the way they're handled in source codes. Make sure the Librarian is displayed and the object pack folder is selected. Select subfolder "Objects".

4. Let's create our first icon: A document icon with a "plus" overlay. In folder 32x32, select the object "Document.png" and drag & drop it in the editor window. The object is added. Redo the same operation with "Overlays/Add.png". The first icon is done!

5. Now this is a child's play: redo the same for the other icons using the various objects available in the list.

6. Note that you can change the order of the images in the list using drag & drop, copy images using Ctrl key or clipboard, add and remove images.

7. Once the toolbar image strip is finished, just save it by selecting the appropriate image format (BMP and PNG support RGB/A).

Create a GIF image for a Website

If you want to add illustration icons on your website we recommend to create GIF images. Axialis IconWorkshop has been designed to open/save icon files (ICO, ICNS), but a useful feature permits exporting an image included in an icon to a GIF file with color optimization. Follow this procedure to create a GIF image:

1. We'll create a 80x80 GIF image for inclusion in a web page with a white background (the color of the background is important to create an image with a smooth border). Create a new 80x80 with RGB/A icon: Choose File/New/Windows Icon. In the dialog box select RGB/A and 80x80, click OK. An icon is created with a new 80x80 image.

2. Create your illustration icon by using image objects from the Librarian (read more about objects).

3. Once the icon is done, choose File/Export/Compuserve GIF.

4. A dialog box opens. For a standard GIF, select Colors = "Auto", Palette = "Adaptive", Dither = "Diffusion". In Transparency, we recommend to select "Preserve Transparency".

5. Threshold and Matte are the important settings to make a professional GIF image. First, select in Matte the approximate color of the page background where the icon will be displayed. As the GIF format does not support smooth transparency, this will limit the "halo" and "aliasing" effect around the icon. In Threshold, adjust the level of the transparency frontier around the icon. You see the preview in the box below while you adjust the slider. We recommend to adjust it arround 25% for good results.

6. When done, click OK. Select the location and filename of the GIF file to create.

7. You're done! Now include the illustration image in your HTML page.