New Power-up: Translate your wireframes to over 60 languages instantly

Screenshot 2020-10-08 at 6.52.54 PM.png

Localizing your UI at the wireframe stage is very important for various factors. Each language has a different string length and it can mess up interfaces and text layouts with fixed dimensions. The design might also need an update based on the language it serves as when switching from LTR to RTL.

It is essential to determine all these factors at the planning stage especially when your website or application will be multi-lingual.

Here is where the new "Translator" power-up comes handy. Using the 'Translator' power-up, you can localize a particular set of components in the mockup or the entire page with just a click. Thanks to Microsoft Cognitive Services, the power-up automatically detects the source text's language and translates to the target language. It also auto-saves the project's target language, so you don't have to select it whenever translating.

For more information and installing the 'Translator' for your WireframePro editor, Click here.

New Power-up: Image web search with Bing


Finding the right placeholder images for your mockup is not an easy task especially when time is a critical constraint. We now bring the power to search the entire web and import online images at your fingertips.

Powered by Microsoft Bing, this add-on appears as a sidebar where you can look up and browse images just like in a search engine. It also helps to preview or import any image to your mockup in a single click.

This powerup helps to save time and improve productivity in your software planning process by integrating search services within the WireframePro editor.

Note: Make sure you preview the image and use the image as per its license terms before you import them

For more information and installing this Powerup. Click here.

New Power-up: Create websites collaboratively for your wireframes

Blog Image.jpg

We are happy to release a new Power-up for WireframePro - a collaborative website builder. After brainstorming and visualizing your UI ideas rapidly with MockFlow, it is now possible to implement them for real using this Power-up.

It is a highly flexible code-based visual builder with a rich feature set and, most importantly, made for teams.

Use website powerup to:

  • Create static websites from scratch
  • Modify websites easily with visual editor
  • Upload and manage website assets
  • Publish and link websites to custom domain
  • Download entire website as a zip file
  • Create backups of entire site
  • Each file has its own revision history
  • Real-time editing of files
  • Live preview of code changes
  • HTML includes for re-using parts
  • Auto gzip and minification

Make your ideas real with Website Powerup

New feature: Saved components for projects


Managing a large wireframe project in MockFlow is now more easier with 'Saved components'. This feature helps designers to save 'reused' components and design elements as part of the project itself.

For example: Imagine a designer creating a wireframe project for a large e-commerce website that will run into multiple pages and screens. The designer can make - product item UI, ratings, ad blocks as part of 'saved components' and reuse these elements whereever required in the project by a simple drag-n-drop.

Not only that, the designer can create themed components specific to that project like blue button, rounded drop-down and icons to visually describe that project's design system.

'Saved components' are tied to a project, so if the project is duplicated, shared or send a copy to another user, the components go along with the project.

Also it can be simply cloned as a custom UI pack, if the components need to be reused across multiple wireframe projects.

This feature is now released and available for both Web and Desktop apps.

In your wirefame project, just select any design element(s) and right-click to add it as a saved component.

New UI Packs: iPhone iOS 14, iPadOS 14 and macOS 11

As announced in Apple Inc's WWDC major releases of iOS, iPadOS and macOS are round the corner. These new upcoming versions bring many changes to UI elements and design across Apple's software lineup.

To help easily brainstorm your UI ideas and visualize concepts for the new OS with the same look and feel, MockFlow now supports the following UI packs:

mac OS Big Sur 11 - 192 components

MockStore Link

macOS Final.jpg

iOS 14 - 97 components

MockStore Link


iPadOS 14 - 171 components

MockStore Link


Revision history 2.0: Timeline view, compare changes, now in Offline mode

Visualize revisions like Git.jpg

The title of this post summarises today's release of MockFlow web and desktop apps which brings major updates to Revision history. One of the benefits of having a digital whiteboard is to track changes and save versions.

While MockFlow had revision history function right from its first release, this update pushes this feature to the next level. Let us see how:

New UI: Visualize revisions like Git

Previously revision history was listed in plain data grid style in a dialog box. While it served its purpose, it lacked the flair and perception of a graphical timeline.

