Unify Applications
Logo
Generating an App with AI

Generating an App with AI

Logo

15 mins READ

What is AI Create?

UnifyApps AI Create is a natural-language app generator built directly into the Applications Manager. Instead of starting from a blank canvas, you describe what your application should do — in plain English — and the AI generates a working starting point: a page hierarchy, appropriately chosen components, sample data source stubs, and basic navigation wiring. On screen, the prompt screen is titled Prompt. Build. Ship, and Create with AI brings you back to it from the manual form.

ai-create-screen.png
ai-create-screen.png

The generated app opens immediately in the Builder, where you can inspect every page, adjust any component, replace stub data sources with real integrations, and publish as you would any other app. AI Create is a first-draft generator, not an autonomous builder — the output always belongs to you, and every element it produces is fully editable.

Note: AI Create generates Web Apps by default. The prompt screen has no app-type selector. To choose the type yourself (Web App, Mobile App, Copilot Chat or Display), use Or start blank → Create Manually instead. Mobile App generation is available as a preview feature — contact your workspace administrator to enable it.

How AI Create Works

The generation process starts in the Applications Manager. Generation takes longer for apps with more pages.

  1. Open the create screen: In the Applications manager, click New Application → Create Application. If AI app building is enabled for your workspace, the AI prompt screen opens first — What would you like to create? Otherwise, you see the manual create form.

  2. Select Config: If a Code / Config toggle appears above the prompt box, select Config to generate an app you edit in the application builder. Code sends your prompt to the code builder instead.

  3. Write your prompt: Type a description of the application you want in the prompt box. Be specific about user roles, key entities (the things your app manages), and the workflows users perform. The more context you provide, the more precisely the generated structure will match your intent. See Writing Good Prompts for detailed guidance. Optionally, attach reference files and pick a theme.

  4. Submit: Press Enter or click the send arrow. Generation starts straight away — there is no separate review step.

  5. Watch the progress screen: The AI Application Builder screen shows Generating App... with a stepper that ticks through the build steps (starting with Initializing) and a progress bar. When the app is ready, the status changes to App Ready and a live Preview with a page switcher appears.

  6. Review and open in the Builder: Read the AI-written summary of what was created, then click Open in Application Builder to start editing.

If generation doesn't finish, you see Could not generate app. Please try again. Remove any attachments over the size or number limit, simplify the prompt, and submit again.

The Prompt Screen

AI Create is available only when AI app building is enabled for your workspace. When it isn't, the create screen shows only the manual form. Inside the prompt box you can:

  • Choose Config — when your workspace has both build modes, a Code / Config toggle sits above the prompt box. Select Config (the no-code app generator, which produces an app you edit in the application builder). Code uses the code builder.

  • Add attachments — click the plus icon or drag files onto the screen to add reference documents, spreadsheets or screenshots. You can add up to 20 files, with a limit of about 1 GB per file and 1 GB in total; files over the limit are rejected.

  • Pick a theme — click the palette icon to search and filter themes. The theme you pick is applied to the generated app. Skip it and the app gets a default look you can restyle later.

  • Dictate — where your browser supports it, click the microphone to speak your prompt instead of typing it.

The Auto menu and the model selector you may see belong to Code mode; they aren't part of the Config generator.

To start blank instead, use Or start blank → Create Manually. Click Create with AI to switch back to the prompt. For a field-by-field reference of the create screens, see Config-First App Creation and Code-First App Creation.

A Realistic Prompt Example

The quality of the output depends directly on the quality of the prompt. Here is a realistic example that demonstrates how specificity improves the generated result.

Example Prompt

"A field service management app for a utilities company. There are two user roles: field technicians and managers. Technicians should be able to: view their assigned jobs for the day on a list screen, open a job detail screen showing the job address, job type, and priority, mark a job as complete by filling in a completion form that includes notes, completion time, and an option to upload a photo. Managers should be able to: view a dashboard showing open, in-progress, and completed job counts for today, view a searchable table of all jobs with filters for status and technician, and open a job detail view with the full history including who completed it."

