Native + Effect

The following operations can be recorded and played back as Actions:

1. User-Defined Favorite Buttons (recorded by position, not by content).

The interactive controls for the native Drop Shadow live effect consist of two sliders and a positioning arm extending from the center circle, along with a dropdown menu and a color chip:

Stylism Drop Shadow Controls

A. Shadow Offset

The position of the small “ball” at the end of the shadow position arm in relation to the center circle reflects the offset of the drop shadow. When the cursor is hovering over the control, the current X and Y offsets are displayed. Dragging the control will update the shadow offset after the mouse button is released. The two sliders will rotate with the shadow offset control.

Stylism Drop Shadow Position Control

While dragging the shadow offset control, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the angle of the shadow to 45° increments around the general constrain angle.

• Option/Alt: Constrains the change in distance to integer values (or less, depending on the zoom level).

Doubleclicking the control brings up a dialog which allows you to enter the shadow offset numerically, either as the standard X and Y values, or as distance and angle values:

Stylism Drop Shadow Offset Dialog

B. Blur Slider

The blur slider thumb control may be dragged along the blur arm to change the shadow’s blur radius, between 0 and 144 pt. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current blur radius is displayed. The blur slider can also be clicked anywhere along its length to move the blur thumb immediately to that position. While dragging the blur slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the blur radius to integer values.

Doubleclicking the control brings up a dialog which allows you to enter the blur radius numerically.

C. Opacity Slider

The opacity slider thumb control may be dragged along the opacity arm to change the shadow’s opacity, between 0% and 100%. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current opacity is displayed. The opacity slider can also be clicked anywhere along its length to move the opacity thumb immediately to that position. While dragging the opacity slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the opacity to steps of 10%.

Doubleclicking the control brings up a dialog which allows you to enter the opacity numerically.

D. Blending Mode

The annotated blending mode dropdown menu allows you to select the shadow’s blending mode, from among Illustrator’s standard 16 blending modes:

Stylism Drop Shadow Blending Mode Menu

E. Color

The color control shows the color of the shadow. To specify a new color, click the square to bring up the standard color picker. To switch from Color mode to Darkness mode, Option/Alt-click the control. A small “D” symbol is displayed to indicate Darkness mode. To change the darkness value, click the square.

The interactive controls for the native Feather live effect consist of a single slider:

Stylism Feather Controls

A. Blur Slider

The blur slider thumb control may be dragged along the blur arm to change the feather’s blur radius, between 0.2 and 250 pt. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current blur radius is displayed. The blur slider can also be clicked anywhere along its length to move the blur thumb immediately to that position. While dragging the blur slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the blur radius to integer values.

Doubleclicking the control brings up a dialog which allows you to enter the blur radius numerically.

The interactive controls for the native Free Distort live effect consist of a bounding rectangle and two vanishing points:

Stylism Free Distort Controls

A. Distorted Object Bounds

The bounds of the object after it has been free distorted are indicated by a red rectangle with nodes at each corner. When the cursor is hovering over a corner node, the corner’s coordinates are displayed. Thin grey lines connect the corners of the rectangle with the original object’s bounds, indicated by a rectangle of solid grey lines. The corner nodes of the distorted object bounds may be dragged to move them (with Shift to constrain the motion to 45° increments around the general constrain angle). The corners will snap to other objects if Smart Guides are enabled; pressing the U key will temporarily toggle the Smart Guides setting. Each corner may also be doubleclicked to numerically enter its coordinates.

The edges may also be dragged to move them.

B. Vanishing Points

If the distorted bounds are configured such that two of the normally parallel edges are no longer parallel, a vanishing point symbol is annotated at the intersection point of their projections (although this may be off the screen). When the cursor is hovering over a vanishing point, the point’s coordinates are displayed, along with dashed lines connecting it to the corresponding edges. The vanishing point may be dragged to reposition it, with Shift used to constrain its motion along one of the edge projections.

Stylism Free Distort Vanishing Point Drag

The interactive controls for the native Gaussian Blur consist of a single slider.

Stylism Gaussian Blur Controls

A. Blur Slider

The blur slider thumb control may be dragged along the blur arm to change the Gaussian blur radius, between 0.1 and 250 pt. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current blur radius is displayed. The blur slider can also be clicked anywhere along its length to move the blur thumb immediately to that position. While dragging the blur slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the blur radius to integer values.

Doubleclicking the control brings up a dialog which allows you to enter the blur radius numerically.

If the blur radius is increased to a value that exceeds the native Document Raster Effects Setting “Add [X] Around Object”, by default this setting will automatically be increased to avoid clipping, and a warning dialog will be shown:

