Keep track of announcements and product updates in MockFlow
IdeaBoard now introduces interactive navigation between components, letting you craft dynamic, non-linear presentations with smooth zoom and scroll transitions. Engage your audience or team by turning any whiteboard into a clickable, guided experience perfect for storytelling, brainstorming walkthroughs, or product demos.
To get started, right-click on any supported component such as a button, sticky note, section, text box, or frame. You’ll see two new options in the context menu:
By combining multiple internal links, you can establish a non-linear navigation path across different parts of your whiteboard, helping viewers explore ideas fluidly rather than following a rigid slide sequence.

Once interactions are set up, click on any interactive component or use the right-arrow shortcut key to follow its link. IdeaBoard will automatically zoom and scroll to the target area, fitting it perfectly to your screen.
To return, press the left-arrow key—IdeaBoard remembers your navigation history, allowing seamless back-and-forth movement between connected components. This makes exploring complex boards effortless and immersive.
Non-Linear Presentations:
Present ideas dynamically by jumping between sections based on audience input instead of following a fixed slide order. Perfect for brainstorming sessions, workshops, and agile reviews.
Interactive Storytelling and Product Demos:
Create narrative-style walkthroughs of user journeys or design concepts. Link wireframes, mockups, or idea clusters to demonstrate flow and context.
Flowcharts and Architecture Diagrams:
Showcase complex systems or workflows with interactive navigation. Link nodes, subsystems, or related diagrams to zoom into deeper layers of your architecture or process visualization.
Interactive Knowledge Maps and Documentation:
Build connected knowledge bases or process documents where each note or component links to supporting visuals or references, helping teams explore topics intuitively.
Training and Educational Boards:
Teachers and trainers can design guided learning paths—linking lessons, exercises, and examples into a structured yet explorative format that keeps learners engaged.
Sample demo: https://app.mockflow.com/iview/crmpresent#/mode/view
With Interactions, IdeaBoard evolves from a whiteboard into an interactive presentation and storytelling platform. Whether you’re explaining workflows, teaching concepts, or mapping ideas, you can now guide your audience through your whiteboard with clarity, motion, and intent.
This update, makes editing chart data in WireframePro more intuitive, visual, and efficient helping you focus on design rather than data formatting. As Charts play a key role when wireframing dashboards, analytics, and insight-driven interfaces, this is very important.
WireframePro offers a rich collection of built-in chart components including area, bar, line, radar, scalar, and bubble charts along with sketch style variants for hand-drawn wireframes.
Previously, editing chart data worked like modifying a CSV in a textbox. While convenient for quick copy-paste, it often felt tedious and error-prone, requiring extra effort to validate values manually. This experience didn’t align with our mission to keep UI ideation fast, simple, and friction-free.
With the new data editor, chart editing now feels as smooth as working in a spreadsheet dramatically improving accuracy, speed, and usability.
The upgraded chart editor includes essential spreadsheet-like controls, tailored specifically for chart data. It intelligently adapts to different chart types and lets you:
Whether you're wireframing business dashboards, analytics screens, or data-rich reports, the new chart editor helps you shape your ideas faster and more accurately.
Try it today and give your wireframes cleaner, more realistic charts without sacrificing speed or creativity.
Now brainstorm with locations using the new maps component in IdeaBoard. Add location markers to ideate on geo based visualization. Available in flat or as 3D globe along with AI generation of markers.
Maps play a vital role in brainstorming when your ideas or strategies are tied to geography. The new Maps component in IdeaBoard makes visualizing spatial ideas easy, accurate, and fully integrated into your whiteboard workflow. Unlike traditional mapping tools, this component is built specifically for whiteboarding allowing you to drag and drop multiple maps, resize, reposition, and customize them effortlessly. Explore different perspectives, themes, and locations to bring clarity and context to your geographic brainstorming sessions.
Just like other smart components in IdeaBoard, the Maps component comes with built-in AI assistance to make map creation faster and smarter. Simply click the AI button in the settings and enter a prompt to generate a map for anything from F1 race circuits to top hospitals in Spain. The AI doesn’t just place locations it also adds contextual marker icons that visually represent your topic, such as race cars or hospital symbols. You can even generate complete map components using Mida, the MockFlow Intelligent Design Assistant, for instant, AI-powered geo visualization that fits perfectly into your whiteboard brainstorming.

Experience maps the way you prefer either as a flat 2D view (Mercator projection) or a fully interactive 3D globe visualization. You can zoom, pan, rotate, and spin the globe effortlessly for dynamic exploration. Each perspective supports multiple visual themes currently including normal, dark, white, and gray allowing you to match your map’s appearance with your whiteboard’s overall design