What Gets Generated from this Prompt

A typical generation from this prompt produced something like the following. Output varies from run to run, so treat the page names and data source names below as an illustration:

Page

Primary Component

Notes

My Jobs

List component bound to a stub data source named assignedJobs

The technician's job list. List items link to the Job Detail page.

Job Detail

Detail card layout with Text fields for address, job type, and priority

Receives a jobId URL parameter. Includes a "Mark Complete" button wired to navigate to the Completion Form.

Job Completion Form

Form with Text Area (notes), DateTime picker (completion time), and File Upload (photo)

Submit button is pre-wired to trigger a createJobCompletion stub data source and navigate back to My Jobs.

Manager Dashboard

Row of Stat Cards (Open, In-Progress, Completed) above a Chart placeholder

Stat cards bound to stub data sources.

All Jobs

Table with columns for Job ID, Status, Technician, Address, Priority

Includes a Search input and Status/Technician filter dropdowns. Row click navigates to Job Detail (Manager).

Job Detail (Manager)

Detail card with completion history section

Shows all completions for a job in a timeline component. Read-only for managers.

Role-based access isn't generated: which role sees which page is something you set up afterwards (see the table below).

In addition to the pages above, AI Create produces:

  • A navigation menu with two groups — Technician views and Manager views — ready for you to apply role-based visibility.

  • Stub data source definitions for assignedJobs, allJobs, jobDetail, createJobCompletion, and dashboardStats, each with sample placeholder data you replace with real connectors.

  • Page-level variables such as selectedJobId used to pass context between pages.

  • A basic app theme using the theme you picked on the prompt screen, or a default look if you skipped it.

Tip: Generation time scales with page count. Larger apps take longer to generate. If generation doesn't finish, the progress screen ends with Could not generate app. Please try again. Try again with a shorter prompt, or split it into two smaller apps that you later link via navigation.

What AI Create Generates

Understanding exactly what the AI produces helps you plan how much manual work remains after generation. AI Create is reliable at the following tasks:

Page Structure

AI Create builds a complete page hierarchy based on the entities and workflows in your prompt. Each page is named, given a route path, and placed in the page switcher. Pages are ordered logically — list pages precede detail pages, dashboard pages appear first for management roles. The AI infers the right page type (full-page, modal-style detail, form wizard) from the workflow description.

Component Layout

For each page, the AI selects the most appropriate UnifyApps built-in component for the primary workflow. Common mappings:

  • List of items to browse → List or Table component

  • Detail view of a single record → Card container with Text, Badge, and Button blocks

  • Data entry → Form component with inferred fields (Text Input, Number Input, Date Picker, File Upload, Dropdown)

  • Summary metrics → Stat Cards and Chart components

  • Multi-step workflow → Step/Wizard layout with conditional navigation

  • Search and filter → Table with a companion Search Input and Filter Dropdown

Within each component, fields are inferred from the entities you named. If you mention "job address, job type, and priority" the form or detail view will include fields named accordingly. Field types are inferred from the name — "priority" becomes a dropdown or rating component, "completion time" becomes a DateTime picker, "notes" becomes a text area.

Basic navigate actions are wired between pages. A list page's row click navigates to the detail page passing an ID parameter. A form's submit button navigates back to the list on success. The navigation menu is populated with the main pages. You will still need to configure role-based menu visibility and any conditional navigation logic (redirecting based on form validation outcome, for example).

Stub Data Sources

Every page that displays or mutates data gets one or more stub data sources. Stubs are placeholder data source definitions pre-populated with sample JSON arrays or objects that match the field names in the prompt. They allow the page to render with realistic-looking placeholder data in the Builder and in Preview — without requiring a real backend connection.