Stylism Raster Effects Around Object Warning

The interactive controls for the native Inner Glow live effect consist of two sliders extending from the center circle, along with two dropdown menus and a color chip:

Stylism Inner Glow Controls

A. Blending Mode

The annotated blending mode dropdown menu allows you to select the inner glow blending mode, from among Illustrator’s standard 16 blending modes.

B. Glow Type

The annotated glow type dropdown menu allows you to select the glow type, which can be either Center or Edge.

C. Blur Slider

The blur slider thumb control may be dragged along the blur arm to change the inner glow’s blur radius, between 0 and 144 pt. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current blur radius is displayed. The blur slider can also be clicked anywhere along its length to move the blur thumb immediately to that position. While dragging the blur slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the blur radius to integer values.

Doubleclicking the control brings up a dialog which allows you to enter the blur radius numerically.

D. Opacity Slider

The opacity slider thumb control may be dragged along the opacity arm to change the inner glow’s opacity, between 0% and 100%. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current opacity is displayed. The opacity slider can also be clicked anywhere along its length to move the opacity thumb immediately to that position. While dragging the opacity slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the opacity to steps of 10%.

E. Color

The color control shows the color of the inner glow. To specify a new color, click the square to bring up the standard color picker.

The interactive controls for the native Offset Path live effect consist of a relocatable distance widget and a dropdown menu. For many more options when offsetting a path, including proper offsetting of open paths, as well as multiple offsets, we suggest instead using the Astute Graphics’ AG Offset live effect, which has a dedicated tool and panel.

Stylism Offset Path Controls

A. Offset Distance

The length of the widget reflects the offset distance. The “ball” end can be dragged to change the offset value (to the right for positive amounts) or doubleclicked to numerically enter the value. By default, the widget is placed above the center circle. However, it can be repositioned by holding down Option/Alt and dragging the end without the ball. It will snap to the path, which can make adjusting the offset value easier because the widget will be rotated perpendicular to the path, with the offset path therefore passing directly through the ball:

Stylism Offset Path Widget Relocate

B. Corner Type

The dropdown menu specifies the types of corners used when offsetting the path, from among Miter, Round, and Bevel. The rarely-used Miter Limit parameter is not adjustable through the annotated UI.

The interactive controls for the native Outer Glow live effect consist of two arms extending from the center circle, along with one dropdown menu and a color chip:

Stylism Outer Glow Controls

A. Blending Mode

The annotated blending mode dropdown menu allows you to select the outer glow blending mode, from among Illustrator’s standard 16 blending modes.

B. Blur Slider

The blur slider thumb control may be dragged along the blur arm to change the outer glow’s blur radius, between 0 and 144 pt. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current blur radius is displayed. The blur slider can also be clicked anywhere along its length to move the blur thumb immediately to that position. While dragging the blur slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the blur radius to integer values.

Doubleclicking the control brings up a dialog which allows you to enter the blur radius numerically.

C. Opacity Slider

The opacity slider thumb control may be dragged along the opacity arm to change the outer glow’s opacity, between 0% and 100%. The value increases away from the center circle. When the cursor is hovering over the control or dragging it, the current opacity is displayed. The opacity slider can also be clicked anywhere along its length to move the opacity thumb immediately to that position. While dragging the opacity slider, in addition to the common keypresses (see Stylism Annotated Controls and Common Drag Keypresses), the following keypresses can be used:

• Shift: Constrains the opacity to steps of 10%.

D. Color

The color control shows the color of the outer glow. To specify a new color, click the square to bring up the standard color picker.

The menu item to show and hide the Stylism panel can be found in the main menu under Window > Astute Graphics > Stylism.

Stylism Panel

1. Flyout menu

See Stylism Panel: Flyout Menu.

2. Panel banner

The Stylism panel banner has a help button on the right which opens the help documentation in the Astute Manager. If this does not automatically appear, please ensure your Astute Manager is running first. Along with the rest of the panel, the panel banner can be clicked to activate the Stylism tool. This is a quick method of locating the tool within the default Advanced toolbar or a custom toolbar.

3. Effects Resolution Setting

This area allows you to see and quickly change the Document Effects Raster Resolution setting, the resolution at which raster objects produced through live effects (such as Drop Shadow, Feather, Gaussian Blur, etc.) are created. Natively, this is found under the dialog opened through the menu item Effect > Document Raster Effects Settings.... Typically, the resolution is set to a fairly low  value (for example, 72 ppi) while working on the document, for speed. Then, when the document is ready to go to print, it is changed to higher resolution (typically 300 ppi or more), for quality.

The new resolution can be entered into the input box, or one of the buttons on the right can be clicked. To customize the resolutions produced by either button, hold down Option/Alt when clicking it.

