CH5 AI Prompt 互動提示詞生成系統

Part 3:互動式提示詞生成器

問卷設計邏輯、模板系統與 AI 智能生成實作

問卷設計 PromptBuilder AI 統一接口

📋 為什麼用問卷式介面?

傳統自由輸入的問題
  • 使用者不知道該描述到什麼程度
  • 新手可能遺漏重要資訊
  • 自由文字難以結構化處理
  • 需要複雜的自然語言理解
問卷式設計的優勢
  • 確保完整性:每個問題對應重要面向
  • 降低認知負擔:選擇比填空容易
  • 便於處理:結構化資料直接映射
  • 引導使用者:逐步完善需求

📝 問卷選項設計

1. 專案類型

  • Web 應用程式
  • 命令列工具
  • API 服務
  • 資料分析專案
  • 教學專案

2. 功能需求(多選)

  • Web 界面、API 後端
  • 資料庫、AI 整合
  • 測試程式碼、部署指南

3. 詳細程度

  • 基礎:簡要說明
  • 中等:包含範例
  • 詳細:完整實作指導
  • 超詳細:教學級別

4. 語言 & 平台

  • 繁體中文 / 簡體中文 / 英文
  • 跨平台 / Windows / Linux / macOS

🏗️ PromptBuilder 模板系統

PROJECT_TYPES = {
    'web_app': {
        'name': 'Web 應用程式',
        'tech_stack': ['HTML', 'CSS', 'JavaScript', 'Backend Framework'],
        'sections': ['UI/UX 設計', '前端實作', '後端 API', '資料庫設計', '部署']
    },
    'cli_tool': {
        'name': '命令列工具',
        'tech_stack': ['Python/Node.js', 'argparse/commander'],
        'sections': ['指令設計', '參數處理', '輸出格式', '錯誤處理']
    }
}

DETAIL_LEVELS = {
    'basic': {'depth': 1, 'include_examples': False},
    'intermediate': {'depth': 2, 'include_examples': True},
    'detailed': {'depth': 3, 'include_examples': True},
    'comprehensive': {'depth': 4, 'include_examples': True}
}

🔄 模板生成流程

_build_header()
建立標題與元資訊
_build_overview()
專案概述與功能列表
_build_tech_requirements()
技術棧建議
_build_features()
功能規格詳述
_build_footer()
期望產出說明
完整提示詞
Markdown 格式

🤖 AIService 統一接口

class AIService:
    def generate_prompt(self, requirements: Dict, provider: str) -> str:
        """生成提示詞 - 統一接口"""
        prompt = self._build_generation_prompt(requirements)

        if provider == 'openai' and self.openai_client:
            return self._generate_with_openai(prompt)
        elif provider == 'gemini' and self.gemini_model:
            return self._generate_with_gemini(prompt)

    def optimize_prompt(self, original: str, provider: str) -> Dict:
        """優化提示詞 - 返回優化版本與建議"""
        optimization_prompt = f"""
        分析以下提示詞的品質,提供:
        1. 優化後的版本
        2. 具體改進建議

        原始提示詞:
        {original}
        """
        # 呼叫 AI 進行分析...
設計優勢:統一接口讓切換 AI 服務只需一行程式碼,呼叫方無需關心底層差異

⚡ AI 優化功能

優化流程

  1. 使用者點擊「優化」按鈕
  2. 發送請求到 /api/optimize
  3. AIService 分析原始提示詞
  4. 返回優化版本與改進建議
  5. 前端展示比對結果

優化面向

  • 結構清晰度
  • 需求完整性
  • 技術可行性
  • 表達精確度
優化結果

📌 本節重點回顧

技術要點
  • 問卷式介面降低使用門檻
  • 樹狀模板結構支援靈活組合
  • AIService 統一抽象多種 API
  • 優化功能持續提升品質
💡
設計思維
  • 引導比自由輸入更有效
  • 結構化資料易於處理
  • 抽象層隔離底層差異
  • 備用方案確保可靠性