The Maps component in IdeaBoard is available with unlimited and free access for all users, including those on the Free Basic plan. Since MockFlow hosts its own dedicated maps server, you can explore, create, and collaborate without any usage limits or third-party restrictions. While AI-powered map generation depends on your available AI credits, the Maps component itself remains fully functional without AI, ensuring everyone can brainstorm visually with no barriers.
Comments in MockFlow IdeaBoard just got a major upgrade. With the new Comments 2.0, board members can now share feedback and ideas more naturally through video or voice comments. Whether it’s explaining a concept visually or adding quick audio feedback, discussions on your boards are now more contextual, expressive, and human than ever before.

In IdeaBoard, comments are now treated as core components rather than simple add-ons. You can drag, position, or even attach them to specific sections just like any other element on your board. This makes feedback more collaborative, organized, and easy to follow within defined discussion threads.
While text comments work well for quick notes, they often fall short when it comes to expressing tone, emotion, or detailed thoughts. The latest update changes that board members can now record short video messages using their camera or share voice notes as audio comments, making communication more natural, personal, and expressive than ever before.

Adding a video or voice comment in IdeaBoard is as simple as adding a text comment. Just drag and drop a video or audio comment component onto your board. If camera or microphone access isn’t already granted, you’ll be prompted to enable it. Then, hit the Record button to capture your comment whether it’s a quick video message or a voice note.
Once the recording is done, you can preview your capture before uploading. If you’re not satisfied, simply re-record, it’s that easy. The entire process works seamlessly within your browser, with no need for plugins or extensions. Designed with a minimal and intuitive interface, it requires zero learning curve.
To keep things focused, audio and video comments are limited to 2 minutes, which helps maintain viewer attention and ensures faster playback while still giving you enough time to convey your ideas clearly.
Playing back comments is effortless. Simply click on a video or audio comment to start playback instantly and click anywhere outside to stop. There are no unnecessary controls or clutter, just a smooth and natural experience that keeps the focus on the conversation. This intuitive interaction not only feels fluid but also adds a delightful, human touch that makes feedback far more engaging than plain text comments.
At MockFlow, privacy comes first that also includes your voice or video. All audio and video comments are securely stored using private URLs, ensuring they are never publicly accessible. Only the board members you’ve shared the project with have permission to view or play these recordings.
To further protect your privacy, audio and video comments remain hidden in public links or shared previews of the board. This way, your conversations stay confidential, secure, and accessible only to your team.
Audio and video comments open up a range of new possibilities inside IdeaBoard. Beyond making annotated comments on specific elements, they can be used for board announcements, video walkthroughs, async team updates, and more. When combined with other IdeaBoard components, these rich, multimedia comments unlock creative new ways to collaborate, communicate, and share context visually.
Important: Audio and Video comments are not available in basic plan. It requires IdeaBoard or Bundle plan. However basic users can get a glimpse on how it works in their account.
New Mini-Mode in WireframePro streamlines your workspace by reducing clutter, keeping key tools within reach, and giving you more canvas space for rapid, intuitive wireframing.
If you've been following our recent WireframePro updates, you’ll know we’ve introduced a host of invaluable features to MockFlow such as Build Mode for converting concepts into code, powerful AI tools, and expanded wireframing libraries. While these advancements are essential, wireframing should also feel like a natural extension of the designer’s thought process. To achieve this, creating UI concepts needs to resemble sketching on a real whiteboard clean, spacious, and free from unnecessary distractions. At the same time, designers must have quick access to the essential tools required to bring their ideas to life. The new Mini-Mode balances both, giving you more whitespace to think and the right functions at your fingertips

This is how Mini-Mode was born. It’s not just a simplified version of the editor UI, but a carefully designed experience shaped by analyzing millions of heatmaps and wireframing usage patterns. The data revealed a clear trend: the more interface elements an editor displays, the less ergonomic the workflow becomes a challenge familiar to users of UI-heavy tools like Office or Photoshop. On the other hand, going too minimal can overwhelm users as they struggle to locate essential functions. Mini-Mode strikes the right balance, delivering a streamlined interface that enhances ergonomics while keeping the core functionality within easy reach.
Mini-Mode delivers the right balance of UI by hiding non-essential elements while still keeping nearly 95% of WireframePro’s functionality instantly available without switching back to regular mode. It works by collapsing the sidebar into a smart overlay with related functions, while introducing a new always-on mini bottom bar featuring the most-used components. The result is a cleaner workspace that frees up significant whitespace, making both designing and viewing wireframes more seamless.

