New Powerup: Color palettes

D720f03cc1dac84f7a424d5e57ae19dfb.png

Choosing the right colors, form one of the crucial pieces of any UI design. The right colors can even turn a UI into a brand, create a better user experience, try to make an appeal and attract users. The new "Colors" power-up helps designers in every way to pick the best colors for their UI designs.

What it does?

  • Choose from popular color palettes - Material, Bootstrap, Fluent…
  • Create and share custom color schemes
  • Save favorite colors directly to your Wireframe project
  • Colors converters for RGB, CMYK, Hex…
  • Grab colors directly from any image
  • Color wheel picker

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

Introducing "Page blocks" in Sitemap nodes

mj.png

MockFlow SiteMap - Software for quickly creating visually appealing outline structures for websites and apps has now got its long deserving big update with the introduction of "Page blocks" for sitemap nodes.

"Page block" helps to provide a drill-down view of a node in just a glance. Let us assume we are creating a SiteMap for a business website with pages for homepage, products, about us and contact.

In addition to creating this website structure, page blocks allow users to create distinguishable blocks inside each page that appears within the nodes.

For example: Homepage will have header,main banner, customers and footer blocks. About us page can have header, team, company timeline and award blocks.

With this feature, SiteMap now provides a comprehensive solution for users to model their Information Architecture (IA) for websites and apps. It is now available for immediate use at sitemap.mockflow.com

Sample: View example sitemap using blocks

New component - "Arrow path" for creating user flows

arrowpath.png

"ArrowPath" is a new component introduced in the latest updates for WireframePro web and desktop apps. ArrowPath lets you easily create composited lines with multiple joints that can be dragged to create your own flow. It also provides several arrow styles for start and end points for creating custom pointers as per your needs.

flowchart.png

The above features make the component highly useful in the following use cases:

  • Demonstrating user flows between various wireframe UI screens as shown above.
  • Flowchart diagrams for depicting algorithms and workflows for UI
  • Illustrating mockups with annotations

ArrowPath is now available as part of Common and Annotation UI packs. And also as part of the handy toolset bottombar under components section.

TeamChat feature improvements in WireframePro

cb3f00512967406a9d0c8827c82bb967.png

Screenshot 2020-04-08 14.00.30.png

Communication and feedback are key elements for teams when brainstorming user interfaces. The new refreshed TeamChat feature in WireframePro helps make discussions - real time, annotated and fast.

Apart from a complete design overhaul, the new TeamChat has the following improvements:

  • Direct chat launch within the editor
  • Do-not-disturb mode
  • Online status of project members
  • Send selective chat invites
  • Start video meetings

Also in response to the recent COVID-19 outbreak, we are providing free TeamChat access to all plans in MockFlow to facilitate easier remote UI collaboration.

Create illustrative mockups with this new UI pack

Ma075999a4338333eed91b3af8ac6507f1583824829811.jpg

We are happy to release a new UI pack called "Illustrative mockups" for WireframePro. It provides over 100 components for building colorful UI illustrations. Illustrations are unlike regular wireframes as they help to visually represent user interfaces in a colorful and appealing way. Which is why they are used in places that attracts viewers such as webpages, presentations etc…

Quickly design and export your UI representations with "Illustrative mockups" UI pack for making attractive layouts of your apps.

Link to UI Pack - Illustrative Mockups

Support for videos in MockFlow StyleGuide

Screenshot 2020-02-21 11.42.23.png

MockFlow StyleGuide helps users to create design references or brand sheets with text, images, colors and fonts. Now with support for videos in this latest release, designers can showcase UI walkthroughs, demo videos and content reels in their design documents. It allows batch video uploads in mp4 format ,custom thumbnails and streaming.

In the near future release, direct embed support for video service providers like YouTube and more video file formats will be added.

New component: LayoutBuilder - wizard for creating UI layouts

Screenshot 2020-02-11 12.21.18.png

Layouts are key for designing better UI as they form the skeleton structure for placing interface elements and content. To help this, We are excited to release a special new component to WireframePro called "LayoutBuilder" which does exactly as it sounds.

LayoutBuilder helps designers visually create boilerplate templates for building their UI structure in a quick and effective way. Easily create layouts for multicolumn websites, mobile interfaces or any UI for that matter. Also download your created layout as a reusable HTML/CSS code.

LayoutBuilder is now available in the latest version of WireframePro's web and desktop apps.

Introducing 'Archive mode' for UI projects

D7c79a86df5b700f25207853a2c0228f0.png

De-clutter your project dashboard with the new Archive mode. Move your old projects, completed ideas and UI that should not be updated into archive. When a project is moved into archive, it cannot be edited and will open only in read-only mode for all the collaborators of the project.

Archive mode not only helps you to cleanup your dashboard but also prevent unwanted changes to be done to your finished projects. Also projects under archive mode can be restored to its original state anytime when necessary.

New Power-up: UI walkthrough diagrams

rr.png

We are excited to release a new Power-up for creating "user flow diagrams" in WireframePro's MockStore. UI walkthrough lets you connect interface screens and make stunning user flows of your wireframe project. Visualize a user's journey or the product's function with this Power-up.

Feature highlights:

  • Attach wireframes or custom thumbnails
  • Export to image
  • Custom arrow settings

View Power-up

UI Pack for device frames available now in MockStore

D2f744865dbc1338f0dcf85f37f8eeb33.png

A new UI pack called "Device Frames" has been released in MockStore. This is a comprehensive pack which helps designers to mockup UI for a specific device. It provides outlines of popular devices so users can design and preview their interface in perspective of its device.

It includes mobile devices, remotes, gaming consoles, smartwatches, smart tv, car touchdisplay, computers etc…

MockStore - Device frames