This article describes the mag+ InDesign Plugin and all its settings and features.
- Adobe InDesign CS4 or higher
- Available for OS X and Windows
The mag+ InDesign Plugin is where the process of building your mobile app content begins. It offers several panels that allow you to add multimedia, effects, scrollable layers, and more. You can also preview your layouts on mobile devices with a single click.
When working in InDesign with the mag+ plugin, you export InDesign layouts as Verticals. One InDesign document becomes one Vertical which can be scrolled vertically to view the content. Adding multiple pages in the InDesign document extends the length of that single Vertical.
In order to swipe horizontally in your app, from one screen of content to the next, you combine several Verticals into a mag+ Issue using the mag+ Production Tool.
Note: Always use the templates provided by the mag+ installer when you design a new Vertical. It ensures that your document dimensions will be correct for the device you are targeting.
The mag+ Panels
The mag+ InDesign Plugin consists of three panels and one menu. The three panels are:
You can show these panels in InDesign through one of two ways:
- By going to the Window menu and selecting Mag+ Designd > Vertical, Mag+ Designd > Object, and Mag+Designd > Popup
- By going to the Mag+ menu (as of version 5.0.2) and selecting Mag+ Settings Panel, Mag+ Vertical Panel, Mag+ Object Panel, and Mag+ Popup Panel
A checkbox next to the menu item will indicate whether the panel is visible.
The Mag+ Designd Preferences
You can show preferences in InDesign by going to Window menu and selecting mag+ Designd > mag+ Designd Preferences
The Mag+ Designd Preferences is where you configure review settings, export options, and device templates for Multi-Device Export for your Verticals.
Push Review to Device: This setting connects your computer to a mobile device to review mag+ layouts as you work.
To read step-by-step instructions on how to set-up the Review process, refer to the article "How to Set-up and Use the mag+ Reviewer."
- Review MIB file: This option is only used to share a mag+ layout with external users. Instead of pushing a layout directly to a Review device, this feature creates a MIB (Mag+ Issue Bundle) file at the entered location (such as on a server) that can be opened in a mag+ Reviewer app.
- Output PNG Images Only: The mag+ Plugin exports InDesign layouts as images called Verticals. Check this box if you want the plugin to export all images as PNG files. The default behavior of the plugin is to output images in a mix of JPEG and PNG formats.
Note: Checking the "Output PNG Images Only" box, while increasing the quality of exported Verticals, will significantly increase the size.
- JPEG Quality: Use the drop-down menu to increase or decrease the quality of exported Verticals in the JPEG format. Low is the lowest setting possible while Great is the highest setting.
Downscale Images Using Photoshop: This checkbox instructs the mag+ InDesign Plugin to use a local copy of Photoshop upon export to resize images to fit the intended device. When unchecked, the plugin itself resizes the images. When using Photoshop, this feature includes two other options:
- Resample Image: Lets you choose which resampling method Photoshop uses when resizing the images; the default setting is Bicubic.
- Photoshop Version: Lets you choose which local version of Photoshop to use for resizing images.
Calculate Default Pinning: Check this box if you want the mag+ InDesign Plugin to determine default Pinning settings for objects in a layout.
To learn more about Pinning in mag+, refer to the article "Adding Pinning to Objects."
- Automatically Check for Updates: Check this box if you want the mag+ Indesign Plugin to automatically check for updates.
Universal iPad MIB: This option should only be enabled when creating "Help Issue MIB" files for iPad apps. When enabled, the plugin exports a Vertical that it is compatible for both regular iPad and iPad Retina Display devices. When creating content that is not Help Issue-oriented, create separate Vertical layouts for regular iPad and iPad Retina Display devices.
To learn more about how to use the Universal iPad MIB feature, refer to the article "Creating a Universal Help MIB."
- Device Templates: This area of the Mag+ InDesign Plugin is used to associate devices with Mag+ InDesign templates when using the Multi-Device Export feature. To learn more about using Mag+ for automating multiple device exports, refer to the article "How to Use Multi-Device Export for Multiple Devices."
The Designd Vertical Panel
The Design Vertical Panel is where you define settings for the currently open layout when it is exported as a Mag+ Vertical.
Note: The settings configured in the Vertical panel only apply to the active InDesign layout. We recommend you check this panel every time you begin designing a new Vertical or before you export.
- Device: This drop-down menu associates a device with your current layout. When starting from a template included with the mag+ installer application, this setting is automatically configured.
Export Folder: The Browse button lets you choose a location where the mag+ InDesign Plugin will export Verticals. All Verticals for a mag+ Issue should go to the same folder to be assembled by the mag+ Production Tool.
For more information on the mag+ Production Tool, refer to the article "Setting Up the mag+ Production Tool."
- MIB Version: Select the version of the MIB (mag+ Issue Bundle) you wish to produce. If you already have an app in the market, it is very important that you set this to the same version as your app otherwise not all features in your Vertical may work. When you build an app in the mag+ Publish Portal, you will always get the latest mag+ version available.
ID: This field sets the ID of the exported Vertical. Each Vertical in a mag+ Issue needs a unique ID, otherwise the latest export will overwrite a previous export. This ID is not seen by the end-user, but is displayed in your analytics reporting. The small box to the right of the ID is used when creating Spreads (multiple Verticals that appear as a single preview in the app navigation).
To learn more about Spreads, refer to the article "Creating a Spread with Two or More Verticals."
- Name: This field is the name of the exported Vertical as seen in the Scrubber Bar of your app. It is also the name shown in the Bookmarks area of the app when the user bookmarks a Vertical.
- Orientation: Choose an option from the drop-down menu if you want to lock the Vertical in either portrait or landscape orientation. Set this option to Auto if you want your Vertical to rotate when the device is rotated.
- Background: This is the color that appears behind your content in the app if any part of the A or B layer is not shown fullscreen. It corresponds to swatches in your InDesign layout.
- Knockback: As the reader scrolls the A layer in your Vertical, the system can fade in a color at the maximum opacity you choose over the B layer. If the reader taps the screen twice to make the text disappear, the background will show in its normal state.
Table of Contents: This checkbox should only be enabled when building a Table Of Contents for your app using the TOC InDesign template for the device you are targeting.
For more information on how to create a Table of Contents for your app, refer to the article "How to Create a Table of Contents."
Overlay: This checkbox is used if the layout you are creating is intended as a mag+ Overlay for your Issue. An Overlay is a layer of content that is drawn on top of your entire Issue.
For more information on Overlays, refer to the article "Using an Overlay Layer."
- Disable Bounce (iOS only): This feature allows you to disable the bounce effect in the designed vertical.
- Include in Issue Preview: When this checkbox is enabled, the first InDesign page of your current layout will appear as a preview of this Issue in your app’s Store interface. For more information, refer to the article "Issue Preview."
- Sharing: This field is used to specify a custom URL included when a user shares this Vertical via Twitter, Facebook, and other social media services. If this field is blank, and sharing is enabled for your app, the URL to the Vertical will be the default URL set in the Mag+ Publish Portal. For more information on sharing, refer to the article "Adding Sharing Functionality."
- No A-layer: This checkbox disables the A layer for the exported Vertical. Content in the Vertical will only scroll in full-screen slides and double-tapping the screen will have no effect. For more information about how the mag+ layers in InDesign work, refer to the article "Predefined Mag+ Layers in InDesign."
- No B-layer: This checkbox disables the B layers for the exported Vertical. Content in the Vertical will scroll in a single free-flowing layer and double-tapping the screen will have no effect. Multiple InDesign pages can still be included in the layout and Snapping will still function. For more information about how the mag+ layers in InDesign work, refer to the article "Predefined Mag+ Layers in InDesign."
- Fast Review: This button reviews your layout in low resolution on your specified Reviewer device. The exported Vertical will be pushed to the device chosen in the mag+ Settings panel under "Push review to device" or be exported to the path specified under "Review MIB File." This button results in a faster review as InDesign is used to perform image conversion.
- Full Review: This button reviews your layout in full resolution on your specified Reviewer device. The exported Vertical will be pushed to the device chosen in the mag+ Settings panel under "Push review to device" or written to the path specified under "Review MIB file." Full Review triggers a locally installed version of Photoshop to perform image conversions, so you will see exactly how the Vertical will appear on final export.
- Export: This button exports the current InDesign layout as a Vertical. A mag+ Vertical is a package of files containing XML files, images, and other content. Assets are converted, bundled and saved to the Export Folder specified previously in the Designd Vertical Panel.
Additional Devices: This area is only used to convert the current layout for use on other devices using the mag+ Multi-Device Export feature.
For more information on Multi-Device Export, refer to the article "How to Use Multi-Device Export for Multiple Devices."
The Designd Object Panel
The Designd Object Panel is used to define the behavior of mag+ objects in your layout, including features such as object Pinning, Snapping, and Panning and Zooming.
Note: The Designd Object Panel will change its available options based on the type of object selected.
This is the type of mag+ Object assigned to the selected item in your InDesign layout. Possible options include:
- Block: A Block is a mag+ Object that has an ID and is used as a reference for various features. Blocks can change their position according to Pinning settings, are used in specifying Snapping parameters, can be resampled (if they are an image), and can Zoom and Pan. Links at the end of this section point to features that utilize the Block setting.
- Control Image: Used to specify objects that trigger actions linked with media.
- HTML: Used to specify an InDesign frame as a container for HTML.
- Hotspot: Used to specify an item as a tappable area in your app linked to features such as Popups, Web Links, and Jump Links.
- Media: Used to specify an item as a media object (audio or video).
- PDF: Used to mark an object which will be exported as a PDF instead of PNG or JPEG.
- Ad: Used to mark an InDesign object for implementing ad tracking services.
- InDesign Tagged Text (beta feature): Marks an object to be converted to Live Text on iOS devices instead of an image. Can only be used on text boxes. For more information, refer to the article "Beta - iOS - Saving Text as Live Text."
- Spacer: An object that is marked as invisible and will not appear in the exported Vertical.
- None: Applied to InDesign objects that are not used for mag+ features.
- Object ID: The ID of the object selected. This is used by mag+ to determine how to layer objects or connect objects to other functionality such as Linking, Popups, etc. No two objects in a Mag+ layout or Issue should have the same ID.
- Horizontal Pin: Used to determine how an object will be positioned horizontally when a layout is rotated. For more information on how to use Pinning, refer to the article "Adding Pinning to Objects."
- Vertical Pin: Used to determine how an object will be positioned vertically when a layout is rotated. For more information on how to use Pinning, refer to the article "Adding Pinning to Objects."
- Snap: Used to determine where an object will snap when a layout is rotated. For more information on how to use Snapping, refer to the article "Adding Snapping to Your Layout."
- Resample Image: Instructs InDesign to treat the object differently than the image rendering settings specified in the Designd Settings panel. For more information, see the description in the Settings panel, listed above.
- Zoom: Allows you to add a Zoom option to an object. For more information on Pinch and Zoom functionality, refer to the article "Adding Pinch and Zoom to Objects."
- Pan: Allows you to add a Pan option to an object. To learn how to use Panning and Scrolling, refer to the article "Adding Panning or Scrolling to an Object."
- Use Linked Image: Instructs the mag+ Plugin to use the full-resolution linked image connected to the object instead of generating its own optimized version when exporting. Typically only used in conjunction with the Zoom feature.
- Share Linked Image: Check this box if you want to share the linked image.
The following articles teach you how to use the various mag+ InDesign Plugin features:
- For more information on Web Links, refer to the article "Creating Web Links."
- For more information on Jump Links, refer to the article "Creating Jump Links."
- To learn more about audio and video objects, refer to the article "Adding Video and Audio to Your App."
- To learn how to add Popups to your layouts, refer to the article "Creating Popups."
- For more information on creating Control Images for media, refer to the article "Tips - Adding Control Images for Video and Audio."
- For more information on HTML objects in your layouts, refer to the article "Adding HTML Objects to Your App."
- To learn more about exporting objects in your layout as PDFs, refer to the article "Object Type: PDF."
The Designd Popup Panel
Introduced in Mag+ 5.0, the Designd Popup Panel lets you set the behavior associated with Popups in your layout.
Note: The Popup panel only becomes active when you have a Popup object selected, otherwise it will remain grayed out.
To learn how to add Popups to your layouts, refer to the article "Creating Popups."
The following options are available in this panel:
- Standard: Appears instantly once the trigger object (hotspot) is tapped. A user taps on the hotspot again to dismiss the Popup.
- Modal: Fades in a darker, transparent layer behind the Popup in order to give it more focus. A user taps on the darker background to dismiss the modal Popup.
- Default: Simply fades the Popup into view.
- Zoom: An animation that scales the Popup as it appears.
- Flip: Flip the Popup as it appears.
- Add Close Box: (Only available for Modal Popups) Adds a close button in the right-hand corner of the Popup.
- Center on Device: (Only for Modal Popups) Centers the Popup on the screen no matter where it is placed on the layer. This option prevents Popups from accidentally stacking on top of each other.
- Initially Visible: Makes the Popup visible immediately upon loading the page. Tapping the associated Hotspot toggles between hiding the Popup and showing it.
- Popup Group: A Popup that is part of a larger (or nested) group of Popups.
Note: Only one Popup in a Popup group can be displayed at a time. Triggering another Popup that is part of the same group will automatically close the previous Popup.