Best size

• Best: Capture the least amount of the screen needed for your demo. For example, a demo of a control panel should only capture the boundary of the control panel itself (in Wink, select Choose window).
• Good: Resize your display when capturing a whole desktop: 640x480 VGA, 800x600 SVGA, or 1024x768 XVGA, prevents scrolling for most users. This resolution switching is easily done using RDS tricks, because you don't have to mess up your own display settings.
• Poor: Don't resize a Full Screen desktop capture to make it fit in a browser: the screen details become blurred and hard to read.
• Worst: Don't capture your own desktop (Full Screen display): because Flash movies are viewed in browser, the demo would never fit, and your viewers would have to scroll around to see hidden parts of your demo.

Best way to capture

Wink has 3 modes of capturing:

1. poor: timed: creates the bulkiest movies
2. good-enough: mouse/keyboard events: it records some events/frames you don't need, and it may miss a few events you do, such as tooltip and submenu popups.
3. perfection: manually: press the hotkey (Pause) on each and every step you want to show, which doesn't disrupt the application's behavior (tooltips and popups stay visible). So, nothing's lost, and there are no extra frames to trim out.

Tips for capturing in manual mode:

• Capture once before and then after each mouse click.
• Capture essential popups/submenus on hovers, careful to not move the mouse.
• Capture mouse start and end points.
• Try to capture any time the cursor changes shape (such as arrow to I-beam).
• On long running actions, capture a few frames at the start and a few near the end.

Tips before starting a capture:

1. Set up / reset your application to the state a new user will see.

2. Walk through the capture you're planning in the real application step by step.

3. Do it again, this time writing down those steps in your favorite text editor. These notes will serve as your script during your capture, become as your captions when you copy/paste them into Wink frames, and evolve into your accessibility captioning, if you have those requirements. It's truly the easier, faster way to work.

Best way to create tutorials

If you don't add buttons, titles, and captions to your capture, it can fail as a tutorial -- especially if your viewer has to replay it over and over again to grasp how the end result was reached. Best to show them AND tell them, and, best of all, to let them go at their own pace.

Buttons:

Wink has navigation buttons (next/prev/goto). The tutorial will stop in frames having a navigation button giving the user a chance to see what happened.

• Use buttons in important capture frames.
• The user also may do the step in parallel in the real application documented.
• Always use both - next and prev - buttons together and place them near each other. The user then easily can just replay the last (few) step(s).
• Put the navigation buttons always in the same locations so the user hasn't to move his mouse when clicking forward through the tutorial. Use copy/paste the button(s) in Wink or the button position input fields.
• A good place for the navigation is often top right near the title bar close icon.

Callouts:

Wink has text callouts (bubbles).

• Use callouts to document the steps taken.
• Use callouts mainly in frames having navigation buttons to give the user a chance to read and understand the text.
• You may copy/paste a callout into several frames after a button frame. The callout will be visible while the mouse moves.
• On the first frame put a callout explaining what the tutorial will document.
• On the last frame put a callout (green) with a success feedback.

Cursor tips:

Wink captures the mouse as an editable object, and automatically animates its movements for the Flash movie.

• Hide, move, and even swap out cursors as needed!
• Missed an important cursor change? Fake it: duplicate the start frame, choose the target cursor, and reposition the mouse to where it happened.
• Need to show a right-click? Create a special cursor graphic, duplicate the click's frame, choose your new cursor, and set the display time to 0.3-0.5 seconds.
• Need to show clicks with keys? Add a callout to explain, and either a Next button or a long display time on the frame.