Quickly convert webpages into wireframes with the MockFlow WireframePro Chrome extension. This can be very useful when you find an inspiration for a website section, web app section or to redesign your own website.
Follow the steps below to install and use the extension.
1Open the Chrome Web Store and search for MockFlow WireframePro.
2Click on the 'Add to Chrome' button to install the MockFlow Chrome extension in your browser.
3Confirm the installation by clicking Add Extension.
4Once installed, the MockFlow WireframePro Chrome extension will be added to your browser. You can pin it for easy access.
5Click on the MockFlow WireframePro extension and log in with your MockFlow account.
6The MockFlow Chrome Extension provides two ways to capture a website for reference:
- Page Section to Wireframe: Converts a specific section of a webpage into a Wireframe.
- Full Page to Wireframe: Converts the entire webpage into a Wireframe.
7Choose anyone of the options.
8 In the next step, you can customize it using the following options:
- Import All Images: Includes all images captured from the webpage in the wireframe.
- Draw in Sketchy Style: Creates the wireframe in a hand-drawn sketch style.
9Next, select the design space and the project where you want to add the captured Wireframe.
10To import the Wireframe, click 'Import.' The Wireframe will be added to your selected project.
11As seen in the image below, the webpage has been converted to an editable wireframe in sketchy style. You can now make edits to the wireframe as required.
The open link icon at the top right is to open the wireframe editor in a new tab and continue editing your wireframe seamlessly.
