What is Conversational AI in Mokkup?
Mokkup’s Conversational AI lets you design dashboard wireframes through a natural language chat, no manual drag-and-drop required to get started. Simply describe your data, your audience, or the kind of dashboard you need, and the AI will generate a ready-to-use screen for you.
The AI works as a context-gathering assistant first. Before generating anything, it asks a few targeted questions to understand your goals: what data you’re working with, who will use the dashboard, what KPIs or charts matter most, and any layout preferences. Once it has enough context, a “Build Dashboard” button appears in the chat, clicking it triggers the generation.
Conversational AI is designed to accelerate the early stages of wireframing. It gives you a strong structural starting point that you can then refine manually using Mokkup’s full suite of design tools.
How the Chat Works
The experience runs as a single, continuous chat session. There is no separate “chat mode” versus a “generate mode” — everything happens within one conversation. The flow looks like this:
- Start the chat: Open the AI panel and describe what you want to build. You can be as specific or as broad as you like.
- Answer follow-up questions: The AI may ask clarifying questions about your data source, target persona, preferred chart types, or filters needed.
- Click “Build Dashboard”: Once the AI has gathered enough context, the Build Dashboard button appears at the bottom of the chat. Click it to generate your screen.
- Refine manually: After generation, switch to Mokkup’s manual tools; drag-and-drop, the property panel, and direct element selection to fine-tune the layout.
Tip: You can shortcut the Q&A by leading with a persona prompt such as “I’m a CFO reviewing monthly financials.” The AI will auto-infer suitable KPIs, charts, and filters for that role and move straight to generation.
Generation: Behavior and Constraints
Understanding how the AI generates screens helps you work with it more effectively. The following behaviors are by design and reflect the current state of the feature.
Screen Creation:
- One screen per generation: Each time you click “Build Dashboard,” the AI creates a new screen on the canvas. It will never overwrite or replace a screen that already exists.
- No overwrite option: If the canvas already has one or more screens, the newly generated screen is placed beside the existing ones. There is no “replace” or “regenerate in this screen” option yet.
- Free plan screen limit: Free accounts include 1 project with a maximum of 3 screens. Since each generation creates a new screen, free users can generate up to 3 AI screens within their project. Upgrading to a paid plan removes this restriction.
- Rebuild at no cost: You can rebuild any AI-generated dashboard without incurring additional AI credits. Each rebuild creates a fresh screen; keep in mind this counts toward your screen limit on the free plan.
- No version history: Mokkup does not currently maintain a version history of AI-generated screens. If you regenerate, the earlier version remains on the canvas but is not tracked or labeled as a previous version.
Editing Generated Screens:
- Manual tools only: Once a screen has been generated, all edits must be made through the manual design tools: drag-and-drop repositioning, the property panel, and direct element selection on the canvas. You cannot instruct the AI via chat to modify an existing screen.
- Elements not added by AI: The following elements are not included in AI-generated screens and must be added manually: buttons, shapes, bubble charts, quadrant charts, scatter plots, and certain element variations.
Current Limitations:
- Theme Requests: The AI does not currently support theme or styling requests such as color schemes, font preferences, or visual design changes. These must be applied manually after generation.
- Multi-Screen Requests: The AI cannot generate multiple screens in a single request. Each prompt produces one screen at a time.
- Single-Element Changes: The AI cannot modify or update a specific element on an existing wireframe. There is no way to ask it to change just one chart or component via chat.
- Each Request Generates a New Screen: Every new prompt that triggers a build results in a brand new screen being added to the canvas, regardless of how similar it is to a previous one.
Persona-Based Generation
If your first prompt is persona-focused rather than data-focused, for example, “I’m a Head of Sales” or “I’m a marketing analyst” the AI will skip the usual context-gathering and immediately infer an appropriate dashboard. The inferred layout includes KPIs, chart types, and filters suited to that role.
Tip: With persona-based prompts, there is no blank-canvas option through chat. The AI always produces a fully populated screen. You can then remove or replace elements manually.
Chat History and Sessions
Each conversation with the AI is captured as a session with its own AI-generated title, making it easy to find and resume past conversations from the side panel.
- User-scoped, not project-scoped: Chat history belongs to you as a user, not to the project you were working in when you started the conversation. A chat begun inside Project A is equally accessible when you open Project B.
- Session titles: Every session is automatically titled by the AI based on the conversation content. These titles appear in the side panel for quick navigation.
- Continuous sessions: There is no session time-out during an active conversation. You can return to a chat and continue adding prompts at any time.
Uploading Data and Images
You can attach a data file and an image to your chat messages to give the AI more context for generation. Uploads are processed at the message level, and the following rules apply.
What You Can Upload:
- Data files: CSV or Excel files (.csv, .xlsx). One file per message. Only one table or sheet is processed per upload.
- Images: JPG or PNG files. One image per message. You can send multiple image messages across the course of a conversation.
How Uploads Are Used:
The AI does not use your actual data rows to populate the wireframe. Instead, it reads the file’s metadata — column headers, data types, and structure and generates representative mock data for the wireframe. This keeps the design process fast and ensures no sensitive data from your files is embedded in the canvas.
Upload Limits:
|
File Type |
Accepted Formats |
Max Size |
|
Images |
JPG, PNG |
2 MB per file |
|
Excel |
.xlsx |
5 MB per file |
|
CSV |
.csv |
30 MB per file |
Note: The AI does not collect, store, or process the actual values in your data file. It only reads the metadata such as column headers and element names to understand the structure of your data.
Coins and Usage
Conversational AI runs on Mokkup's shared Coins system– the same balance used for AI Wireframing, AI Review, and BI Export. There's no separate currency dedicated to Convo AI.
- Free Coins: Free plan users start with 25 Coins, shared across every Coin-based feature (not a dedicated Convo AI allowance).
- How chat is billed: The back-and-forth conversation, asking clarifying questions, refining your requirements, and processing uploaded files or images, draws Coins dynamically, based on the actual AI processing used. There's no fixed cost per message.
- How generation is billed: Clicking "Build Dashboard" to turn the conversation into an actual screen costs a flat 2 Coins per screen, on top of whatever the chat itself used.
- Topping up: Once your Coins run low, you can buy more directly from your account's Billing section.
Tip: If you're trying to conserve Coins, keep your initial prompt detailed and specific. This reduces the number of clarifying back-and-forth messages needed before you reach "Build Dashboard."
Tips for Best Results
- Be specific about your audience: Telling the AI who will use the dashboard (e.g., "a regional sales manager reviewing weekly pipeline") produces more relevant chart selections than a generic prompt.
- Name your key metrics upfront: If you already know the KPIs you need, like revenue, churn rate, and NPS, include them in your first message. The AI will prioritise them in the layout.
- Use uploads for column context: Attaching a CSV with your actual column names helps the AI label axes and filters accurately, even though it uses mock data for the wireframe itself.
- Iterate with manual tools: Think of the AI output as a starting framework. The fastest workflow is: generate a screen, then immediately refine it using drag-and-drop and the property panel.
- Rebuild freely: Rebuilding costs nothing extra. If your first generation isn’t quite right, adjust your prompt and regenerate; you’ll get a new screen to compare against the previous one.