4. Effects Buttons

The effects buttons are used to quickly add and remove the eight supported native live effects from the targeted art simply by clicking on them (clicking once adds the effect; clicking again removes it).

Stylism Panel Effects Buttons Basics

Buttons which are selected (dark) indicate that its effect is present. The buttons in the first row represent (from left to right): Drop Shadow, Feather, Inner Glow, and Outer Glow; those in the second row represent Transform, Free Distort, Offset Path, and Gaussian Blur.

Stylism Panel Effects Buttons

Effects are added in their default positions (below all strokes and fills, except for the Offset Path effect, which is added above all strokes and fills) and always start with a default set of parameters. Initially, these are the same parameters that would be set when adding the effect natively through the Effect menu. For example, a Drop Shadow is initially given X and Y offsets of 7 pt, a blur of 5 pt, and an opacity of 75%.

However, you can change the parameters that are initially applied when the effect is added using one of the Stylism effects buttons (or flyout menu). To do this, select a single object that has the effect and change its parameters to the desired settings. Then, hold down Option/Alt and click the corresponding effects button. From then on, using the button will add the effect with your custom parameters. (The buttons can have their Illustrator-specified default parameters restored by using the panel flyout menu item Reset All Standard Effects).

Normally, if an effect is already present, then clicking the corresponding effects button again will remove it. To instead add a second copy of the effect, hold down Shift when clicking the button.

Holding down Command/Ctrl when clicking a selected effects button is a shortcut for making it the current effect.

5. User-Defined Favorite Buttons

The user-defined favorite (“UDF”) buttons allow you to save the look of one or more Stylism-controlled effects and later apply it to selected objects. Like a native Graphic Style when using its merge mode, the effects in the UDF buttons do not replace the object’s current appearance but instead add to it. User-
defined favorites are available across documents and Illustrator sessions.

To define a UDF button, there must be only one object selected, and it must contain at least one effect from the eight native effects that Stylism controls. Then, hold down Option/Alt and click the button. The thumbnail image in the button will update, showing the effect(s) as applied to a small square with a white fill and black stroke. Now, clicking the button will add those effect(s) to any selected art without affecting any existing effects. The Stylism tool will be automatically made active (if it is not already).

Stylism Panel User Defined Button Usage

If the selected art already contains the same live effect in the same position as one defined in the UDF button, it will not be replaced. If the UDF button had an effect applied in a stroke or fill and the receiving object has no strokes or fills, the effect will instead be added in its normal position.

6. Effect Selection Menu

This menu is used to switch the current effect (the effect for which the Stylism tool is displaying an annotated UI) when the selected art contains more than one effect, including multiple copies of a single effect. Each effect that is present is listed by name in the menu. Following the name is a code for its position in the appearance stack (as viewed in the Appearance panel):

a. Pre: Effect is above any strokes or fills.

b. S: Effect is in a stroke.

c. F: Effect is in a fill.

d. Post: Effect is below any strokes or fills.

For effects contained in strokes and fills, a small swatch of the color of the stroke or fill is also displayed, to make it easier to select the correct effect.

7. Contour Graph

This graph is available when the Contour Control area is showing, the Stylism tool is selected, and the Astute Graphics’ Phantasm plugin is installed. For use with effects which create an image with an alpha mask (Drop Shadow, Feather, Outer Glow, and Gaussian Blur), it allows you to put a curve on the alpha channel (implemented by automatically adding a matching Phantasm Curves live effect at the bottom of the effect stack). This is most commonly used with the Drop Shadow effect, to achieve a look that can’t be made through changes to the Drop Shadow parameters alone.

Stylism Contour Control Example

The horizontal axis represents the input alpha value, while the vertical axis represents the output value. With the default diagonal line, the two are the same. Nodes on the curve may be moved simply by clicking and dragging them. A new node may be added by clicking at a spot along the curve which does not already have a node. Nodes (except the ones at the beginning and the end of the curve) may be deleted by dragging them off the graph area.

8. Contour Graph Curve Preset Buttons

These four buttons allow you to load and store contour graph curves. Each displays a thumbnail of the curve it contains. To load a graph, simply click on a button. To store the current curve to a button, hold down Option/Alt and click on a button. Curve presets are preserved across Illustrator sessions.

9. Contour Graph Mode Buttons

The contour graph can be created using one of two modes. The left-hand “Curves” button allows editing it as a smooth curve passing through two or more nodes. The right-hand “Pencil” button allows drawing freehand, with the ability to change each value arbitrarily. If a graph is started in pencil mode and later changed to curves mode, the best possible curve will be fitted through the points.