Now we have redesigned Revision History UI from scratch deeply inspired from git, the popular version control system. In this visualisation, it is easy to track change log by user or time and also make out manually checked-in revisions from auto-revisions.

Find diff: Compare revisions

Compare revisions Final.jpg

Now revisions can be graphically compared with one another to easily highlight the design changes between revisions. When a revision is previewed, a new compare button helps to find its differences with any other revision including the master version.

Offline revisions: Revision history inside .wire files

Unlike many other tools, Revision history need not be a feature only for cloud based software. Tracking changes is an essential feature irrespective where the data resides. Therefore we now bring offline revision history built right within your MockFlow file format - .wire files.

Just like the online app, all its functions - auto revisions, manual check-in revisions, save, restore, preview, compare revisions are available for .wire files in desktop app. And it is all saved within the .wire file even without network connection. So sharing the .wire file (just like any other file), will also include its built-in revision history. Imagine sharing an image to a designer that will include its entire change log within the same file.

Offline revisions.jpg

Bonus: Trash can for pages in Offline mode

Here is a bonus feature for desktop app users with Offline mode. Just like revision history, trash feature for pages is now available for .wire files. Say goodbye to accidental deletes even in Offline mode.

Introducing: Mobile web app for WireframePro

Blog Image Final.jpg

Collaboration is key to brainstorming UI ideas. For better and faster decisions on creating user interfaces, stakeholders should be able to collaborate easily and seamlessly irrespective of their platform, device or the tool they use.

We at MockFlow aim to provide a full 360 degrees collaboration environment for UI. Which is why apart from our web and desktop apps, MockFlow integrates deeply into flagship business software like Slack, Trello, Office…

As part of this approach, It is now time to make MockFlow available for mobile devices. We are thrilled to release our official mobile web application for WireframePro. Listed below are the main features of this mobile app.

  • Opening any WireframePro link in a mobile device will automatically switch to a touch friendly interface
  • Use mobile app to interact and review wireframes, view notifications and make comments
  • Preview WireframePro mockups in mobile devices from your desktop app easily using QR code
  • The dashboard and viewer has been redesigned for touch in a responsive way whether it is tablets or phones

This release can be considered as our first step towards providing a fully touch based editing and collaboration experience. More coming soon…

Open in any mobile device. Tested in iOS and Android.

Screenshot 2020-07-17 19.27.05.png

New component: Advanced data grid


Datagrid components are widely used in wireframing UI for business apps and sites. They help to quickly draw tables, fill data and imitate the real implementation.

In addition to the existing basic datagrid component, we are releasing a new advanced version of this today. The basic datagrid component will continue to exist as it is easy to enter data with its comma separated syntax. However it misses on certain core features that required a new component.

Advanced datagrid component is all about customization and visual editing. It brings the following features:

  • Graphical editing of columns and rows
  • Support for multi-line text
  • Support for icons
  • Click-to-edit cell feature
  • Easily resize rows or columns
  • Style individual rows, columns or cells
  • Cell based linking

Try out this new component in WireframePro editor. It is available as part of Web and Common UI packs.

Neumorphism UI Pack


Neumorphism is a fresh UI design trend characterised by its subtle shadows, rounded edges and extruded visual styles. It is now increasingly used in mobile apps as an alternative to skeuomorphism.

To make wireframes for Neumorphism UI layouts, we have now released a new UI pack in MockStore that includes over 100 components specifically crafted for drawing Neumorphism based mobile UI.

View UI Pack

New Powerup: Font manager

Screenshot 2020-06-08 12.05.00.png

We are excited to introduce another new Power-up to MockStore. This time its all about Fonts. In follow-up to the previous release, Fonts are as important as colors when comes to UI designs. Selecting and mixing the right font faces with font styles based on content not only makes it look good but also improves accessibility for viewers.

Font manager powerup helps designers select the best font for their UI by providing the following tools:

  • Manage and share all your font assets easily
  • Create and view custom text styles based on font settings
  • Select and compare fonts side-by-side
  • Google font support

To know more and install this Power-up in your editor. Please visit the below link Fonts powerup