open help in new tab/window
The Button Designer contains the following elements:
TEXT , ICON , UPLOAD PHOTO , SNAPSHOT PHOTO , BACKGROUND , BORDER

CLICK THE ELEMENT YOU WANT TO CHANGE

IF YOU HAVE CLICKED THE ELEMENT ALL FUNCTIONS WILL WORK FOR THAT PARTICULAR SELECTED ELEMENT.

Functions that DON'T work for the selected element will be disabled!

The 'BORDER' is a STATIC element. It is not selectable!
Look at the 'SELECTED ITEM' (top middle) to see which element is selected!
EXCEPTION: For SIZING elements you DON'T need to click the element first, you can just hover over the element and use your mouse scroll wheel! (If you DO select the element you can also use the size slider)
VISIBLE/INVISIBLE
With the checkbox (VISIBLE/INVISIBLE) you make an element visible or invisible.
Clicking the checkbox has no influence on selecting the element. The element that was already selected stays selected, even if it is the element that is now invisible.
VISUALLY ENLARGE / REDUCE BUTTONS
With smaller buttons you can visually enlarge the whole button for easier editing.
With very large buttons you can visually reduce the button to be able to reach all the functions!
The REAL SIZE will stay the same!




to top
TEXT
FUNCTIONS: Move - Size - Stretch - Rotate - Italic / Shadow / Outline - Font select - Color - Opacity
There are 2 types of text elements. 'Straight' text and Round text.
Click the text element you want to change and type your text in the input text field. (above left)
By double clicking on the text elements you can bring that TEXT to the front, compaired to the other TEXTS and the ICON.

Round Text
You can adjust the circle size with the slider with the sign:
This will also change the font size. Maybe you want to correct this again by using size.
The round text is not 'draggable'. (Exept in rectangle buttons it is draggable)
to top
ICON
FUNCTIONS: Move - Size - Stretch - Rotate< /a> - Shadow / Outline - Color - Opacity - LOCK
Click the ICON you want in the Icon scroller (top).
Scroll through the icons with your mouse wheel or use the arrow buttons.
By double clicking it you can bring the icon to the front, in relation to the other TEXTS.

You can LOCK the ICON by clicking the little lock (next to the On/Off checkbox). The ICON will not be selectable anymore and stays in place.

to top
UPLOAD PHOTO
FUNCTIONS: Move - Size - Rotate - Opacity - LOCK
Click Photo Upload button and a selection screen will appear. Navigate to the photo you want to show in your button.
You can upload images with the folowing extentions: jpg, png (with transparency) and swf (Flash)
If you upload another photo the old one will be over-written.

The UPLOAD PHOTO is on top of the BACKGROUND. If the image is larger than the button the BACKGROUND will not be visible anymore.

You can LOCK the UPLOAD PHOTO by clicking the little lock (next to the On/OFF checkbox) . The UPLOAD PHOTO will not be selectable anymore and stays in place.
to top
SNAPSHOT PHOTO
FUNCTIONS: Move - Size - Rotate - Opacity - LOCK
If you have a webcam you can make a SNAPSHOT that will appear in the button
Activate the camera by clicking the 'camera' button.
A window will appear that asks you (once) for permission to open the camera (this is a Flash security measure)
Click 'Allow'. The camera appears and you can make a SNAPSHOT by clicking the 'Make Snapshot' button.
If you make another SNAPSHOT the old one will be overwritten.
You can close the camera. The snapshot you made will remain.

The SNAPSHOT is on top of the UPLOAD PHOTO and the BACKGROUND. These will not be visible anymore, unless you make the snapshot very small.

You can LOCK the SNAPSHOT by clicking the little lock (next to the On/OFF checkbox). The SNAPSHOT will not be selectable anymore and stays in place.
to top
BACKGROUND
FUNCTIONS: Color - The special Background functions: Gradient , Kaleidoscope , Patterns
There are 4 ways of changing the background
1. Fixed color :
Click the BACKGROUND and choose a color with the color picker.

2. Gradient :
Click the BACKGROUND and click checkbox 'GRADIENT'.
Option type1: Repeating stripes or circles.
Option type2: Gradient from one color to another
For both types you can choose: 'Lineair' (stripes) en 'Radial' (circles). With the scroller you can change the distance between the colors.
There is a second color picker active now. In combination with the 'normal' color picker you are able to choose the gradient colors.

3. Kaleidoscope
Click the BACKGROUND and click checkbox 'KALEIDOSCOPE'.
A button 'Spin' appears. With this button you can spin the kaleiscope with surprising effects. You can choose a new start image with the scroller.

4. Patterns :
Click the BACKGROUND and click checkbox 'PATTERNS'.
An option will appear that makes it possible to scroll through all the different patterns.
A slider appears that will adjust the scaling of the patterns.

By unchecking all background checkboxes you return to fixed color background.
If you make a SNAPSHOT or upload a PHOTO they will be ON TOP of the BACKGROUND.
to top
BORDER
FUNCTIONS: None
The BORDER is a static element. It is NOT SELECTABLE, but the elements that are UNDER the border still are.
If you make the border visible, you can scroll through the different borders.

You can put the border in the foreground by clicking on the little arrow. (If for instance you have an upload photo or snapshot the border will now be on top of the photo)
You can DOUBLE CLICK on individual TEXTS or the ICON to put that particular element over the border again.




to top
FONTS
Click the text element you want and change the font with the font selector.
to top
SIZE
You change the size of an element by hovering your mouse above the element and scroll your mouse scrollwheel or use the slider IF element is selected.


If you change the size of the icon, take care that your mouse is above the 'colored' or 'closed' part, if there are 'holes' in it.
to top
MOVE
Keep the mouse pressed on the element and drag it to the place you want.

If you release the mouse outside of the button the element it will 'stick' to the mouse until you release the mouse somewhere inside the button.
to top
COLOR
Click the text element you want and choose a color with the color picker (top left).
to top
ITALIC
Activate italic text by clicking the italic checkbox of the desired text element. (only for 'straight' texts)
to top
OUTLINE
Activate outline text by clicking the outline checkbox for the desired text element.
The outline color picker will now be active.

The 'inline' color is still selected in the 'normal way' with the color picker (upper left)
You have to make a choice between 'SHADOW' and 'OUTLINE'. They cannot both be active at the same time.
to top
SHADOW
Activate shadow text by clicking the shadow checkbox for the desired text element.

You have to make a choice between 'SHADOW and 'OUTLINE'. They cannot both be active at the same time.
to top
ROTATION
Click the element you want.
You rotate the element with the middle 'slider' with the rotation sign.
to top
WIDTH
Click the element you want.
You make the element more narrow or wider with the bottom 'slider' with the stretch sign.
to top
OPACITY
Click the element you want.
You can change the opacity of the element with the scroller, top right of the sliders. The Background has no opacity possibility.

- ◊ -