Tool Location and Cursor Appearance

The Stylism tool appears in Illustrator’s main toolbar (which must be in Advanced mode: View > Toolbars > Advanced).

Stylism Tool Location

The Stylism tool’s primary cursor is a crosshair. When interacting with the annotated controls, it can assume other forms:

Stylism Tool Cursors

Tool Operation

As the Stylism tool has several keypresses that modify its behavior in different contexts, we suggest installing the free Astute Graphics plugin Astute Buddy, which creates a panel that dynamically updates to inform you of the various keys which can be pressed in the tool’s current context.

The Stylism tool is works in conjunction with the associated Stylism panel, which should be open and accessible. If you are using the free Astute Graphics plugin DirectPrefs, you can have the Stylism panel automatically be shown when the Stylism tool is selected.

To use the Stylism tool, at least one art object must be selected that has in its appearance one of the eight native live effects that Stylism supports (Drop Shadow, Feather, Inner Glow, Outer Glow, Transform, Free Distort, Offset Path, and Gaussian Blur). If this is the case, the art will display (in red, by default) annotated controls (sliders, buttons and dropdown menus) that the tool can interact with to change the effect’s parameters. The controls are always centered over the bounding box of the art object. Common to all effects is a center circle control; the other controls are specific to each live effect.

The interactive controls for the native Transform live effect are as follows:

Stylism Transform Controls

A. Transformed Object Bounds

The bounds of the object after it has been offset, scaled, and rotated are indicated by a red rectangle with nodes at each corner. Dashed grey lines connect the corners of the rectangle with the original object’s bounds, indicated by a rectangle of solid grey lines. Each of the transform parameters may be changed by using the Stylism tool on this rectangle:

• Offset: Hovering the cursor over the bounds rectangle (except over an edge or corner) displays the current offset values (Option/Alt-clicking on the bounds toggles the readout between X/Y mode and distance/angle mode). Dragging the bounds rectangle (except on an edge or corner) changes the offset (hold Shift to constrain the motion to 45° increments around the general constrain angle). The rectangle may also be doubleclicked to enter the offsets numerically, either as the standard X and Y values, or as distance and angle values:

Stylism Transform Offset Dialog

• Scale: Dragging one of the corner nodes of the bounds rectangle changes the scaling. Holding Shift while dragging constrains the aspect ratio. To change only the horizontal scale or only the vertical scale, drag an edge. To specify the scaling numerically, doubleclick one of the edges of corners:

Stylism Transform Scale Dialog

• Rotation: When the cursor if hovering outside the rectangle but near one of the corners, the current rotation value will be displayed. Dragging from this location changes the rotation. While dragging, holding Shift constrains the rotation to 45° increments around the general constrain angle. Doubleclicking while the current rotation value is being displayed brings up a dialog letting you change the rotation value numerically:

Stylism Transform Rotation Dialog

B. Increment/Decrement Copies

The buttons marked with “+” and “–” increment and decrement the number of transformed copies, from 0 to 1000. Pressing Shift while clicking a button will change the value by 10 instead of 1. Pressing Option/Alt while clicking the button will change number of copies while also retaining the position of the last transformed copy:

Stylism Transform Copies Button Example

Each copy is joined by a thin red line (the copy chain line), and each copy except the first has its bounding box marked with a rectangle of solid grey lines.

C. Scale Strokes & Effects

Controls the Scale Strokes & Effects setting. When disabled, it shows three stripes of the same width; when enabled, three stripes of varying widths. Clicking the button toggles the setting.

Stylism Transform Scale Strokes Example

D. Reference Point

This nine-block widget is similar to the smaller version in the Transform effect parameters dialog, and specifies the reference point (position of the transformation point relative to the bounds of the original object).

E. Randomize

Toggles the Random parameter of the live effect. When disabled, the button displays “N” (for non-random); when enabled, it displays “R”.

F. Transform Copy Chain Tip

Marks the position of the last copy in the copy chain. When the cursor is hovered over it, a display of the current number of copies will appear. Dragging the control changes the number of copies, extending or shortening the copy chain:

Stylism Transform Copy Chain Drag

Dragging the copy chain tip with Option/Alt held down allows you to move the position of the last copy (and, therefore, all intermediate copies) while retaining the current number of copies. Stylism achieves this by calculating and applying the necessary offset values such that the last copy lands at the given coordinates. The scaling and rotation values are not changed.

Stylism Transform Copy Chain Drag with Option

Doubleclicking the control brings up a dialog in which the number of copies can be directly entered. If Option/Alt is being held down (so the coordinates of the last copy are displayed), a dialog in which the coordinates can be numerically entered is displayed.