Lesson 1: Frames

Your new Visage workspace will probably be created with three frames: the Tools, Marking (called Paint in earlier versions of Visage), and Frames frames. The following are quick lessons that will familiarize you with the basic frame operations in Visage using a Visage Outliner frame.

Note: the Outliner frame will be explained in greater detail in a later lesson. It's basic function is to display data in an outline form.

Getting a New Frame

Frames are "lightweight" objects in Visage. That means that they are easy to create, modify, and discard.

To get a new frame, you simply hold the shift key down and drag the desired frame from the Frames palette:

1. Open an Outliner frame shift-dragging the icon for Outliner out onto the desktop.
   

Focus

To give focus to a particular frame, click once on its title bar, the grey area at the top left of the frame:

1. Click on the title bar of the Outliner frame.
   

The title bar will turn yellow, and its frame controls will be made visible:

Minimizing & Maximizing

Frames can be minimized to just their title by clicking the minimize frame control (with the green triangle in the lower left corner). This is useful for clearing up the desktop without losing any work.

1. Minimize the Outliner frame.

The minimized frame will appear as a small icon showing the frame title from the titlebar. To restore a minimized frame, double-click on the icon:

1. Restore the minimized Outliner by double-clicking the icon.

You can also maximize a frame by clicking the frame control with the green triangle in the upper right hand corner.

1. Maximize the Outliner frame.
2. Restore it to its original size by clicking the minimize frame control.

Note: you may need to click on the title bar to give the frame focus.

Moving

Frames in Visage can be moved on the desktop by dragging the frame via its title bar.

1. Drag the Outliner frame to a new location by putting the mouse pointer over the title bar, holding the left mouse button down, dragging the mouse to the desired location on the desktop, and releasing the mouse button.
   

Removing

To remove a frame, drag it via its title bar to the REMOVE icon in the Tools palette.

The REMOVE icon will light up when the frame is positioned properly; releasing the mouse button will remove the frame permanently.

1. Remove the Outliner frame from the workspace.
2. Create a new Outliner frame by shift-dragging the Outliner icon from the Frames palette.
   

Re-sizing

Visage frames can be resized by dragging the .horizontal or vertical edges of a frame. Dragging any edge outward will expose the contents of the frame; dragging it inward, will clip (or hide) them. Re-sizing is useful when there are too many (or not enough) items to fill the size of the frame.

The frame on the right has been re-sized by clipping both the bottom and right sides of the Outliner.

1. Shift-drag and Outliner frame from the Frames palette (so that you have two outliners).
2. Increase the height of one Outliner by dragging the bottom edge
3. Increase the width of the other Outline by dragging the right edge.
4. Drag the edges so that the frames are reduced in size.
   

Scaling

Frames can also be scaled. This operation actually proportionally increases the size of the elements within a frame (such as text). Visage frames are scaled by dragging via the lower right hand corner.

The contents of the frame will grow bigger as you drag the corner outward, smaller as you drag it inward. This is useful in several ways, to create more room on your desktop, or making the contents larger for easy viewing.

The image above shows a normally scaled Outliner frame over top an Outliner frame that has been scaled larger.

1. Drag a corner outward. Notice that the text within the frame grows proportionally larger as you drag the corner.
   

Summary

Visage frames are lightweight objects that can be easily created, minimized or maximized, moved, resized, scaled, or even thrown away. While this section used the Outliner frame as an example, all Visage frames behave in the same manner.

However, as important as frames are, one of their primary functions is to serve as containers for elements. The next section of the tutorial describes elements in more detail.