Mini-Mode also introduces handy shortcuts for AI features, drawing components, and even switching between Mini and Regular modes. The new slim bottom bar is the icing on the cake styled like a subtle notch, it stays out of the way while giving instant access to your most-used components in both wireframe and sketchy styles. And of course, Mida remains in the bottom-right corner as your always-on design assistant, now enhanced to deliver not only text responses but also image-based answers, 24/7
Our analysis shows that Mini-Mode is a clear success as it delivers the majority of WireframePro’s features within a minimal, distraction-free interface, enhanced by faster shortcuts. The result: users can focus less on navigating the UI and more on bringing their concepts to life. This is the future of WireframePro. We’re also proud to share that some of these ideas were inspired by our sister product, IdeaBoard, reinforcing our commitment to building tools that make visual design more natural and intuitive

AI is now at the forefront of modern software, and with Mini-Mode, it takes center stage in WireframePro. A new mini AI input box is built right into the bottom bar, giving you instant access to powerful commands. Simply type requests like generate wireframes, tables, diagrams, cloud architecture flowcharts, or even images and AI will bring your ideas to life within seconds. It’s speed, simplicity, and creativity combined.”

Clean, intuitive, and rapid that's what MockFlow stands for when it comes to designing UI concepts. With the new Mini-Mode, you can wireframe at the speed of your thoughts. Use Ctrl/Cmd / shortcut to toggle mini mode anytime.
MockFlow IdeaBoard is now available on the Mac App Store as a secure, file-based offline whiteboard application. Designed for privacy, it requires no internet or servers to run. With a simple one-time purchase, you get unlimited brainstorming.
While IdeaBoard is best known as a collaborative online platform for real-time brainstorming, we've also built an offline edition that runs locally on your Mac. This file-based version was designed with two key goals in mind:
Not every user needs a team-based, subscription whiteboard. Solopreneurs, freelancers, and individuals working in non-team environments may find paying for online collaboration features unnecessary, especially if their use case is simple or doesn't require AI. For them, the offline edition of IdeaBoard offers an affordable alternative. Available on the Mac App Store at a one-time launch price of $39.90, it provides most brainstorming features without recurring fees.

Brainstorming often captures the foundation of a company's next product, process, or breakthrough idea. For many enterprises, where data privacy and compliance are critical, storing this sensitive information on third-party servers may not be acceptable. With IdeaBoard for Mac, all whiteboarding data is saved locally as files, giving organizations complete ownership and control. These files can be seamlessly integrated into existing backup routines and security policies. For team collaboration, companies can securely share .board files using network storage or enterprise-ready file-sharing services like Dropbox or Box—just as they would with other important business documents.

The IdeaBoard app on the Mac App Store offers a simplified, offline-first experience compared to the full online version. While it is actively maintained and updated, certain features are currently not available in this edition:
With the advantages and limitations of the Mac App Store edition clearly outlined, you can choose the version of IdeaBoard that best fits your workflow whether you prefer the privacy and simplicity of a file-based offline app, or the full power of real-time collaboration in the online version.
With the new shortcuts everything is in your finger tips, press '/' anytime to bring AI assist in WireframePro or IdeaBoard. Use Cmd + 2,3,4,5 to switch main tabs.
Smarter design with AI is now just a slash away. In the editor, simply press ‘/’ to open AI tools instantly. Enter your prompt and generate wireframes, dashboards, mind maps, flowcharts, diagrams, images, or text whenever and wherever you need them.
Open Mida assistant inside editor for support, doubts, reporting issues, or even performing actions in both WireframePro and IdeaBoard.
Navigate your editor at lightning speed with new keyboard shortcuts. Use Cmd (Mac) or Ctrl (Windows) with numeric keys to instantly cycle through the main operations.
This update saves clicks, reduces distractions, and keeps you focused on creating.
Alongside the new keyboard shortcuts, this release also introduces improved right-click menus when you select a blank canvas. These context-aware menus surface the most relevant options instantly, helping you add, organize, and design without breaking your flow.


The above changes are now available in both web and desktop apps.
MockFlow AI just got smarter: wireframes generated with AI can now include real charts, analytics, and data visualizations. This makes it easier than ever to design dashboard wireframes and UIs that showcase graphs, reports, and insights.
Prompt-to-Wireframe creation in MockFlow continues to evolve with new features, fixes, and smarter generation. Today’s update is a major step forward, especially for wireframing business apps.
MockFlow has long supported native chart components to help teams brainstorm UIs with graphs. Now, this capability is extended to AI. With just a text prompt, you can instantly generate wireframes for dashboards, analytics, metrics, mobile charts, and more, making it easier to visualize complex data-driven interfaces.
For added flexibility, MockFlow AI also supports sketchy chart generation. By simply adding the keyword ‘sketchy’ to your prompt, you can create hand-drawn style wireframes that are perfect for early-stage brainstorming.




