A lot of what goes on a page is shapes, often joined by arrows: the circles and stars a mark is built from, a box on a wireframe, a flow between screens. livedesign makes both fast: shapes come from the Palette, and arrows snap between shapes with quick-connect. This article covers the basics; for the full catalogue see Shapes and Arrows.
Adding shapes
The Palette, the strip across the top of the editor, holds everything you can add to a page. It starts with the selection mode (Select, Hand and the rest), then the palette's categories by name. On a blank page they are Popular, Shapes, Write, Concepts, Components, Devices, Icons, Stickers, Media and Data; a wireframe and a logo page each arrange theirs for what that page is made of, and on a photo page the strip holds the photo tools. Rest the pointer on a category, or click it, and its elements open in a panel underneath. See where each one lives for the full map.
Rest on Shapes in the palette, or click it: its panel opens with the square, circle, diamond, cylinder, hexagon, stadium and many more, in groups. Click the one you want.
Click the page to drop the shape there at its natural size, or drag on the page to draw it at exactly the size you want. You can also drag the tile straight onto the page.
Double-click the shape to add a label, then type. Enter starts a new line, and a click elsewhere finishes the label. With a shape selected you can also just start typing, or press Space.
Common shapes have their own keys, too: R square, O circle, D diamond, C cylinder and G parallelogram (see Keyboard Shortcuts).
The categories sit in groups along the strip, a thin line between each. Popular comes first, a pick of the tiles a page is most often built from, and every one of them is also in its own category: Write holds Text, the Sticky Note and the Pointer Note; Concepts the concept graphics, the Timeline and the Sankey; Components the ready-made blocks (Hero, Header, Banner, Card, Callout, Stat and more); Media pictures and embeds; and Data the charts, meters and the Table. There is no arrow tile on the strip: arrows come from quick-connect, or the A key.
Connecting with arrows
The fastest way to draw an arrow is quick-connect:
Drag a + onto another shape, or click it to open its options (Duplicate, Arrow, Text) and drag Arrow onto another shape. livedesign draws an arrow pinned to both, so the arrow follows whenever you move either shape. On a phone, tap Arrow, then tap the target shape.
A and drag between any two points.Duplicate in the same options drops a connected copy of the shape beside it, the quickest way to grow a process one step at a time. Turn on Quick-Add on Hover in Settings and the options open as soon as you hover a +. See Quick-Add on Hover.
Styling arrows
Right-click an arrow (long-press on touch) to open its formatting:
- Line: Straight, Curved or Angled (an L-shaped elbow); the pattern (Solid, Dashed, Dotted, Dash-dot, Long dash or Dash-dot-dot); and the thickness, Thin, Medium, Thick or Extra thick.
- Pointer: the arrowhead shape, size, and which ends carry a head.
- Label: double-click an arrow to type a label. It sits on the middle of the line, with the line broken open behind it, and wraps onto more lines when it is long. Press Shift+Enter for a line break of your own.
- Pass Behind Boxes: on by default, so a long arrow crossing an unrelated shape ducks under it instead of drawing a line over its label. Turn it off per arrow from the Line section if you want the old always-on-top look.
Drag an arrow's line to bend it where you grabbed it, and use the handles on curved and angled arrows to shape the path exactly. See Arrow Styles.
Building a process? Drop a shape, label it, quick-connect to the next spot, and repeat. Because a new shape can inherit the selected one's size, chained nodes stay tidy without fiddling.
Was this article helpful?