Replace stubs with live data sources by opening the Data panel and swapping the stub's query configuration with a real connector (REST, Storage by UnifyApps, a database connector, etc.). See Data Sources Overview.

App and Page Variables

Common state management patterns are scaffolded automatically. ID variables for passing selected records between pages, boolean loading flags, and filter state variables are created where the AI identifies they are needed.

What AI Create Does NOT Generate

AI Create is intentionally scoped. The following items are always your responsibility to configure after generation:

ItemWhy it is not generatedWhere to configure
Live backend connectionsAI Create cannot know which integration your workspace uses or how your API endpoints are structured. Stubs stand in during development.Data panel → replace stub data sources with real connector queries
Authentication and access controlRole mapping, login flows, and session handling are workspace-level concerns that vary by identity provider.Settings → Privacy; block Permissions panel for per-block role gating
Custom business logicValidation rules, calculated fields, approval workflows, and conditional branching beyond basic navigation require domain knowledge the AI does not have.Interactions → event-action chains; JavaScript functions in data source transforms
Real theming / brandingThe app gets the theme you picked on the prompt screen, or a default look if you skipped it. Custom colors, fonts, and logos are a design decision.Settings → Theme Builder
File and media handlingFile upload components are placed but not connected to a storage backend.Data panel → file upload data source
Error states and empty statesComponents render success states only. Empty-state messages and error handling must be added manually.Component properties → Empty state; event chains → error action branches

Warning: Never publish a generated app to production without review. Stub data sources return sample data, not live data. Permissions are not configured. The generated app is a starting point for development, not a finished product. Always complete backend connections, access control setup, and testing before publishing for real users.

Writing Good Prompts

The single biggest factor in generation quality is prompt specificity. The AI works from what you write — it cannot infer your business context, data model, or organisational structure. The following techniques consistently improve output quality.

Name Your User Roles

Instead of "users", name the specific roles that will use the app. The AI uses role names to create separate pages or navigation groups and infers which pages each role needs.

  • Vague: "Users can view and submit forms."

  • Specific: "Field technicians view assigned work orders and submit completion reports. Supervisors view an overview dashboard and can reassign work orders between technicians."

Name Your Key Entities

Entities are the things your app manages — the nouns. Naming them gives the AI field names to use throughout the component configuration.

  • Vague: "Users can see items and update their status."

  • Specific: "Procurement managers can view purchase requests (with fields: vendor, amount, requested by, status, due date) and approve or reject them."

Describe Key Workflows

A workflow is a sequence of actions a user takes to accomplish a goal. Describing workflows tells the AI how pages connect to each other.

  • Vague: "A page to manage incidents."

  • Specific: "An incident list page where support agents can search by keyword and filter by priority. Clicking an incident opens a detail page showing the full description, assignee, and SLA timer. The detail page has a button to open a modal form where the agent can add a resolution note and close the incident. On close, the list refreshes."

Mention Dashboard Metrics Explicitly

If you want a dashboard, list the metrics. "A dashboard" generates a placeholder chart. "A dashboard showing open tickets by category, average resolution time this week, and a table of SLA breaches" generates stat cards and a chart pre-labeled with those metric names.

Specify Important Data Relationships

Mention parent-child or lookup relationships explicitly when they affect the UI. "Each job belongs to a customer. The job detail should show the customer name and contact phone number" tells the AI to include a related-record lookup and surface the right fields.

Prompt Length

Aim for 100–400 words. Shorter prompts produce generic scaffolding. Prompts over 500 words occasionally cause the AI to generate more pages than you need. If your app is large, consider generating two separate apps (one per major role or workflow area) and linking them via cross-app navigation or embedding one as a module.

Iterating on a Generated App

AI Create is not a one-shot operation. You can refine the generated output in several ways without starting over.

Edit with the AI Assistant

