Introduction to Balsamiq Wireframes for Jira Server
This page contains usage instructions for Balsamiq Wireframes for Jira Server.
Using Jira Cloud? Please see this article instead.
Jira Server Administrators: the Balsamiq Wireframes for Jira Server Admin Guide is for you.
Balsamiq Wireframes for Jira Server provides very similar functionality to Balsamiq Mockups 3 for Desktop. The main difference is that the Balsamiq project files are stored and managed as Jira Server attachments.
Adding a New Project to a Jira Issue
To add a new Balsamiq Wireframes project to a particular Jira issue, you simply need to click on the "Add Balsamiq Wireframes" menu option.
This will launch the Balsamiq Wireframes editor, where you can create your wireframes (or import existing ones). This will also create a new Balsamiq Project file (.bmpr file extension) attached to your Jira issue containing all the resources that belong to a project (wireframes, symbols, images, icons).
If you do not see the menu option, please check with your Jira Server administrator that the Balsamiq Wireframes for Jira Server app is installed and that you have editing permission on the current issue.
Using the Balsamiq Wireframes Editor
The Balsamiq Wireframes editor allows you to create wireframes just like our other products. Start with the application overview to learn more about using the editor.
Collaborating with Other Users in Real Time
Balsamiq Wireframes for Jira Server supports real-time collaboration between users. You only need to have everyone launch the editor on the same project. Everyone’s changes are shared in real-time with all your collaborators.
The other users connected will be shown in the top right corner of the editor. Hovering over their picture shows their Jira username.
Copying or Moving Wireframes between Projects
Sometimes you might want to copy or move a wireframe (or a few) from one project to another. Here is a simple way to do it:
- Open the two projects (each in its own browser tab or window)
- In the source project, select the wireframe(s) you want to copy or move
- Copy the wireframe(s) (CTRL/⌘+C)
- In the target project, paste your wireframe(s) (CTRL/⌘+V)
That’s it! You may now delete the wireframe(s) from the source project if you wish.
This simple method works across all our Balsamiq Wireframes products.
Note: Symbols and Assets/Images are also transferred during this process so no need to worry about those.
Importing from Other Versions of Balsamiq
If you have a project created in another Balsamiq product (using the .bmpr extension), the easiest way to import it is to create a new project and use the Project > Import > Import from BMPR... option.
Exporting to Other Versions of Balsamiq
To export your project to another Balsamiq product, all you need to do is download it and open it there. Selecting the Project > Export > Download Project BMPR option will create a .bmpr file to download containing all the wireframes, symbols, and images used in the current project.
Saving the Project
All the changes made on your project in the editor are always autosaved and visible by the collaborators that are editing the same project in real time.
However, the changes made in editing mode (i.e. inside the Balsamiq Wireframes editor) will not be flushed to the official version that is attached to the Jira issue until the project is expressly saved.
This can be done by selecting the Project > Save Project option or by simply closing the editor.
Returning to Jira (Closing the Editor)
When you are done editing your wireframes you can exit the editor by selecting the Project > Exit back to Jira option. This will also save the current project and update the version that will be now visible on the Balsamiq Wireframes Panel.
Alternatively, you can perform the same action by clicking on the breadcrumb link pointing to the issue containing your BMPR project, on the top-left part of the menu bar.
Using the Balsamiq Wireframes Panel
Once you have created a new project, the Balsamiq Wireframes Panel will appear on your Jira issue.
The panel will show the thumbnails of the wireframes contained in the currently saved version of the Balsamiq project. A variety of actions are available from the Balsamiq Wireframes Panel.
Editing Existing Wireframes
There are two ways to open the editor from the Balsamiq Wireframes panel:
- You can click the "edit" icon that is shown when your mouse is over each thumbnail. The editor will open showing the selected wireframe.
- You can click the Edit button: the editor will open the project on the first wireframe.
Note: If you have read-only permission on an issue, you will still be able to access the Full Screen viewer but you will not be able to edit the wireframes.
Adding a New Wireframe
Clicking the Add Wireframe button will open the editor and create a new wireframes named "New Wireframe 1".
You can also add wireframes directly from within the Balsamiq Wireframes editor.
Deleting the Project
If you want to remove a project from the Jira issue you can use the Delete Project button.
Note: This action can not be undone.