Apply proposed AI ecosystem hierarchy and naming conventions to the AI Overview page
>>> [!note] Migrated issue
<!-- Drupal.org comment -->
<!-- Migrated from issue #3560199. -->
Reported by: [afoster](https://www.drupal.org/user/594458)
Related to !1162
>>>
<p>[Tracker]<br>
<strong>Update Summary: </strong>Vibe coded proposal in review for Production Code<br>
<strong>Short Description: </strong>Reorganize and rename the AI Overview page with new categories and descriptions.<br>
<strong>Check-in Date: </strong>11/26/2025<br>
<em>Metadata is used by the <a href="https://www.drupalstarforge.ai/" title="AI Tracker">AI Tracker.</a> Docs and additional fields <a href="https://www.drupalstarforge.ai/ai-dashboard/docs" title="AI Issue Tracker Documentation">here</a>.</em><br>
[/Tracker]</p>
<h2>TLDR </h2>
<p>We propose redesigning the AI Overview page (/admin/config/ai) to demonstrate the application of new ecosystem-wide naming conventions and hierarchy. This issue provides concrete examples of the proposed labels, benefit-oriented descriptions, and structural logic (Infrastructure → Tools → Features) intended to be standard throughout the AI ecosystem.</p>
<h2 id="problem-motivation">Problem/Motivation</h2>
<p>The current AI overview page (<code>/admin/config/ai</code>) presents a flat, unorganized list of links to various AI configurations. This list mixes foundational infrastructure settings (like provider keys) with high-level tools (like agents) and specific feature settings (like image alt text).</p>
<p>This lack of hierarchy and clear naming makes the page overwhelming and difficult to navigate, especially for site builders who need to distinguish between one-time setup tasks and frequently accessed tools.</p>
<h2 id="proposed-resolution">Proposed resolution</h2>
<p>We propose reorganizing the AI Overview page into a categorized, 2-column layout that applies the new naming conventions and hierarchy rules defined in the parent meta issue. This structure guides the user from foundational setup to advanced tools and finally to specific end-user features.</p>
<h3 id="before">Before</h3>
<p><img src="https://www.drupal.org/files/issues/2025-11-26/AI_before_UI.png" alt="Before AI UI"></p>
<h3 id="after">After</h3>
<p><img src="https://www.drupal.org/files/issues/2025-11-26/AI%20%20Overview%20-%20v3.png" alt="After Proposed UI "></p>
<h3 id="expanded-view-structure-example-">Expanded View (Structure Example)</h3>
<p><img src="https://www.drupal.org/files/issues/2025-11-26/AI%20%20Overview%20-%20%20Examples%20v3.png" alt="AI UI with many items in it"><br>
<em>Note: This image demonstrates how the hierarchy accommodates various features by showing one example within each category to illustrate the structure.</em></p>
<h3 id="the-proposed-hierarchy">The Proposed Hierarchy</h3>
<p>We have defined a specific order of operations for the page to guide the user:</p>
<ol>
<li><strong>AI Infrastructure:</strong> Backend configuration and foundational services.</li>
<li><strong>Vector Search Infrastructure:</strong> Specific setup for semantic search.</li>
<li><strong>Tools & Automation:</strong> Operational engines that execute tasks.</li>
<li><strong>Features:</strong> End-user facing capabilities, grouped by function.</li>
</ol>
<h2 id="categorization-logic">Categorization Logic</h2>
<p>To ensure consistency as the ecosystem grows, we are applying a logic where <strong>Infrastructure enables → Tools execute → Features deliver value.</strong></p>
<ul>
<li><strong>Infrastructure</strong> is required setup.</li>
<li><strong>Tools & Automation</strong> operate automatically in the background.</li>
<li><strong>Features</strong> are what users interact with directly.</li>
</ul>
<p><em>(Detailed categorization rules are attached).</em></p>
<h2 id="remaining-tasks">Remaining Tasks</h2>
<ol>
<li>Review and refine the proposed labels and descriptions.</li>
<li>Confirm the technical feasibility of grouping these menu items. (What about the impact on sub-modules?)</li>
<li>Refine 2 LLM systems prompts in use: Writing AI labels, Organizing AI structure (Currently using Claude Opus). Examples from this issue will be embedded within it once approved.</li>
<li>If agreed upon, create the implementation issues for each.</li>
</ol>
<h2 id="user-interface-changes">User interface changes</h2>
<ul>
<li>The <code>/admin/config/ai</code> page will be redesigned to use a 2-column layout with grouped sections.</li>
<li>Menu items will be renamed and given new, descriptive help text.</li>
</ul>
<h2 id="proposed-text-labels-and-descriptions">Proposed Text Labels and Descriptions</h2>
<p>These are written based on the writing guidlines in the parent issue</p>
<pre><pre># 1. AI Infrastructure<br><br>AI Platform Providers<br>Connect and authenticate with AI services like OpenAI, Anthropic, or local models through LiteLLM.<br><br>Default Models for AI Operations<br>Select default providers and models for each AI capability (chat, images, audio, etc.).<br><br>Prompt Library<br>Create and manage reusable instructions that tell AI features how to respond across your site.<br><br># 2. Vector Search Infrastructure<br><br>Vector Database Configuration<br>Connect vector databases like Pinecone or Milvus to enable semantic search that finds content by meaning, not keywords.<br><br>Embedding Service<br>Choose which AI embedding model converts your content into vector data for semantic search.<br><br># 3. Tools & Automation<br><br>AI Agents<br>Autonomous helpers that perform Drupal operations like site building, content creation, and configuration management through natural language instructions.<br><br>AI Assistants<br>Conversational AI interfaces for either public visitors or site builders that answer questions, provide guidance, search content, and trigger AI Agents when needed.<br><br>AI Automation Workflows<br>Create multi-step AI workflows that automate complex tasks by connecting operations in sequence - analyze, transform, generate, and publish content automatically.<br><br>AI Moderation Guardrails<br>Add safety guardrails that prevents the display of inappropriate or offensive content by double checking what is generated.<br><br># 4. Features (Categorized)<br><br>## Content Creation & Support<br><br>AI Image Alt Text<br>Automatically generate accessible image descriptions using AI vision models.<br><br>AI SEO Tools<br>Optimize your content for search engines using AI. Generate meta descriptions and get recommendations to boost search rankings.<br><br>AI Translation<br>Translate content into multiple languages while preserving meaning, tone, and context.<br><br>## People, Accounts & Users<br><br>AI Chatbot<br>The chat widget interface users see and interact with on your site. Connects to AI Assistants in the backend to answer questions, trigger actions, and provide support.<br><br>## Safety & Compliance<br><br>AI Observability<br>Monitor and log all AI operations across your site for compliance and debugging. Track costs, response times, and AI decisions with detailed audit trails.<br><br>## Search & Discovery<br><br>AI Related Content<br>Automatically suggest related content based on semantic similarity and user behaviour. Finds related content based on topics, themes, and concepts rather than keywords.<br><br>## Site Building & Design<br><br>AI Canvas Page Builder<br>Create page layouts and content sections through natural language prompts. AI builds the structure, adds blocks, and arranges elements based on your instructions.<br><br>AI Theme Assistant<br>Describe how you want your site to look and feel. AI interprets your visual preferences and it creates custom styles, themes, and layouts.</pre></pre>
> Related issue: [Issue #3558401](https://www.drupal.org/node/3558401)
issue