Once the generated app is open, use the AI Assistant panel in the builder's left rail to keep changing it with AI. Describe the change you want in plain language — for example, "Add a timeline section below the details that shows all status changes and who made them, with timestamps." The assistant knows the page you have open and the block you have selected. It may ask a clarifying question or propose a plan for you to approve, and then applies the change to your current page. See Editing Pages with the AI Assistant.

The assistant edits the device layout you're currently on, so check the other layouts if the change should apply there too. To add a new page by hand, use the page switcher: + → Page, pick a template, and fill in Page Setup.

Manual Edits are Always Available

Every element AI Create produces is a normal UnifyApps component. You can select, move, delete, or reconfigure any block the same way you would in a hand-built app.

When to Start Fresh

If the generated page structure is fundamentally misaligned with your intent — wrong number of pages, wrong primary component types — it is often faster to delete the generated app and write a better prompt than to manually restructure many pages. Check the live Preview on the progress screen to catch this before you open the app in the Builder.

AI Create as a Starting Point

The best mental model for AI Create is a senior colleague's first draft. When a new developer joins a project, you might ask them to scaffold the initial pages so the team has something concrete to discuss — knowing that the scaffold will be replaced and refined over the following weeks. AI Create does the same job faster.

The typical post-generation workflow looks like this:

  1. Inspect the page plan — open each generated page and verify the component choices make sense for the workflow. Delete pages that were over-generated.

  2. Replace stub data sources — connect each stub to a real integration. Start with read queries so pages show live data, then add write queries for forms.

  3. Apply access control — configure page permissions, block permissions, and navigation visibility per role.

  4. Add business logic — wire validation, conditional navigation, and error handling via event-action chains.

  5. Apply branding — swap the workspace default theme for your organisation's theme or configure one in the Theme Builder.

  6. Test in Preview — use Preview to walk through every workflow before publishing. See Preview & Publish.

  7. Publish — once reviewed, publish the working copy to make it available to end users.

Tip: Your restore point is created for you. The builder saves every edit automatically — there is no Save button — and each auto-save adds an entry to the Saved Versions panel. You can't name a version, so note when you first open the generated app: the earliest entries are the original generated state you can restore later.

Known Limitations

AI Create is under active development. Current limitations to be aware of:

  • Complex table configurations — generated tables include common columns but may miss conditional formatting, nested sub-tables, or advanced row-action setups. Configure these manually after generation.

  • Multi-step forms — wizard-style multi-step forms with branching logic are often generated as a single flat form. Rebuild the step structure manually using the Form component's multi-step mode.

  • Chart types — the AI defaults to bar charts for most metrics. If you need a specific chart type (Gantt, scatter, funnel), replace the chart component and configure its type after generation.

  • Module apps — AI Create does not generate Modules. To build a Module, open the menu next to New Application in the Applications Manager and choose Create Module.

  • Non-English prompts — prompts in languages other than English are supported but may produce less accurate page naming and field inference. English prompts consistently produce the best results.

FAQs

Can I regenerate the entire app from a new prompt after I have already made manual edits?

No — full app regeneration is not available after the initial creation. To change specific pages with AI, use the AI Assistant panel in the builder; it edits the page you have open and leaves your other pages as they are. If you want to start over entirely from a new prompt, create a new application using AI Create. The original generated app remains in your Applications Manager and can be deleted separately.

How do I handle the case where AI Create generates too many pages?

Delete the pages you don't need from the page switcher in the Builder. Deleting a page removes its blocks, page-scoped data sources, and page-scoped variables; app-level data sources and navigation items pointing to the deleted page will need to be cleaned up manually. To get fewer pages next time, keep your prompt focused on the roles and workflows you actually need.

Does AI Create support generating apps in languages other than English?

You can write your prompt in any language, and the AI will attempt to generate page names, field labels, and component text in that language. However, AI Create is optimised for English prompts, and output quality — particularly field name inference and navigation wiring — is consistently better when the prompt is written in English. If your app's end users need a language other than English, generate in English first, then use the Localization panel to translate all labels and strings into your target language without changing the underlying component structure.