In this release, MockFlow AI now supports all built-in chart components—including Bar Chart, Line Chart, Area Chart, Pie Chart, Bubble, Scatter, and Radar. This means your AI-generated wireframes can instantly visualize a wide variety of data layouts. Coming soon, we’re also adding AI support for more native visualizations like Gauge and Treemap to make your dashboard wireframes even more powerful
Since AI is included in all plans, you can start exploring this feature right away. Simply generate wireframes with prompts like ‘Finance dashboard’, ‘CRM analytics’, or ‘Football club metrics’. You can also experiment by adding themes, modes, or specific visualizations you’d like to see in your design. Just bring your idea as a prompt and WireframePro will instantly turn it into a wireframe now even if it involves charts.
In IdeaBoard, your whiteboard need not be just white anymore, set vibrant wallpapers or background colors to the set tone, brand of your project whether you are designing a mindmap or in a brainstorming session, creating a diagram, IdeaBoard will now feel like your shared collaborative desktop between your team members that can be accessed anywhere.
MockFlow IdeaBoard is designed with a clean, distraction-free interface that features only a simple top bar. This minimal layout makes it the perfect canvas for wallpapers, as the unobtrusive content area allows your chosen background to shine through. By adding a wallpaper or background color to your whiteboard, you not only give it a desktop-like vibe but also create an immersive atmosphere tailored to your project’s purpose
This feature is especially useful across a wide range of use cases. Set a professional background for mind maps and strategy diagrams to keep the team focused, choose creative wallpapers for brainstorming sessions and mood boards to spark fresh ideas, or apply branded colors when designing flowcharts and project plans to maintain consistency. No matter the format, IdeaBoard backgrounds help you build an engaging, collaborative environment where ideas can grow.
AWS chart on top of a server rack wallpaper

Brainstorming session with a Mandala chart with background of a meeting room
To change background of your IdeaBoard project, either right click on the canvas or click the project title in the top toolbar to popup the project options modal. From here you can choose between plain colors, preset wallpapers or even upload or generate your own background wallpaper.

This feature is available in all plans including free basic, so try to convert your 'Whiteboard' into your own branded or contextual board.
With the new MockFlow WireframePro extension for Visual Studio Code, you can instantly generate UI code through visual prompting. Simply draw your wireframes or leverage AI to bring your ideas to life, then convert them into production ready code in a click.
MockFlow for Visual Studio Code lets you brainstorm and design UI ideas directly inside your favorite IDE. Use the built-in prompt box to have AI instantly generate your interface layout, or quickly sketch it yourself using the fastest visual UI design tool available.

This extension integrates seamlessly with your Visual Studio Code IDE through a built-in MockFlow project sidebar, allowing you to create new wireframes or open existing ones. It also features a streamlined version of the WireframePro editor, ensuring a lighter, less cluttered editing experience inside Visual Studio Code.
With the integrated Build Mode in the MockFlow WireframePro extension, take your designs further by converting wireframes into clean, ready-to-use code and inserting it directly into your Visual Studio Code project files.
Build Mode lets you export any part of your wireframe whether it’s a single component, a section, or an entire page, into code. It supports all major frameworks in multiple versions, ensuring seamless integration with your project’s requirements.
Wireframing is like sketching your ideas on a whiteboard, only better. It helps you brainstorm layouts, refine them quickly, and make changes before development begins. With rapid wireframing and code export, you can accelerate your workflow and save valuable development time.
Unlike other app builders, WireframePro extension only focuses on the UI that means it easily integrates with any new or existing Visual Studio projects and can be used as required.
The extension is available for Free in Visual Studio marketplace. Download and try now.
Now ideate apps for Android 16 at lightning speed with this new wireframing UI-kit. With over 120 components and templates, brainstorming apps for Android 16 look and feel is now a breeze.

With the recent release of Android 16 and its shift to the new 'Material 3 Expressive' design standard, the Android user interface has undergone a significant visual and structural overhaul. To help you keep pace, our latest UI kit for WireframePro is tailored for wireframing apps that follow this new design language. It includes a wide range of components across multiple categories, making it easier to plan and prototype Android 16 apps with precision
Before diving into advanced prototyping or development, it's essential to visualize your Android app ideas using the native design theme. With this Android 16 wireframe UI kit and MockFlow’s intuitive editor, you can quickly sketch app screens with no learning curve required. Effortlessly iterate your designs, explore different layouts, and communicate UI concepts more effectively, all while accelerating your development process.
With the new IdeaBoard Power-Up for Trello, your team can now collaborate, brainstorm, create diagrams, and visualize ideas, without ever leaving your Trello board.
IdeaBoard is your visual canvas for seamless ideation. When brainstorming happens alongside task management, creativity flows effortlessly. With the new IdeaBoard Power-Up, Atlassian Trello users can easily sketch ideas, attach visual boards, and collaborate in real time all within Trello.
Trello is a powerful productivity tool - fast, agile, and simple enough for teams of all kinds. But Trello tasks often remain text-heavy. While you can attach images to add context, it can be time-consuming, distracting, and limited in flexibility.
That changes now.
With the IdeaBoard Power-Up, you get a full-featured whiteboard experience right inside Trello. Make your tasks visual, easy to understand, and impossible to overlook.

