At UXPin we know that the greatest designs require passion, ideas and effort of multiple people. This is why we’ve decided to bring collaboration to a higher level with our brand-new Free Flow Documentation feature! Now a clean way of adding some extra context to your designs is right there, at your fingertips.
Add your documentation while you design
The documentation mode is available directly in the editor for Systems and Enterprise customers and you can easily open it whenever you feel a need to describe something further or add some additional remarks. It’s located on the top bar along with Design and Preview modes.
Once you click the Documentation icon, you’ll be switched to the documentation view with the area for adding your remarks on the right.
This section works as a text editor – it’s enough to place your cursor there and start typing your comments. You can conveniently edit your documentation using your keyboard: if you want to start a new paragraph, just press Enter. And when you need a new line in the existing paragraph, simply use Shift+Enter shortcut to create one.
If you want to make some pieces of information stand out, you can simply select your text and add styling options. Or you can use the well-known keyboard shortcuts!
In the Documentation mode, you can either leave a general note for the prototype or pin it to a specific element on your canvas to make it easier for your co-workers to follow.
To pin a piece of documentation, first you need to select your suggestion, click the “Pin to element” icon to the left and choose your element on the canvas. You can also create an empty paragraph, pin it to the element and fill it with content later on.
Once you pin it, you’ll see an indicator with a matching number both for the note and for the element. Additionally, the active note will be marked with blue, so you can easily differentiate it from others on the list.
If you want to remove pins from your suggestion, just hover over the pin and click the “Unpin from element” icon.
View your Documentation on Preview
The documentation is now available also on our preview, so you can share it with your entire company, including the development team and stakeholders.
When you open the preview, you’ll clearly see which pages have some Documentation added – they will be marked with a yellow dot next to the documentation tab as well as with a proper icon in the sitemap.
To open the Documentation mode on preview you just need to click the Documentation tab on the top bar. You’ll be automatically switched to the Documentation view where you can see all the information added previously in the editor. Once you click on a pinned note, it will turn blue both for the note and the pinned element.