MockFlow Clippy: clip any web page into your board

The MockFlow Chrome extension has been rebuilt and renamed MockFlow Clippy. Clippy saves any web page, all of it or just the part you need, straight into a MockFlow board. Before you clip, you choose what the page should become: a screenshot, a screen recording, a doc, a bookmark, a color palette, an editable wireframe or a board built by AI.

It works on websites and web apps alike, including internal tools behind a login, so research and references from the web land on the same visual canvas where your team already works.

What Clippy can turn a web page into

Take the whole page, or draw a rectangle around the part that matters, then pick the output:

• Image: a full-page screenshot stitched top to bottom, or just the region you draw, at full size on the board.

• Video: a recording of the tab, with its audio and your microphone if you want. Watch it back and decide whether to keep it before anything is saved. On the board it plays as a video player beside the screens it is about.

• Doc: the page's text as an editable, searchable document you can quote, cut and comment on.

• Bookmark: a link card with the page title, so a board of references reads as references.

• Colors: the palette the page really uses, taken from its styles.

• Wireframe: the page rebuilt as an editable wireframe. Keep its images or strip them, then redesign what exists.

• WireframePro: sketchy, hand-drawn wireframes in WireframePro, for work that should look unfinished on purpose.

• AI board: the page as a mind map, flowchart, kanban, timeline, table or summary, from a preset or your own prompt.

Use cases for the Clippy web clipper

• Competitor research: clip the pricing pages of the products you are compared with. They land side by side at full size, ready to mark up with sticky notes.

• Redesign a live page: clip your own signup page as a Wireframe and start moving things. Cut the nav, simplify the form, rethink the hero. Nobody redraws anything.

• Read a long document together: point Clippy at an analyst report, RFC or strategy doc and choose AI board with a mind map. The meeting starts at the interesting part.

• Arrive at kickoff with the work sorted: clip a requirements page as a kanban board, so the cards exist before the call does.

• Build a moodboard from real brands: capture the colors a site actually uses and the exact sections your client keeps pointing at.

• Compare options and decide: clip the same component, such as a date picker, from several products and vote on it on one canvas.

• Report a bug or explain a flow: record the tab while you reproduce the problem and keep the recording on the board next to the screens it affects.

• Collect scattered feedback: clip the support thread, the reviews and the survey write-up, and set them side by side on one wall.

How to install Clippy and clip a page

1. Add MockFlow Clippy to Chrome from the Chrome Web Store.

2. Sign in with Google, Microsoft or Apple, or create a free MockFlow account.

3. Open the page you want to keep and click the Clippy icon in the Chrome toolbar. The Clippy panel opens on the page.

4. Under Clip as, choose what the page should become, such as Image, Video, Colors, Wireframe or AI board.

5. Under Save to, pick the project the clip should go to, or a new one.

6. Choose Whole page, or Region and draw a rectangle around the part you need.

7. Click the clip button, then Import now. Your board opens with the clip on it.

You can also clip without opening the panel: right-click the page and choose MockFlow Clippy, or press Alt + Shift + C. While a video is recording, Alt + Shift + R stops it.

Clippy on each plan

Clippy is free and works with a free MockFlow account. Images, docs, bookmarks, colors and wireframes are free on every plan. The AI board output uses your plan's AI credits. Screen recordings can be up to 10 seconds per clip on Basic and up to 3 minutes per clip on paid plans. See pricing and the Clippy page for details.