WireframePro makes drawing user interface mockups easy and collaborative. Since brainstorming UI designs is a team effort, its benefits are vastly enhanced when integrated within leading productivity platforms like Trello.
If you are a Trello user, With the WireframePro Power-Up, You can quickly turn your UI ideas into designs without ever leaving your Trello board.
Enabling the WireframePro Power-Up for Trello
Login to your Trello account. Open a board and click Show Menu in the top-right corner of the screen
Click on Power-Ups button, to list all the Power-Ups available for Trello
Now find the WireframePro Power-Up in this list and click the 'Enable' button next to the Power-Up item.
After enabling, a green checkbox will appear next to the WireframePro Power-Up listing which indicates that it is added to your board
Also you can verify, if it is enabled, as a 'WireframePro' button will appear when you open any Trello card in that board
Draw User Interface designs
To draw UI designs with the WireframePro Power-Up, you should have a MockFlow account. In case you don't have, the Power-Up allows you to create a new account with 14-day Free Trial (no credit card required)
Open any Trello card, click the 'WireframePro' button that appears on the right side
This will bring in a login / register form popup if not already logged in
You need to authorize and connect your Trello account with WireframePro initially. This is a must to enable WireframePro with permissions to access and attach designs to your Trello card
After login, it will open the WireframePro dashboard, which will provide options to create a new wireframe or open existing projects.
To create a new wireframe, select the type (Web, iPhone, Android....) and enter name for the wireframe
Now the wireframe editor will display. Here you can draw your UI design using the components listed on the left side
After the design is done, click the 'Attach to card' button in the upper-left part of the screen to export wireframe to high-quality image and automatically attach it to your Trello card
See the below picture on how to open MockStore from the wireframe editor. The MockStore allows you to get inspired, edit and attach from thousands of UI designs submitted by our active user community