MockFlow update: Self-serve 'License Manager' - upgrade/downgrade users in a click

License

This week we introduced a new feature to MockFlow called 'License Manager' that is very useful for teams. 'License Manager' automates the process to purchase, upgrade or downgrade MockFlow licenses for your company within a mouse click. Now businesses with MockFlow team upgrades can allot, re-allot upgrades among their users without mailing us and also purchase addon user licenses with 20% discount from the normal rate ($47/user/year).

The License Manager also allows administrators to review their subscription periods and available licenses. This system is fully automated such that when a user's account is upgraded/downgraded the concerned person will receive email automatically notifying about the process and also when a user is added to your license, that person's email will get enlisted in your 'My Team' listing.

Besides this, other updates worth mentioning include new 'Dotted' background grid type and auto column size option for table component.

MockFlow update: Introducing overlaid Mesh Grid and 960 Grid support

(download)

The support for Grids has been the most requested feature for MockFlow and today's update more than satisfies it. In the settings panel of the 'Page' you will Grid configuration that provides the following three options:

1) No Grid - revert to plain white background
2) Mesh Grid -  As pictured above it is like a graph paper. The spacing and line color can be configured
3) 960 Grid - Popular among Website creators. There are settings for column width, gutter width and color

In a typical design tool you find the grids are positioned in the background but we found in our user testing that a background grid becomes useless in MockFlow as you add non-transparent components to stage it will block the grid layout. So the grid is overlaid on top of your Wireframe without affecting interactivity but aids in precise positioning of components.

BTW What is a Grid?
Most web designers would be aware of grids, however to those who don't, A Grid is like a graph paper that helps to layout your wireframe components and images precisely and also for relative positioning of items.

 

MockFlow brings Wireframing to Google Apps

Gapps

We got MockFlow approved into Google apps marketplace last week, so it is time to officially announce about this integration. If you are using Google Apps for your business you can simply click-to-install MockFlow for all the users at your Google Apps domain. There is no registration process involved which means no additional logins. 

After MockFlow has been added for your domain using the 'Add it now' button, it is immediately accessible from your Google Apps universal navigation bar - to create and collaborate user interface mockups with your team. As you may already know MockFlow comes with a comprehensive package for collaboration that includes: chat, real-time editing, team logs and user permissions.

 It's FREE!

MockFlow update: New Arrows in 'Note' component

Notecomp

We are constantly improving MockFlow to make sure it lives up to its tag called "Super-Easy". Today's update again justifies that effort with an improved 'Note' component. The 'Note' component is very popularly used in MockFlow along with the 'Arrow' component to point out what the notes refer to. So we thought why not combine this functionality by integrating 'Arrows' with 'Notes'. As a result of which, the Note component now features two arrow indicators (left and right) when the mockup is in edit mode. The arrow indicators can be simply dragged and placed anywhere in the mockup and also the arrows can be set to any preferred color. The left-right arrow indicators in the note would automatically disappear when the mockup is switched to the Presentation mode.

This new functionality would improve the usability of MockFlow especially its annotation features by a lot. And here is a very short demo video on how it works:


MockFlow update: Drop-down menus/Link hierarchy in Navigation components

Sublink

The new feature in today's build helps to enhance interactivity in Wireframes at a button's click. You can now optionally provide sub-menus for link hierarchy (as shown in the picture above) using the Link Settings of navigation components. When the menu support is enabled, the component will show drop-down menus for any sub-pages (children) that exists for that link. The menu popups on rollover of an item and on click navigates to the corresponding page.  Ofcourse this will only work in the 'Presentation Mode' of a mockup. The following components supports this functionality:

  • BreadCrumb
  • Horizontal ButtonBar
  • Vertical ButtonBar
  • LinkBar
  • MenuBar
  • TabBar
  • TabNavigator
  • WedgeBar
This is useful for creating drop-down/hierarchy menus for Website mockups and interactive MenuBar controls for software mockups.

MockFlow Big Update: Super-fast data transfer, HotSpot Component, Project Types (web, mobile,plugin...)