“Set up AWS SES for our email architecture”
→ Draw and attach a detailed AWS cloud diagram that clearly illustrates the workflow.
“Social media marketing strategy for product launch”
→ Create (or generate with AI) a visual mind map and connect your ideas in a structured way.
“Blog article for our new feature”
→ Collaborate on multiple documents in a single IdeaBoard—draft, review, and finalize content side by side in real time.
“Status board for the all-hands meeting”
→ Build a sticky note board that feels just like your physical whiteboard, but better—organized, collaborative, and always accessible.
Whatever you want to visualize or brainstorm, the IdeaBoard Power-Up brings it to life—right inside Trello.

MockFlow IdeaBoard is completely free and included in all MockFlow plans. Add the Power-Up to Trello and start visualizing your tasks today. Install now.
The latest UI kits are now available for MockFlow WireframePro users, featuring approximately 143 components for macOS 26, over 160 components for iPadOS 26, and a complete UI kit for the new watchOS 26.
Following our recent release of the iOS 26 UI kit designed for brainstorming iPhone apps with the new Liquid Glass theme, we’re excited to officially launch UI kits for the latest major versions of macOS, iPadOS, and watchOS.
Each UI kit also includes ready-made templates that showcase how the components come together in real app scenarios. What sets MockFlow apart from other UI design tools is its zero-learning curve and speed, it’s like sketching on a whiteboard, but with real, functional components. This makes it incredibly easy to iterate quickly and communicate UI ideas visually, while staying true to the original design theme—in this case, Liquid Glass.


All UI packs are available for free in all MockFlow plans including basic.
Create multiple docs side-by-side, connect docs with flows, combine docs with stickies, images, todos. Move away from the traditional method of writing documents and start creating them visually with IdeaBoard.
We are excited to introduce a new document component with advanced editing features inside IdeaBoard. By combining an infinite canvas with a familiar document editor, you get a fresh approach to writing and organizing content.
Traditional document tools like Google Docs were designed with printing in mind. While they are great for that purpose, they often fall short when used for web-based writing due to their limitations.
With the new document component in IdeaBoard, you can write, arrange, and visualize your content however you like. Your mind processes information more efficiently when everything is visible on one screen, reducing mental strain and helping you think more clearly.


The document component supports IdeaBoard’s focus mode, designed to eliminate distractions while editing or reviewing. When enabled, only the document stays visible in the viewport, while all other elements are hidden. This provides a clean, isolated space for focused writing especially helpful when the canvas becomes cluttered or when zooming and panning interrupt the flow. You can also share just the document on its own using focus mode.

Example: https://app.mockflow.com/iview/MI0MLCFBssb#/mode/view/focus/D8be813c57937a67fcdee822eeba21d66
The Docs component in IdeaBoard offers a fresh, visual approach to creating and collaborating on documents. With powerful editing tools, seamless real-time collaboration, and AI-assisted writing, it redefines how documents are written and shared. Best of all, it's available for free across all MockFlow plans.
IdeaBoard: Generate custom whiteboard templates, flowcharts, cloud architecture diagrams with the new AI toolbox inside IdeaBoard editor. It also includes editable prompt library for ideas.
When we first launched IdeaBoard, our goal was to reimagine what online whiteboarding could be. Designed for the AI era, IdeaBoard combines a lightweight interface with powerful components, now enhanced by the new AI Toolbox. Together, they deliver a smarter, faster, and more intuitive whiteboarding experience for modern teams.
IdeaBoard is a whiteboard tool built to turn imagination into action. With its infinite canvas and ever-expanding library of components, it empowers you to think visually and collaboratively. Now, with the addition of the AI Toolbox, transforming your ideas into structured whiteboard layouts is easier than ever. Simply enter a prompt, and the AI will generate ready-to-use templates for brainstorming, strategy sessions, planning, diagrams, flowcharts, meetings, and more instantly.
While our template store offers a wide range of pre-made options, the AI Toolbox goes a step further, it creates templates that don’t yet exist. Whether you need something highly specific to your business, project, or workflow, AI makes it easy. Just describe what you need, and it builds a tailored template in seconds.
Need a cloud architecture diagram for your upcoming SaaS app using AWS infrastructure? A custom Agile workflow for your product team? A MoodBoard for your new design system? A Kanban board for managing design approvals? The AI Toolbox can generate all of these and more without starting from scratch.
The AI Toolbox includes a built-in Prompt Library filled with pre-written, editable prompts tailored for different use cases. Whether you're creating a brainstorming layout, a workflow diagram, or a strategic planning board, you can simply click to import a relevant prompt, customize it to your needs, and generate your whiteboard template instantly. It’s a fast, flexible way to kickstart your visual thinking without starting from a blank canvas.

