Unify Logo Footer.svg
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.

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. You can change the app type before the generation step or convert the skeleton structure manually in Builder Settings after generation. Mobile App generation is available as a preview feature — contact your workspace administrator to enable it.

How AI Create Works

The generation process follows four steps inside the Applications Manager. The entire flow from prompt to open Builder typically completes in under 30 seconds for apps with fewer than ten pages.

  1. Open the creation dialog: From the Applications Manager home screen, click the Create with AI button. This opens the AI Create dialog, which is separate from the standard New Application flow. Both buttons appear in the top-right of the manager.

  2. Write your prompt: Type a description of the application you want in the prompt field. 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.

  3. Review the proposed structure: Before generating, the AI shows you a proposed page list — a preview of the pages it plans to create and a brief description of each. You can accept the plan as-is, remove pages you do not want, or add a clarification note and re-plan before committing to generation.

  4. Generate and open in the Builder: Click Generate App. The AI builds the interface record, populates each page with an appropriate component layout, wires basic navigation between pages, and opens the app in the Builder with the default page selected. You will see a generation summary panel on the right side listing what was created.

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

From the example prompt above, AI Create produces the following:

PagePrimary ComponentNotes
My JobsList component bound to a stub data source named assignedJobsDefault landing page for the Technician role. List items link to the Job Detail page.
Job DetailDetail card layout with Text fields for address, job type, and priorityReceives a jobId URL parameter. Includes a "Mark Complete" button wired to navigate to the Completion Form.
Job Completion FormForm 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 DashboardRow of Stat Cards (Open, In-Progress, Completed) above a Chart placeholderStat cards bound to stub data sources. Default page for the Manager role.
All JobsTable with columns for Job ID, Status, Technician, Address, PriorityIncludes a Search input and Status/Technician filter dropdowns. Row click navigates to Job Detail (Managed view).
Job Detail (Manager)Detail card with completion history sectionShows all completions for a job in a timeline component. Read-only for managers.

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 workspace default design tokens.

Tip: Generation time scales with page count. An app with 6–10 pages typically takes 20–35 seconds. Apps with 15 or more pages can take up to 90 seconds. If generation exceeds 3 minutes, use the Cancel button and try splitting your prompt 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.).

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 workspace default theme. Custom colors, fonts, and logos are a design decision.Builder Settings → Design System; Settings → Theme Builder
File and media handlingFile upload components are placed but not connected to a storage backend.Data panel → file upload data source; Builder Settings → File Management
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.

Regenerate Specific Pages

Inside the Builder, right-click any page in the page switcher and choose Regenerate Page with AI. A dialog lets you describe changes to that specific page — for example, "Add a timeline section below the details that shows all status changes and who made them, with timestamps." Only that page is replaced; all other pages remain unchanged.

Add New Pages via AI

From the page switcher, click Add PageGenerate with AI. Describe the new page and it will be added to the existing app. The AI can reference other pages by name — "A settings page where the manager can configure which technicians appear in the Assigned Jobs filter dropdown on the All Jobs page."

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. Regenerating a page replaces its content with a fresh AI-generated layout — save a manual copy of the current page before regenerating if you want to preserve any manual edits on that page.

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. Use the generation plan review step (step 3 in the flow) to catch this before pages are built.

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 Application to walk through every workflow before publishing.

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

Tip: Save versions early. After generation, immediately save a version by clicking Save in the Builder. Label it something like "AI Generate — initial." This gives you a restore point before you begin making manual changes, so you can always roll back to the original generated state if needed.

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 support generating Module app types. Generate a standard Web App and convert it to a Module via Builder Settings if needed.

  • 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.

Frequently Asked Questions

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. If you regenerate a specific page, only that page's content is replaced; your other pages and manual edits on other pages are preserved. 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?

Use the page plan review step — step 3 in the creation flow — to deselect any pages you do not need before generation begins. If you only notice the problem after generation, simply delete unwanted pages 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.

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.