Pointbreak

Instead of having a mobile design on one artboard and a desktop design on another you can have both on the one artboard and use breakpoints to switch between them. Pointbreak also supports vertical breakpoints. This can be useful for mobile apps. It roughly corresponds to size classes in iOS. For example in landscape orientation on iPhone (compact vertical size class), the status bar disappears and the navigation bar and toolbar get shorter.

To create a breakpoint select an artboard and click on the circle with a plus in it. You can change the breakpoint dimension by dragging it. To delete a breakpoint hover over it and click on the trashcan. To switch to another breakpoint, just click on it. Resizing the artboard, changing orientation or selecting an artboard preset will automatically switch breakpoints. To have layers scale to the artboard size, select the artboard and make sure "Adjust content on resize" is checked in the inspector on the right.

The following properties are saved for each horizontal breakpoint:

All layers

• Origin and size
• Visibility
• Resizing contraint

Text layers

• Style
• Font size
• Text alignment
• Vertical alignment
• Auto or fixed
• Character spacing
• Line height

Symbol instances

• Overrides

Vertical breakpoints only save origin, size, visibility and symbol overrides. When you have both horizontal and vertical breakpoints, the horizontal breakpoint saves x and width while the vertical breakpoints saves y and height. If you are editing visibility or symbol overrides and you want to make sure the change is applied to the correct axis, make sure the breakpoint is purple first. If it's not, just click on it. When you just have horizontal breakpoints the artboard height is saved with the breakpoint as mobile artboards tend to be longer than desktop ones.

If you want to change any of the above properties but don't want it to apply to a specific breakpoint, click on the checkbox in the top left of the artboard - this disables changes being saved to a breakpoint. If you want a layer to be the same across all breakpoints but there has already been changes saved, go to  Plugins > Pointbreak > Reset Selected Layers Across Breakpoints. To disable Pointbreak for all documents go to Plugins > Pointbreak > Disable.

You can convert responsive artboards to normal artboards for use in other applications. Have nothing selected and go to Plugins > Pointbreak > Expand All Artboards or select the artboards you want to expand and go to Plugins > Pointbreak > Expand Selected Artboards. Once complete, non-responsive artboards will be selected for use with plugins that upload artboards to other services. Only horizontal breakpoints will be expanded. Click on this menu item each time you want to upload artboards so that they will be updated from their responsive artboards.

⌥ + , Previous horizontal breakpoint
⌥ + . Next horizontal breakpoint
⌥ + / Previous vertical breakpoint
⌥ + ' Next vertical breakpoint
⌥ + D Disable/enable breakpoints