Every paid MockFlow plan includes monthly AI credits that automatically refresh. But if you need more, the AI Toolbox lets you purchase additional credits anytime. These extra credits never expire as long as your base subscription remains active, so you can use them whenever inspiration strikes, without worrying about time limits.
This is just the beginning for both IdeaBoard and its AI Toolbox. As IdeaBoard continues to grow with new components and smarter tools, the AI capabilities will evolve too. Expect even more intelligent features, deeper customization options, and advanced templates that adapt to your unique workflows, all powered by the expanding AI Toolbox.
Brainstorm UI your future iPhone apps with the upcoming iOS 26 liquid glass concept. The UI kit comes with over 190 components in 15 categories along with wireframe templates.
Apple recently unveiled the beta of iOS 26 at WWDC, introducing a groundbreaking UI design language called Liquid Glass. Much like the early skeuomorphic design era and the later shift to flat UI, Liquid Glass marks a significant evolution in user interface design for iPhone apps.
This new aesthetic emphasizes translucency, fluid motion, and a glass-like visual texture that subtly blends UI elements into the background by allowing content to take center stage. It introduces a minimalistic approach to UI components, encouraging clarity, focus, and modern visual hierarchy.
Introducing the Complete Liquid Glass Wireframing Solution: 190+ Premium Components for iOS 26 Development

We're proud to announce the launch of our comprehensive wireframing component library, specifically designed for liquid glass application development. This powerful toolkit seamlessly integrates MockFlow's industry-leading wireframing platform with an extensive collection of 190+ pre-built liquid glass UI components, enabling designers and developers to accelerate their design workflow significantly.
Key Features & Benefits:
Our advanced wireframing solution empowers teams to rapidly prototype and visualize UI concepts, streamlining the design-to-development process. The intuitive interface facilitates quick iterations, allowing you to refine and finalize your design concepts before entering the development phase, ultimately reducing project timelines and costs.
Enhanced Development Workflow:
The integrated WireframePro build mode introduces seamless iOS SDK export functionality, providing developers with production-ready code that further accelerates development cycles. This feature bridges the gap between design and implementation, ensuring consistency and reducing manual coding requirements.
Availability & Access:
The complete Wireframe UI Kit for iOS 26 is now available at no cost to all users, making professional-grade wireframing tools accessible to teams of all sizes. Start designing your next liquid glass application today with our comprehensive component library.
Ready to transform your wireframing process? Access your free toolkit and begin creating exceptional user experiences.
MockStore now offers 300+ wireframe components for Tailwind v4 website designs and over 200 components tailored for Tailwind v4 web app wireframing.
There’s no doubt that Tailwind has become the most popular frontend CSS framework for building modern websites and web apps. If you’re developing with Tailwind, fast design iteration is essential. The new Tailwind v4 UI kit offers dedicated UI kits for both websites and web apps, giving you a huge range of components across multiple categories. This allows you to jumpstart your UI ideas and focus on functionality, without getting bogged down by styling from scratch.
If you’re a non-technical user or a manager, MockFlow now makes it effortless to visualize your layout ideas in Tailwind with no coding or prior experience required. You can easily create and experiment with UI designs, making the process as simple and accessible as possible.
Pair this with our Build Mode in WireframePro, and you can instantly convert your wireframe designs into ready-to-use Tailwind frontend code with just a single click.