Bigupdates

 

We are very excited to start off this month with a bunch of new features in addition to a number of unannounced refinements. The features are explained below in the order as seen in the picture:

1. New HotSpot Component
MockFlow gets a new component called HotSpot. The HotSpot (listed under 'Navigation' components) is used for linking a particular area of an image or mockup. Also the component will automatically
disappear in Presentation/Review mode. This helps to enhance the interactivity feature of MockFlow.

2. Change MockFlow ID
Recently we had a string of requests especially from our Premium users the ability to change the email associated with their MockFlow ID. Now this function is available in the account settings, using which you can change your email address i.e the MockFlow ID and it would not affect anything including shared projects.

3. Project Types
Some of the popularly used templates from our MockStore has been now integrated into the CreateNew Menu of the dashboard. As seen in the picture above, within one-click you can choose
the nature of your Mockup project from a facebook app to a Google Chrome extension, then MockFlow would automatically pull the associated template saving time and effort.

4. Super-Fast Data Transfer
(We reserved the best for the last). For those of you unaware, MockFlow always uses Java and BlazeDS to exchange data between server and client in a reliable and efficient manner. However it did not work fast enough for huge mockup projects, so we filled a missing piece by transfering the Mockup data (which is XML) between server and client in a securely compressed binary format (in addition to AMF3). The performance increase will be very apparent when loading and saving medium-to-large mockup projects achieved by transferring minimal data.

MockFlow update: Refinements & Duplicate projects in 1-click

Duplicate2

Today's update to MockFlow's web & desktop software brings in loads of refinement including better support for *very* large sitemap visualizations, persistent zoom-to-fit across all pages and fix in font settings. Also included is a new premium-only feature called 'Duplicate'. The 'Duplicate' button allows to quickly clone a mockup project providing the following benefits:

  • Easily make backup copies of an existing project
  • Archive changes of a project similar to revision history
  • Simultaneously work on different wireframe types for a website/software
We made some commitments this week in twitter about bringing private sharing in MockStore & Team user management console, we are already working on it and hope to release them one-by-one after our rigorous Quality Assurance testing.

MockFlow update: 'Super Zoom' now available in Editor

Zoomss

We had the 'Zoom' feature for ages in MockFlow but it was only available when the mockup is in 'Presentation mode' and also it was limited in functionality. Today's build reintroduces the 'Zoom' for both the Editor and Presentation modes along with an auto-fit feature. You can control the zoom settings for the editor using the new blue icon as pictured above or using keyboard shortcuts.

Ctrl +  : Zoom In
Ctrl - : Zoom Out
Ctrl+0 : Zoom 100%
Ctrl+1: Auto-Fit

The Auto-Fit function will automatically zoom the workspace containing the mockup to your visible screen area so that scrollbars are avoided. Overall zoom in editor makes it very useful for working on large sized mockups without compromising on space.

p.s. we call this 'Super' zoom as it also scales any master pages/templates if present

MockFlow update: SiteMap visualization is now fully interactive

At MockFlow, we want to always provide our users with the state-of-the-art Wireframe experience and today's update is a sample of it.  The new sitemap visualization introduced this week has been now made fully interactive. Rollover on the nodes of the sitemap to view icons to add,delete and duplicate pages. Also you can easily drag a page/folder around to change its parent/position. As you can now directly build on the SiteMap visualization the user experience is very intuitive.

The demo video embedded above provides a quick overview of these features.

MockFlow update: New SiteMap Visualization

Visualize

A major update to the SiteMap Visualization has been released in today's build for both web & desktop clients. This new tree graph has been written from scratch and it provides an interactive overview of your wireframe's sitemap in a mouse click.

Some salient points of this feature:

  • Navigate your wireframe using this visualization by selecting a page
  • Zoom-Out function lets you accommodate larger sitemaps in smaller screens
  • Export your sitemap to a PNG image file
Also we will soon release more interactive features for this visualization to directly add/remove pages and folders.