Stylezone Miro Plugin

The integration of Stylezone with Miro provides you with a single source of truth when creating apparel collections, the two platforms automatically sync and update. The plugin enables you to add, and share styles from Stylezone onto the Miro collaborative online whiteboard for many purposes such as creating or designing lines and collection boards. In order to use the Stylezone Miro plugin, you need to first log into your Stylezone account on the Miro plugin.

The following video provides an overview of the Stylezone Miro plugin:

Log into Stylezone on the Miro plugin

To log into your Stylezone on the Miro plugin:

1. On the left side ribbon of the Miro whiteboard, select  to display the Apps options.

   

2. From the application options, select Stylezone. The Welcome to Stylezone window is displayed.

   

3. Select Login, then follow the login instructions. Enter the desired company address, then enter your Email and password details in the designated spaces.

   

4. The Stylezone Miro plugin popup is displayed. For information on the Stylezone Miro plugin options, refer to the Stylezone Miro plugin overview section.

   

To log out of the Stylezone Miro plugin:

You can logout from the plugin using the logout button at the bottom right of the Stylezone Miro plugin popup

Or

1. Select the Settings button at the bottom right of the plugin popup

2. In the settings window select .

Stylezone Miro Plugin Overview

In the Stylezone Miro plugin popup all your boards and collections are displayed. From here you can search and add styles to your Miro board. For more information on how to add styles to the board, refer to the Add styles to the Miro whitboard section.

The following table includes the Stylezone Miro plugin options:

Icon	Description
	Select to close the plugin
	Use the search engine to search for the available styles inside the styles tree
The Styles Tree	All the available styles from the collections/groups exist in the styles tree. Use the arrows to expand the groups and collections to view the styles. For more information on how to use the styles tree, Refer to the Styles Tree Overview section in this article.
	Use the Split colorways option to either split the colorways of a style when added to the whiteboard or add them as one unit. Split colorways options disabled Split colorways option enabled
	When a blue dot is displayed on the sync button, it's an indicator that there are changes in Stylezone that should be synced with Miro. When there is no blue dot on the sync button, it means that all styles or collections are synced with Stylezone. Note that when a style or colorway is deleted from Stylezone, after sync the style will have a deleted data source icon next to its title. The style popup will not be available anymore.
	Change the settings of the styles fields and how they are presented in the styles cards on the board. Saved changes are applied to all styles after the next sync. When the style fields are added, removed or modified by an admin on Stylezone, they are updated here as well after a sync. The Style name and Colorway name options are part of the style card title. The rest of the fields will be presented on the card as tags, if they contain a value.  Use this button to log out from the Stylezone Miro plugin.  Do not forget to save the changes you applied.  Use this button to reset the changes applied to the styles fields.
	Stylezone Miro plugin log out button.

Styles Tree Overview

The styles tree is where all the groups and collections that you have access to are displayed. From the styles tree you can add the styles into the Miro whiteboard. For more information on adding styles to the Miro whiteboard, refer to the Add Styles to the Miro Whiteboard section in this article.

The tree consists of groups> boards> styles (or Collections > Sections > Styles). Use the arrows next to each section to expand.

The styles appear inside style cards with the Stylezone cover image displayed for each.

Hover over a style card to display the number of colorways that it includes.

Add Styles to the Miro Whiteboard

With the integration of Stylezone with Miro, you have the ability to add styles to the whiteboard and design boards, lines and collections dynamically as you wish. The whiteboard is dynamic and live, in other words, the styles inside the boards are automatically updated according to Stylezone.

As mentioned previously, styles can be added onto the whiteboard from the styles tree. You can add the styles to the Miro whiteboard by dragging or selecting the style.

To add styles to the Miro whiteboard by dragging:

1. Go to the desired style card in the styles tree.

2. Drag the style to the desired location on the whiteboard.

The following image shows how to add a style to the whiteboard by dragging

To add styles to the Miro whiteboard by selecting the styles:

1. Go to the desired style card in the styles tree.

2. Click the desired style or styles to select. The selected styles mode is activated, you can see the number of selected styles in the Add button.

   

3. Click the Add button. The selected styles are added to the Miro whiteboard.

The following image shows how to add a style to the Miro whiteboard by selecting styles.

To deselect a style, simply re-click the style or use the  at the bottom to deselect all styles at once.

Miro Board Style Card

When you add styles to the whiteboard from the styles tree, the styles are added as style cards. Style cards are frames that hold a style image, and a style information card which includes the style name, style colorway (if applicable) and information tags, all synced with Stylezone.

Images can be moved away from/out of the frames, and remain connected to the style.

The following image shows the different 3D style card parts:

Hover over the style information card part of the frame to display the expand option.

Select the expand icon to display the style popup in full screen, and review the style and its assets.

Use the comments button to add comments on the style

Use the data button to display style data

Use the status drop down to change the style status

Note that when a style or colorway is deleted from Stylezone, a deleted data source icon appears next to its title. The style popup will not be available anymore.