Forge AI Assistant

What is Forge

Forge is UXPin’s AI assistant for creating and editing UI in the Editor. It is the primary AI interface in UXPin and part of UXPin AI. It helps you create and modify UI faster during prototyping. You describe what you want to build or change, and the result appears directly on the canvas. 

Forge works with your project’s connected component library, including built-in React libraries such as MUI, Ant Design, and shadcn/ui, custom React component libraries integrated with UXPin Merge, and UXPin Classic components. 

To open the AI Chat panel:

• Click the AI in the Bottom bar, or
• Use the Alt "3" shortcut.

The panel can be detached and repositioned like other panels.

You can use it to:

• Generate new UI from a prompt.
• Edit selected components.
• Refine results with follow-up instructions.
• Review suggested changes before applying them.
  

Conversation history is saved for the project, so you can continue working in context.

If you are working inside the Editor, use Forge AI Assistant. If you are starting a new prototype from the Dashboard, use AI Component Creator.

Forge Interface

When you open Forge, it appears as a vertical panel displaying your conversation.

Your interaction is shown as chat bubbles. Each response may include:

• Short explanation of what was understood.
• Description of the planned change.
• AI output, such as generated components or edits.
• UX feedback.

At the bottom of the panel, you will find the text input field. This is where you describe what you want to create or change. You can write in natural language.

At the top of the input field, you will see context controls that determine how your request is handled.

Target pill
The Target pill shows which element on the canvas will be modified. It is set automatically based on your current selection. If nothing is selected, Forge may ask you to clarify the target.

Library pill
The Library pill shows which component library Forge will use. This is set automatically based on the library connected to your project.

At the bottom of the input field, you will find action buttons. 

Image upload
You can upload screenshots, wireframes, or mockups. The image is used as visual context when generating or editing UI.

Prompt Library
The Prompt Library provides grouped example prompts. You can use them as a starting point and adjust them to match your needs.

More menu (⋮)
The More menu includes:

• Start new chat – Starts a new conversation and clears previous context.
• Settings – Open Forge settings.
• Docs – Open this documentation.
• Chat history – View your previous conversations for this project.

Chat history is saved per project and per user. Only you can see your conversations. Other team members who open the same prototype do not have access to your chat history.

Send button
Submits your prompt to Forge. 

If you stop AI before the process is complete, the current action will be canceled.

• When generating a new component, it will not be created or added to the canvas.
• When refining an existing component, the changes will not be applied.

If you want a simplified workspace focused on AI, you can enable AI Focus mode from the Top bar. This hides most of the Editor interface, keeping only the panels needed for AI-driven work.

Settings & Customization

To open Forge settings:

1. Open the AI Chat panel.
2. Click the More menu (⋮).
3. Select Settings

AI Model selection

You can choose which AI model Forge uses for generation and refinement.

All supported models are visible in the selection list. However, access to specific models depends on your subscription plan. If you select a model not included in your plan and try to generate UI, you will see a message indicating that the model is unavailable.

Some models respond faster. Others handle more complex instructions and larger UI structures.

For details about model availability and credit costs, see AI Credits & Models.

AI Provider

By default, Forge uses UXPin’s integrated AI providers.

If you want to use your own provider account:

1. Open Settings in the AI Chat panel.
2. Enable the Use own API key option.
3. Select the provider.
4. Enter your API key.

Supported providers:

• OpenAI
• Anthropic

When connected, Forge uses your provider account for generation. Your provider handles usage and billing.

Design system guidelines

You can define rules that guide how UI is generated or edited by entering instructions in the Design System Guidelines field.

These guidelines are written as plain text. Forge interprets them as instructions when generating or refining UI.

You can describe:

• Preferred color usage.
• Typography rules.
• Spacing increments.
• Component structure patterns.
• Layout constraints.
  

If you reference specific tokens or styles, make sure they are clearly described in the guidelines.

For example:

• Primary buttons should use #0055FF as the background color and white text.
• Headings use Inter, 24px, semibold.
• Body text uses 14px with 1.5 line height.
• Cards should have 16px padding and 8px border radius.

You can also insert example guidelines using the sample button next to the field. This adds a predefined set of instructions that you can edit.

Guidelines are saved automatically. Once added, they apply to future prompts in the same project and do not need to be repeated.

Usage and credits

Forge uses AI credits for generation, refinement, UX review, and iteration tasks.

The number of remaining credits is displayed:

• In the More menu (⋮) in the AI Chat panel.
• At the bottom of the Settings modal.
• At the bottom of the AI Component Creator modal in Project view.
  

Credit usage depends on the size and complexity of the request and the model used.

For detailed information about how credits work, see AI Credits & Models.