October 19, 2015

HOW TO: Add coach marks to your app demo with the ARROW control

Quick intro

This guide explains how to add different kind of arrows to your app demo. Arrows are great for pointing out important areas on a demo screen.

Click through the demo on the right to see what you can do with the Arrow control.

How it works

1 Add an arrow to any screen in your demo

To do so, click the Arrow icon in the Controls Toolbar while on the screen where you want to add it. The role of the Arrow is to point the user to an important area in the demo. Arrows are not clickable; for creating clickable areas, use the Hotspot control.

2 Customise the Arrow's look using its properties
  • COLOR: customise the color of the arrow; use your own color by providing the color code in the color box (screen 1)
  • STYLE: choose between a couple of arrow styles
  • LINE WIDTH: set up the arrow's width
  • CURVATURE: set up the curvature of the arrow
  • ROTATION: rotate the arrow to obtain the perfect position
  • DELAY: delay the appearance of the Arrow on the screen
  • SAVE PROPERTIES: save the properties (color, width, curvature, etc.) of the selected arrow as the default ones by clicking on the small gray star in the Properties Header