Our Visily AI will assist you throughout the design process by generating and refining designs. It supports creating the following types of outputs:
- UI Screens. Generate mobile apps, web apps, or websites. You can create either a single screen or an entire app flow.
- UI Components. Generate common components such as tables, charts, headers, and menus.
- Images. Create photos or illustrations to support your designs.
- Diagrams. Generate various diagrams, including sitemaps, organization charts, flowcharts, state diagrams, use case diagrams, class diagrams, and entity-relationship diagrams (ERDs).
Note: Visily AI assistant is designed to handle design-related prompts only. For general questions or support, please visit our Help Center or contact our support team.
Access Visily AI assistant
You can access the Visily AI Assistant using the following methods:
- From your workspace, select the “Start with AI” option.
- From inside your board, either click the “Visily AI” button at the bottom of the board or the “Ask Visily AI” icon in the toolbar of containers, screens, or sections.
How to use Visily AI Assistant
Create your design with Visily AI
To create your design with Visily AI, you can start with any of the following methods:
- Using prompt: Enter your prompt in the AI chat box (up to 4000 characters). You can also browse sample prompts by pressing “/”.
- Using prompt with uploaded images for visual guidance: Upload up to 4 images (JPG, PNG, or WebP formats, each under 5MB after compression) to help guide the AI in generating your design visuals. Simply drag and drop images into the chat box or click the “Upload images” icon.
- Using prompt with existing design in board or previous generated outputs as visual references: Select an element on the canvas using the “Select anything on canvas” icon, or reference a previous output using the “Modify / Reference” icon in it. Then, enter your prompt to ask the AI assistant to generate results based on that visual input.
Tip: This Prompt Guide helps you write effective prompts to make the most of our AI generation capabilities.
Additionally, Visily AI Assistant offers a “Generate Images” setting option for generation, which helps the AI determine whether to include real images or placeholders in your design. By default, this setting is turned on, so the AI generates design with images. You can turn it off if you prefer to use placeholders instead by opening the “More” menu in the chat box while using Visily AI.
Work with the generated output
Once generation is complete, the output will appear in your AI chat thread, which you can revisit anytime. From there, you can continue working with your design using the following actions:
- Preview output: Click directly on the output to open a larger preview window.
- Switch to Hi-fi mode: If the output lacks colors, you might be in Lo-fi mode. In that case, you’ll see a “Switch to Hi-fi” button in your output. Click it to switch modes and view a more detailed and polished UI.
- In Hi-fi mode:
- Change styles: By default, the AI Assistant generates styles that complement your board theme. Click the “Edit Style” button on the output, or click directly on the output to open the “Edit Style” menu at the top-center of the preview window. From there, you can apply these styles to one or multiple screens.
- Save AI-generated style as board theme: You can save any of the generated styles as your board theme. When you do, all designs and AI-generated outputs currently using the board theme will update to the selected style.
- Add to canvas: Once you’ve finished previewing or applying styles, select the “Add to board” button to place the generated output onto your canvas.
Modify your design
Visily AI can also help you modify your existing designs:
- Refine generated output: Hover over the desired output in the AI chat and click the “Modify / Reference” icon. Then, enter your modification prompt to have the AI continue updating the design.
- Modify designs on the canvas: Click the “Select anything on canvas” icon in the chat box, then select an element on the canvas (e.g., screen, container, image, table) and provide your prompt for modification.
Tip: For best results, either generating or modifying designs, pair a clear and specific prompt with a visual reference. This helps the AI better understand your intent and produce more accurate, context-aware outputs.
Other actions with Visily AI chat
- Create a new chat thread: Click the “New Chat” icon at the top of the chat box to start a new conversation.
- View and manage chat history: Click the “Chat History” button at the top of the chat box to see a list of all your chat threads. Select a thread to view it. To rename or delete a thread, click the “More” icon next to it.
- Move or resize the AI chat: Click the “Move” icon at the top of the chat box to reposition or resize it. The chat box will remember its position and size the next time you open it.