As with all UI kits in MockFlow, this release reflects our commitment to supporting the community. The Tailwind v4 Wireframe UI Kits are available to all users including those on the free basic plan, so you can start designing right away without any barriers.
Now easily export wireframes as code with build mode in the exact framework version you need—like Tailwind 4 , 3 or iOS SDK 17,16 , for seamless integration into your projects.
Different versions of frameworks like Tailwind or iOS SDK or Android or Bootstrap can have changes in syntax, available components, and supported features. When you're working on an existing project, it's important that the generated code matches the exact version you're using otherwise, it can lead to broken styles, missing components, or compatibility issues.
By allowing you to choose the framework version in BuildMode during code export, WireframePro ensures that the generated code fits perfectly into your current setup. This eliminates the need for manual adjustments and helps you move faster from wireframe to production code with full confidence.
This release expands WireframePro’s capabilities with support for multiple versions of existing frameworks as well as entirely new ones. No matter which language or framework your project uses, you can now export wireframes into production-ready frontend code that fits right in. Just visualize your UI—WireframePro handles the rest.
Current Code Export Support in MockFlow
You can now convert your wireframe designs into frontend code across a wide range of frameworks and platform SDKs. Supported options include:
Platform SDKs:
MockFlow continues to expand support to ensure your wireframes can be seamlessly translated into code that matches your tech stack.
The MockFlow Desktop app for Mac (Apple Silicon and Intel) and Windows (x64) offers several advantages, including native OS integration, a distraction-free experience, faster loading times, and now, file mode. We’re excited to introduce file mode for IdeaBoard, expanding beyond our existing wireframe app.
Similar to Microsoft Office files like .ppt or .doc, you can now save and open IdeaBoard projects as files with the .board extension. All your whiteboard data—including drawings, images, and assets—is packaged into a single file. This offers several benefits: you don’t need the cloud or a server to open or edit your project, and sharing is as simple as sending any other file. You can easily use your preferred file sharing or storage service, such as Dropbox or Google Drive. Businesses can also keep their own copies for backup and compliance, without relying on MockFlow to store their data.
File mode is designed especially for businesses, allowing you to use IdeaBoard without concerns about servers, backups, uptime, or hosting. However, since these projects are saved as files, they can be easily shared and might unintentionally fall into the wrong hands. To address this, file mode offers optional encryption for IdeaBoard files. You can secure your whiteboard files with a passkey of your choice, and MockFlow protects your .board files using industry-standard 256-bit encryption. The encryption key is stored within the file itself, so your project cannot be opened, viewed, or edited without the correct passkey. You can change the key as often as needed, and no cloud support is required for encryption or decryption..

Git is a distributed version control system known for managing code and files in collaborative workflows. With IdeaBoard’s file mode, you can include whiteboard files directly within your existing git projects. This means architecture diagrams, logic flows, brainstorming sketches, and workflows can all be stored and versioned alongside your project data—right within your git or GitHub repositories.
IdeaBoard’s .board files come with optional built-in revision control. Since whiteboard content often evolves, tracking changes and revisiting previous versions is essential. The integrated revision system lets you view, compare, and restore past versions of your whiteboard projects - all without needing any cloud support.

While file mode offers many unique advantages, it does not include some features available in the online version of IdeaBoard, such as:
These features remain exclusive to the online IdeaBoard experience.
File mode is exclusive to IdeaBoard’s business yearly plans and is designed specifically for enterprise needs. It’s not available on all plans. For more details and pricing, please visit our pricing page.
The minimap streamlines the process of working with large wireframes containing multiple screens. Instead of frequently zooming, panning, and scrolling, the minimap offers a bird’s-eye view of the entire page and allows for quick navigation to specific sections.


Android UI kit is available free for all MockFlow plans.
Design Spaces in MockFlow serve as a brainstorming hub where businesses can ideate, create, collaborate, and evaluate their next big software ideas, design updates, client projects, and more. It’s more than just a folder for grouping projects; it's a dynamic space where projects, team members, and ideas come together. Today, alongside space analytics, we’re excited to introduce "Space Activities.".
With Space Activities, members can easily track key actions within the space and see when they occurred. They can also quickly search for specific activities— for instance, searching "delete" will display all deletion actions, whether it’s an image, project, or page removal. Only essential activities relevant to the space are recorded, ensuring members have access to vital updates.
Note: This feature along with Space Analytics is only available for Business and Enterprise plan users.
Stop spending time wireframing your existing UI—try our Chrome extension that instantly converts any website, web app, or internal app into editable wireframe designs.
We’re thrilled to announce a new addition to our AI-powered features: a Google Chrome browser extension that transforms any user interface viewed in the browser into a wireframe design. This powerful tool makes it easier than ever to update, ideate, and refine UI designs effortlessly.
Consider a scenario where your business has developed and currently uses a web-based internal supply chain management software for handling logistics. Over time, as requirements evolve, new modules and updates are needed. Directly assigning these updates to developers without a clear design process often leads to wasted time and effort, as coding is a detailed process that can’t be easily reversed. Much of this effort can be saved by providing developers with a clear UI mockup or wireframe as a specification. However, creating a wireframe from scratch can be time-consuming, especially for existing software, since the project manager or designer would first need to recreate the original design.
With this new extension, you can instantly convert your existing UI into a fully editable wireframe with a single click, allowing you to explore new styles and design ideas with ease.
Scenarios explained:

The new Chrome extension offers two powerful options: you can either convert the entire page or screen into an editable wireframe, or interactively select specific sections—such as a sidebar, header, or feature—or individual components like a tab bar, list, or grid. These selected elements can then be used in your wireframe just like any other component, giving you full flexibility and control over your design.

