> ## Documentation Index > Fetch the complete documentation index at: https://docs.gradial.com/llms.txt > Use this file to discover all available pages before exploring further. # New Page Workflow > Create new pages with Gradial's AI agents — from page duplication to Figma-to-CMS and content migration workflows. ## Why This Is Slow Today A landing page for next month's launch shouldn't take three weeks. But the path from approved design to live URL runs through a queue: the brief goes to a web producer, the producer opens the CMS, finds the closest existing page, copies it, then re-enters every headline, every body paragraph, every CTA and every image reference by hand — checking against the Figma file as they go. Then the design review comes back. The hero crops wrong on mobile, the third section uses a component that isn't approved for this template, and the disclaimer is missing. Each fix is another pass through the same queue. Multiply that by the number of pages a campaign actually needs — a hub, three regional variants, two product pages — and page creation becomes the reason launches slip. Gradial builds the page from whatever you already have: a design file, a brief, a reference page, or a description. It uses the component patterns your site already uses, so what comes out fits the environment instead of needing to be reworked into it. *** ## Overview Creating new pages is one of the core workflows in Gradial. Depending on your starting point and requirements, you can choose from several approaches: | Approach | Best For | Complexity | | :- | :- | :- | | Copy Existing Page | Similar pages, quick duplication | ⭐ Easiest | | From Templates & Patterns | Building from design system | ⭐⭐ Moderate | | From Copy Doc / Creative Brief | Content-first creation | ⭐⭐⭐ Moderate | | From Figma Design | Design-to-production | ⭐⭐⭐⭐ Advanced | *** ## Where this works Page creation is native in every connected CMS: **Adobe AEM** (6.5 and Cloud Service), **SitecoreAI CMS** (XM Cloud), **Sitecore XP**, **Contentful**, **Contentstack**, **Sanity**, **Drupal**, **WordPress**, and **Gradial ACI**. The mechanics differ by platform — what a template is called, where drafts live, how staging and publishing work — and Gradial uses each platform's own model. Content paths in the examples below use AEM-style paths; substitute the equivalent for your platform. See [Integrations](/docs/integrations-administration-and-setup/integrations/get-started-with-integrations) for the current list of connected platforms. *** ## Option 1: New Page from Existing Reference Page (Copy Page) **When to Use:** You need to create a page similar to one that already exists. This is the most common and fastest approach. ### Why This Works Best Most new pages are variations of existing ones. Rather than starting from scratch, copying an existing page gives you a proven structure with all the correct components already in place. You simply update the content. ### How It Works **Step 1: Identify Your Reference Page** Find an existing page in your CMS that closely matches what you need. This becomes your template. **Step 2: Create the Task** From your Gradial project dashboard, click **New Task** and select the new page option. Provide a task title and select the appropriate brand. **Step 3: Reference the Existing Page** In your prompt, specify the reference page location and the new page details: ``` Create a new page at location /content/mysite/en/news/2025/new-article Use /content/mysite/en/news/2025/existing-article as the reference structure Update the content with the following: - Title: [New Title] - Body content: [New content] - Hero image: [New image path] ``` **Step 4: Generate and Review** The agent will create a new page with the same component structure as your reference, populated with your new content. ### Tips for Success * Choose a reference page that matches your desired layout as closely as possible * The reference page should use the same template type as your target * Provide clear content for each section you want updated *** ## Option 2: New Page from Templates & Patterns **When to Use:** You want to build a page from your design system's established patterns rather than copying a specific existing page. ### Understanding Design Systems & Patterns Design Systems in Gradial organize your CMS components into reusable patterns grouped by page type. For example, you might have different pattern sets for Homepage, Blog Article, Product Detail, and Landing Page templates. Each Design System contains the specific component patterns available for that page type, giving the agent a clear reference for what building blocks are available. ### Prerequisites Before using this approach, you'll need: 1. **Golden Pages** created for your template types — see the [Golden Pages Guide](/docs/creating-new-experiences/golden-pages) 2. **Design System patterns** ingested from those Golden Pages — see [Design Pattern Ingestion](/docs/creating-new-experiences/design-pattern-ingestion) ### How It Works **Step 1: Create the Task** From your Gradial project dashboard, click **New Task**. Provide a task title and select the appropriate brand and page template. **Step 2: Specify the Design System** In your prompt, reference the specific Design System to use: ``` Create a new page at location /content/mysite/en/products/new-product Use the Product Detail Design Patterns Include the following sections: - Product Hero Banner - Product Features Grid - Product Specifications Table - Related Products Carousel ``` **Step 3: Provide Content Requirements** Give the agent the content for each pattern: ``` Hero Banner: - Headline: "Introducing Product X" - Subheadline: "The next generation of innovation" - CTA: "Learn More" linking to /content/mysite/en/contact Features Grid: - Feature 1: Title, description, icon - Feature 2: Title, description, icon [etc.] ``` **Step 4: Generate in Gradial Studio** Navigate to Gradial Studio and click "Draft with AI." The agent will select appropriate patterns from your Design System and populate them with your content. ### Pattern Selection Best Practices * Select only the patterns needed for your specific page to avoid overloading agent context * Alternatively, specify the Design System name directly in your prompt * Use unique, descriptive pattern names to avoid confusion between similar layouts *** ## Option 3: New Page from Copy Doc or Creative Brief **When to Use:** You have written content (Word document, Google Doc, creative brief, or transcript) that needs to be structured into a page in your CMS. ### Supported Source Types * Word documents (.docx) * PDF documents * Google Docs (shared link) * Creative briefs * Content transcripts ### How It Works **Step 1: Create the Task** From your Gradial project dashboard, click **New Task** and select the new page option. Provide a task title and select the appropriate brand and page template. **Step 2: Attach Your Content Source** Upload or link your document. Gradial will analyze the content structure. **Step 3: Create the Task** Click **Create as Draft** to initialize the page creation task. **Step 4: Generate in Gradial Studio** Navigate to Gradial Studio and click "Draft with AI." The agent will: * Analyze your document's content structure * Map content to appropriate components from your Design System * Create a digital copy doc (page blueprint) with: * Specific components selected for your content * Content formatted and laid out appropriately * Suggested image/video/media placements **Step 5: Review and Refine** Review the generated digital copy doc in Gradial Studio. Adjust component selections or content placement as needed. **Step 6: Generate the Page** Click **Back to Task** and select **Start**. Gradial will: * Create the new page directly in your CMS * Upload assets to your DAM * Configure components as specified * Ensure consistent formatting ### Tips for Document Preparation * Use clear headings in your document to help the agent identify content sections * Include notes about desired layout or component preferences * Provide image references or paths where visuals should appear *** ## Option 4: New Page from Figma Design **When to Use:** You have a Figma design file that needs to be translated into a production page in your CMS. ### Prerequisites * Figma design that visually aligns with your production components * Design uses components/patterns that exist in your Design System * Proper Figma access permissions configured ### How It Works **Step 1: Create the Task** From your Gradial project dashboard, click **New Task**. Provide a task title, select the brand and page template. **Step 2: Select Figma as Your Source** Choose the Figma Design option and provide: * Figma file URL * Specific frame or artboard to convert **Step 3: Create the Task** Click **Create as Draft** to initialize the task. **Step 4: Generate in Gradial Studio** Click "Draft with AI." The agent will: * Analyze the Figma design visually * Map design elements to production components in your CMS * Extract content (text, image references) * Create a digital copy doc matching the design intent **Step 5: Review Component Mapping** This step is critical. Verify that: * Design elements mapped to the correct components in your CMS * Layout structure is accurately represented * Content extracted correctly from the design **Step 6: Generate the Page** Once satisfied with the digital copy doc, click **Start** to create the production page. ### Best Practices for Figma-to-CMS **Design Alignment:** Ensure your Figma design uses visual patterns that correspond to actual components in your CMS. Custom designs that don't match existing components will require additional development. **Component Recognition:** The agent maps designs based on visual similarity to ingested patterns. Use consistent design patterns that match your Design System. **Content Extraction:** Text and image placeholders in Figma will be extracted. Use realistic content in your designs for best results. **Iteration:** Figma-to-CMS often requires iteration. Review the initial output carefully and provide feedback to refine the mapping. *** ## Choosing the Right Approach ``` ┌─────────────────────────────────────────────────────────────────┐ │ Which approach should I use? │ └─────────────────────────────────────────────────────────────────┘ │ ▼ ┌───────────────────────────────┐ │ Do you have a similar │ │ existing page to copy? │ └───────────────────────────────┘ │ │ YES NO │ │ ▼ ▼ ┌────────────────┐ ┌──────────────────────────┐ │ Copy Existing │ │ Do you have a Figma │ │ Page │ │ design to implement? │ └────────────────┘ └──────────────────────────┘ │ │ YES NO │ │ ▼ ▼ ┌────────────────┐ ┌─────────────────────┐ │ From Figma │ │ Do you have written │ │ Design │ │ content/brief? │ └────────────────┘ └─────────────────────┘ │ │ YES NO │ │ ▼ ▼ ┌────────────────┐ ┌────────────────┐ │ From Copy Doc │ │ From Templates │ │ / Brief │ │ & Patterns │ └────────────────┘ └────────────────┘ ``` *** ## Common Workflow: Starting the Task Regardless of which approach you choose, all new page tasks follow this general flow: 1. **Create Task** → New Task from project dashboard 2. **Configure** → Set title, brand, template, source 3. **Draft** → Generate in Gradial Studio with AI 4. **Review** → Verify digital copy doc 5. **Generate** → Create page in your CMS 6. **Finalize** → Review in your CMS, publish via standard workflow *** *** ## Who this is for | Role | What Gradial handles | | :- | :- | | **Digital Marketing Manager** | Launch dates that hold, because page builds stop being the dependency | | **Web Producer** | The page built to spec on the first pass, so the work is review rather than data entry | | **Content Author / Copywriter** | Copy going live as written, without a transcription step in between | | **Designer / DesignOps** | Designs published as designed — read from the Figma file rather than reinterpreted | | **Product Marketer** | A one-pager or spec sheet becoming a real product page without a separate request | | **Agency Partner** | Creative delivered as an input to execution, not the start of another coordination cycle | ### How this maps to your function Your launch calendar assumes a page build takes a known amount of time, and it usually doesn't — so either the date slips or the scope does. When page creation runs from the brief you already wrote, you can plan the campaign you actually want: a hub plus regional variants plus the product pages, rather than whichever subset fits the production window. Building a page from a design file is mostly transcription — and transcription is where the errors are. Gradial does that pass and leaves you the judgment: is this the right component for this section, does the hierarchy read correctly, is anything missing. You review a built page instead of building it. The gap between the Figma file and the published page is where design intent goes missing — usually not through disagreement but through a hundred small interpretation calls made under time pressure. Gradial reads the design directly and populates it into your approved component structures, so what ships is closer to what was designed, and brand and accessibility checks run on the output either way. This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.