Each week, Marketplace Monday profiles one great add-on available in the Atlassian Marketplace–where you can try and buy more than a thousand add-ons for Atlassian products.
For the last few weeks, we’ve either covered add-ons that report data contained in a Jira instance (Jira Timesheet) or organizes data in Confluence (Scroll Versions). As every great product team knows, creation is the most important part of the product lifecycle. Jira and Confluence are great for creating specs and tracking features, and Balsamiq Mockups extends their abilities by offering wireframing superpowers right inside Jira issues and Confluence pages.
Overview
Balsamiq Mockups for Jira and Confluence are add-ons that embed the powerful Balsamiq Mockups tool right inside of Jira and Confluence. While on a Jira issue or Confluence page, you simply click “Add/Edit UI Mockup” and are instantly transported into the Balsamiq editor. After mocking up to your heart’s content, two attachments are created for the page or issue you’re working on: a .bmml file, which is a reusable XML data version of your mockup, and a PNG image of the mockup which is automatically embedded in Confluence pages.
Design the complex, simply
Balsamiq aims to combine the comfort and simplicity of paper sketches with the power of a digital tool. The playful, hand-drawn look of Balsamiq mockups is intentional–it helps ensure that people don’t get distracted by small details and focus on the big picture instead. Balsamiq’s drag-and-drop interface allows you to take one of the UI components in their extensive library and drop it right on to the canvas. Then you can adjust the color, size, text, transparency, and other attributes through the component inspector window.
Here are the key features that elicited this quote about Balsamiq mockups from Atlassian President Jay Simons:
Mockups is bitchin’. Pure and simple. It’s rare to find a tool that both devs and non-devs enjoy using, and use productively together. Huge fan!
- Balsamiq is simple and fast. When used within Jira and Confluence, it’s super easy to edit, discuss, and iterate on mockups in the middle of a meeting. Developers, designers, and marketers can all get up and running on Balsamiq in seconds.
- Balsamiq mockups look great and get your team focused on the important issues at hand…”How should I lay out elements on the page?” “Where should the menu be?” And with click-through links in Box for Confluence this becomes even more powerful.
- Developers love keyboard shortcuts. Everyone loves keyboard shortcuts. Balsamiq has lots of them, including a quick add menu where you can start typing the UI element you want, click enter, and it’s instantly added to your mockup. You can also use wiki style text formatting to “*bold*”, “_italicize_”, and “[link]” Markdown-style at will.
Atlassian + Balsamiq
Balsamiq’s add-ons for Jira and Confluence allow users to inject the ease and simplicity of Balsamiq’s mockup creation process into the product development cycle they’re already managing with Atlassian tools.
Adding Balsamiq to Atlassian allows everyone to collaborate and contribute to product development. Product mockups are no longer the sole domain of the UX designer–instead, every stakeholder in the project can contribute design ideas and offer feedback, right in the context of all the other work they’re doing in Jira or Confluence.
Mockups can save time by expressing quickly what would normally take paragraphs in a product spec and allow QA and developers to give more specific feedback to designers, and vice-versa. With open Jira installations, customers can even contribute to the product development process by drawing, rather than just writing, their feature requests.
What’s coming
In the last four years, the Balsamiq team has sold over $1.2 million of their Confluence add-on and almost $1 million for Jira. The upcoming version of Balsamiq, 2.2, features a completed revamped UI. Mike Angeles, the UX designer for Balsamiq, detailed the changes in a blog post. With this next release, Balsamiq is bringing much of the visual goodness of Balsamiq’s desktop interface to the web-based versions, including the Jira and Confluence add-ons. On top of the updated chrome, they are also releasing a new wireframe skin with cleaner, simpler lines and text. Perfect for when you’re presenting your mockups to people who might find the hand-drawn styling a little too cartoonish.
The X-Factor: Mockups Extensions
Balsamiq has a thriving ecosystem of user-created extensions to their products. Their community has created a number of additional UI control libraries and tools for turning your mockups into code.
You can now get great add-ons like Balsamiq Mockups straight from the Universal Plugin Manager, which is available in Jira, Confluence, and our developer tools. If you’re running UPM 1.6 or later, just check the plugin manager to update to the latest version. Otherwise, download it manually from the Atlassian Marketplace. Read more about the awesome updates the Atlassian Ecosystem team is bringing to the add-on experience!