Internal
Editor
How to enable enable quick settings toolbar?Learn how to enable the Quick Settings Toolbar in MockFlow WireframePro to streamline your design workflow.Supported Embeds in MockFlowPitch
Embed Pitch presentations into MockFlow by following this help article.
WowTo
Embed support videos created with WowTo...About MockFlow WireframeProWireframePro helps to visualize your wireframing and user interface ideas, allowing you to brainstorm UI concepts with your team...How to create my wireframe project with AI?AI-powered wireframe generation speeds up design workflows, enabling quick ideation and effortless prototyping. Follow the steps...How to Add Annotations in Wireframe?Learn how to add annotations in wireframes using MockFlow WireframePro to enhance design clarity and communication.How to use Minimap in WireframePro?The Minimap in wireframing provides a quick, zoomed-out view of the entire design, making navigation seamless.
To access the...How to share the project from editor?The project can be shared from inside the editor by following the steps below.
In the MockFlow WireframePro editor, click on...How to Switch Between Projects Using the Unity SidebarThe Unity Sidebar allows seamless project switching within the editor, improving workflow efficiency and accessibility. Follow...How to create project public link from editor?You can share a project using a public link, allowing anyone to view it in view mode. Follow the steps below to create a public...How to Enable Dark Mode in MockFlow?Seamlessly toggle between light and dark mode in MockFlow for a more comfortable design experience.
The new dark mode is...Alignment guides in Wireframing EditorAlignment guides in wireframing ensure consistency and precision by helping position text, images, and objects evenly across the...How to track project activities inside MockFlow?Easily track every modification to your wireframe designs, including who made the change, when it was made, ensuring...Copy Paste Style of your ComponentsCopy styles from one component and effortlessly paste them into another or multiple components. This will save you valuable time...Difference between MockFlow Web-Based Editor and MockFlow Offline EditorThe MockFlow Offline editor provides most of the features that are available in the MockFlow web app, along with improved...Revision history for projectsMockFlow has built-in revision history or version history feature for tracking and managing each page's changes in a...Lost Data? Read how-to recover lost wireframe changesTo save changes in MockFlow, the user needs to click the 'Save' button from the top menu or the 'Save Changes' button that...Saving in MockFlow editorTo save changes made to a project, the user has to press the ' Save' button from the top menu.
While the purpose is to prevent...My wireframe page does not resize / enlarge ?The MockFlow Wireframe editor automatically resizes the page as components are dragged near the edges of the page.
Note: Very...DataGrid/Table component inside MockFlow
The basic DataGrid or DataTable component inside MockFlow helps to quickly create rows and columns of data with shortcuts. The...How to set gridlines in editor?Turning on grid settings is key to creating clean, well-aligned wireframes. Follow the steps below to access your grid...How to hide certain pages in review modeThere might be a necessity to hide certain pages in Review Mode like UnFinished Pages, Master Pages, Confidential work...
Note...How to export my wireframe project?Wireframe projects in MockFlow can be exported in various formats, including images, PDF, PowerPoint, MS Word, and offline...Exported wireframe images includes lot of white space. How to fix it?This issue usually occurs when the wireframe has extra components in the page that are not clearly visible to the user. For...How to copy paste components between wireframe projects?Use Keyboard shortcuts (Ctrl+C to Copy and Ctrl+V to Paste) to directly copy-paste wireframes between projects opened in...WireframePro keyboard shortcutsMockFlow WireframePro supports the following keyboard shortcuts. Certain shortcuts might not work in certain browsers due to...How to create specifications in wireframe and export it?There are multiple ways to create specifications in MockFlow WireframePro - Like using Annotated Comments to add details for the...How to view layers in WireframePro editor?MockFlow WireframePro editor provides an intuitive way to navigate layers in a wireframe drawing. Learn how to rearrange, show,...How can I change default font family in WireframePro?To change the font family of a component, follow the below steps:
Select any component that has text like Button, Label,...How to zoom pages in editor?Keyboard shortcuts: Cmd+ to increase zoom. Cmd- to decrease the zoom. Cmd0 to reset Zoom.
Available in editor and review...How to create Master pages in editor?Master pages help to reuse the same content across different pages of a project.
Use Cases -
Master page for common header of a...Image management - Upload, edit or delete imagesThis article describes all features of image management in MockFlow WireframePro
Upload Image
Delete Image
Copy Image
Edit...How to generate design specifications ?Generate pixel-perfect specifications and CSS code for any component used in the wireframe. 'Specs' simplifies design...How to do freehand drawing in editor ?Apart from ready made components, the user can also draw freehand in the page canvas by enabling draw mode.
The following...How to edit multiple components at once?For example, to change the font family of multiple text components, first select the components in the editor. Then, from the...Snap to Grid in Wireframe editorBy default, when you move components in the Wireframe editor, it does not snap-to-grid. However, if you want to snap components...Mini Mode in MockFlow WirframeProDiscover how Mini Mode enhances WireframePro by maximizing canvas space and simplifying tool access.Change page background color / transparentThe default project background color of MockFlow WireframePro is white. However, the background color can be set before the...How can I check-in revision of an entire project ?Revision history in WireframePro is page level. For each page, revisions are auto-created or checked-in based on the changes...How to add custom fonts to WireframePro ?MockFlow WireframePro provides several built-in fonts specially chosen for UI typography and also integrates Google Fonts...How to set a specific page size ?By default, the page canvas in MockFlow WireframePro has auto-size. Which means the page automatically increases or decreases...Icons in WireframeProThere are several ways to get icons in the MockFlow WireframePro editor. Let's explore them one by one:
Font icons
The common /...Style components with CSSIn addition to using the point-and-click settings panel for styling components in the Wireframe editor, also CSS code can be...About BYOCBYOC stands for "Build Your Own Component". It is essentially a component by itself that allows for creating new elements from...Trello Power-Up Integration helpWith the MockFlow WireframePro Power-Up for Trello, You can quickly draw User Interface mockups for websites, apps and attach it...Expand / Collapse all pages in sitemapPage tree - expand/collapse all pages. It is available in editor and review mode.
Click Expand/Collapse Sitemap to show parent...
Was this page helpful?