Note: This Chrome extension is currently in beta, so there may be some differences from the original design.
It is freely available for all plans including Basic. Install now from chrome store.
Just finished a UI meeting on the whiteboard? Snap a photo and upload it to MockFlow. Instantly convert your sketches into editable wireframes!.
Despite the abundance of digital tools for brainstorming, the whiteboard remains the go-to choice for physical team meetings. Whether it’s for its larger display, ease of use, or offline convenience, it has its advantages
However, the main drawbacks are that whiteboard content can be easily erased and, when stored as a photo, is no longer editable. With today’s update, you can now bring your whiteboard sketches into MockFlow as fully editable wireframes. This allows you to continue refining your designs and collaborate with your team in real-time, no matter where they are.
Whiteboard2Wireframe AI feature is now available as a beta release in all MockFlow plans. Make sure to upload one UI screen at a time rather than multiple set of screens in a single photo.

Along with our other AI-powered features like Text2Wireframe, Screenshot2Wireframe. MockFlow streamlines the wireframing process, giving you more time to focus on refining and iterating your designs. Let AI handle the groundwork, so you can concentrate on creativity and collaboration
New in MockFlow AI: "Screenshot to Wireframe" Now, you can upload a screenshot of any user interface and let MockFlow instantly transform it into fully editable wireframes. This tool is perfect for brainstorming and refining the UI of existing products or websites.
Many users rely on MockFlow not just for designing brand-new interfaces, but also for updating or iterating the UI of their current software. Previously, this involved uploading a screenshot, cropping it, and manually adding elements—a tedious process that often fell short, as bitmap screenshots aren’t editable.
With our new AI-powered feature, those challenges are now behind you. "Screenshot to Wireframe" eliminates the need for overlaying elements or recreating wireframes from scratch. Simply upload your screenshot, and MockFlow will generate a wireframe or sketch-style representation that’s fully editable, making it much easier to iterate on your UI design.
This feature is accessible by clicking the camera icon in the create-new screen of the dashboard. And also inside the wireframe editor as part of our "Genius AI toolkit".

Introducing "Text to Wireframe", simply type what's in your mind and let AI imagine the wireframe design for you.
With just a few words, our AI-powered tool generates wireframes based on your idea. Our AI tech converts your prompt to meaningful details. These details are then used to create a rough layout which in turn perfected with repeated iteration. The final design is then transformed into a editable wireframe in the style mentioned by the user. It can be sketchy, lo-fi or hi-fi.
It could be wireframe for a landing page, mobile app, SaaS tool or any UI that you require. For better output, you can provide more details in your prompt like what sections you require and what functions it provides.
With "Text to Wireframe AI" features, MockFlow ensures that you never start your UI ideation process on a blank page. Unlike other "Text to Image AI", the wireframes generated is fully editable and can be customized to suit your needs.

AI powered "Text to Wireframe" feature is available for free. Paid plans get more credits for wireframe generation. For more details visit our pricing page.
Important Note: This is a Beta feature, which means it can be unstable at-times with un-expected outputs. Also like with any other AI software it can hallucinate and sometimes may not give desired output. We are also continually updating it with improved generation.
MockFlow now offers real-time call alerts for its prime in-design video meetings feature. Call alerts helps your team stay on top of their design work without missing important audio or video meetings! Our new "Call Alerts" feature sends real-time notifications during in-design sessions. It lets your team focus on brainstorming while staying connected with project members.

When brainstorming a new UI idea, or ideating a process flowchart or designing product assets with your team, it is important to not just collaborate in real-time but also communicate in sync. For this MockFlow already offers the ability to conduct audio or video meetings inside its editor without any third-party software. At the same time, when you start a meeting, it is important to bring your online project members together by alerting them.
By clicking the 'Headphones' icon in the top toolbar, anybody in your team can now kickstart a design meeting or a brainstorming session face-to-face. On clicking start, it sends a call like alert to other project members to either accept the meeting or decline just like your phone.

Brainstorm your SaaS apps mimicing shadcn look and feel.
shadcn/ui has quickly become a popular opensource library for building UI with reactjs. The reasons for its quick rise includes huge number of pre-built components, priority for accessibility and ease of use.
If you plan on developing web apps with shadcn, then it is important to brainstorm your UI ideas in its native look and feel to avoid implementation redesigns and to save time. With this new UI kit, MockFlow wireframing editor provides over 190 components in around 12 categories like forms, tables, alerts, charts.
With the easiness of MockFlow editor and extensible component set of this UI kit, you can draw UI mockups in minutes and iterate faster. Here is a sample UI screen for a dashboard was made with this UI pack in a matter of minutes.

For more information and installing the UI kit, Visit its MockStore page within the editor