Spaces:
Running
Running
| <html lang="zh-TW"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>台北金融壽險業GenAI與LLM整合應用方案</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| .gradient-bg { | |
| background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 50%, #3b82f6 100%); | |
| } | |
| .card-hover:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .animated-underline { | |
| position: relative; | |
| display: inline-block; | |
| } | |
| .animated-underline::after { | |
| content: ''; | |
| position: absolute; | |
| width: 0; | |
| height: 2px; | |
| bottom: 0; | |
| left: 0; | |
| background-color: #3b82f6; | |
| transition: width 0.3s ease; | |
| } | |
| .animated-underline:hover::after { | |
| width: 100%; | |
| } | |
| .ai-pulse { | |
| animation: pulse 2s infinite; | |
| } | |
| @keyframes pulse { | |
| 0% { | |
| box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); | |
| } | |
| 70% { | |
| box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); | |
| } | |
| 100% { | |
| box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); | |
| } | |
| } | |
| .tech-architecture { | |
| background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); | |
| } | |
| .agent-workflow-card { | |
| border-left: 4px solid #3b82f6; | |
| transition: all 0.3s ease; | |
| } | |
| .agent-workflow-card:hover { | |
| transform: translateX(5px); | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans bg-gray-50"> | |
| <!-- 導航欄 --> | |
| <nav class="bg-white shadow-lg sticky top-0 z-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="flex justify-between h-16"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 flex items-center"> | |
| <i class="fas fa-robot text-blue-500 text-2xl mr-2"></i> | |
| <span class="text-xl font-bold text-gray-900">FinAI+ 解決方案</span> | |
| </div> | |
| </div> | |
| <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8"> | |
| <a href="#solutions" class="animated-underline text-gray-900 px-3 py-2 text-sm font-medium">AI解決方案</a> | |
| <a href="#agentic" class="animated-underline text-gray-900 px-3 py-2 text-sm font-medium">Agent工作流</a> | |
| <a href="#mcp" class="animated-underline text-gray-900 px-3 py-2 text-sm font-medium">MCP整合</a> | |
| <a href="#cases" class="animated-underline text-gray-900 px-3 py-2 text-sm font-medium">應用案例</a> | |
| <a href="#contact" class="animated-underline text-gray-900 px-3 py-2 text-sm font-medium">聯繫我們</a> | |
| </div> | |
| <div class="-mr-2 flex items-center md:hidden"> | |
| <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-blue-500" aria-controls="mobile-menu" aria-expanded="false"> | |
| <span class="sr-only">Open main menu</span> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- 英雄區域 --> | |
| <div class="gradient-bg text-white"> | |
| <div class="max-w-7xl mx-auto py-24 px-4 sm:px-6 lg:px-8"> | |
| <div class="lg:grid lg:grid-cols-2 lg:gap-8 items-center"> | |
| <div class="mb-12 lg:mb-0"> | |
| <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl lg:text-6xl mb-6"> | |
| 金融壽險業的<br> | |
| <span class="text-blue-200">GenAI+LLM整合方案</span> | |
| </h1> | |
| <p class="text-xl text-blue-100 mb-8"> | |
| 透過AI Agent工作流與MCP數據整合，實現從智能核保、理賠自動化到個人化推薦的全流程轉型，同時確保資料安全與合規性。 | |
| </p> | |
| <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4"> | |
| <a href="#contact" class="bg-white text-blue-600 hover:bg-blue-50 px-8 py-3 rounded-md text-lg font-semibold text-center transition duration-300"> | |
| 預約諮詢 <i class="fas fa-arrow-right ml-2"></i> | |
| </a> | |
| <a href="#agentic" class="border-2 border-white text-white hover:bg-blue-700 px-8 py-3 rounded-md text-lg font-semibold text-center transition duration-300"> | |
| 了解AI Agent | |
| </a> | |
| </div> | |
| </div> | |
| <div class="relative"> | |
| <div class="relative w-full rounded-xl overflow-hidden shadow-2xl"> | |
| <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="AI金融應用" class="w-full h-auto"> | |
| <div class="absolute inset-0 bg-blue-500 opacity-20"></div> | |
| </div> | |
| <div class="absolute -bottom-6 -right-6 bg-white p-4 rounded-lg shadow-lg"> | |
| <div class="flex items-center"> | |
| <div class="ai-pulse bg-blue-100 p-3 rounded-full mr-3"> | |
| <i class="fas fa-brain text-blue-600 text-xl"></i> | |
| </div> | |
| <div> | |
| <p class="text-sm text-gray-500">AI Agent分析中</p> | |
| <p class="font-bold text-blue-600">理賠效率提升78%</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰與解決方案 --> | |
| <div class="py-16 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| GenAI整合的 | |
| <span class="text-blue-600">挑戰與我們的解決方案</span> | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-500 mx-auto"> | |
| 專為金融壽險業設計的安全合規AI架構 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- 挑戰1 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-red-100 p-3 rounded-lg"> | |
| <i class="fas fa-shield-alt text-red-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">資料安全與隱私</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 金融資料的敏感性要求嚴格的保護措施，避免資料外洩風險。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>台灣本地化數據中心部署</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>端到端加密與匿名化技術</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>符合GDPR與個資法標準</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰2 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-3 rounded-lg"> | |
| <i class="fas fa-check-double text-yellow-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">模型準確性</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| AI輸出需經過嚴格驗證，避免誤導核保與理賠決策。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>多層次驗證機制</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>人類專家覆核流程</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>持續監控與模型更新</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰3 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-purple-100 p-3 rounded-lg"> | |
| <i class="fas fa-balance-scale text-purple-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">監管合規</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 需符合KYC、AML等金融監管要求，確保AI決策可審計。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>內建金管會合規檢查點</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>完整決策紀錄與審計軌跡</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>自動生成監管報告</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰4 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-green-100 p-3 rounded-lg"> | |
| <i class="fas fa-eye text-green-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">可解釋性</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 複雜AI決策需透明化，讓客戶與監管單位理解。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>決策過程視覺化</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>自然語言解釋生成</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>關鍵因素標註與強調</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰5 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-blue-100 p-3 rounded-lg"> | |
| <i class="fas fa-random text-blue-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">系統整合</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 如何與現有IT架構無縫整合，避免數據孤島。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>MCP標準化數據接口</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>模組化部署選項</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>API優先整合策略</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 挑戰6 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-indigo-100 p-3 rounded-lg"> | |
| <i class="fas fa-user-shield text-indigo-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">道德倫理</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 避免AI決策中的偏見與歧視，確保公平性。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">我們的解決方案</h4> | |
| <ul class="space-y-2 text-gray-600"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>偏見檢測與修正機制</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>多元化訓練數據集</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i> | |
| <span>倫理審查委員會監督</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- AI Agent工作流 --> | |
| <div id="agentic" class="py-16 bg-gray-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| <span class="text-blue-600">AI Agent工作流</span> | |
| 如何重塑保險流程 | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-500 mx-auto"> | |
| 透過分工協作的AI Agent系統，實現更智能、更高效的保險服務 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <!-- 核保工作流 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md agent-workflow-card"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-blue-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-file-medical text-blue-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">智能核保工作流</h3> | |
| <p class="text-sm text-gray-500">多Agent協同處理複雜核保流程</p> | |
| </div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-blue-100 p-2 rounded-full mr-3"> | |
| <span class="text-blue-600 font-bold">1</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">數據收集代理人</h4> | |
| <p class="text-sm text-gray-600">收集並驗證客戶健康數據、健保記錄與生活習慣資訊</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-purple-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-purple-100 p-2 rounded-full mr-3"> | |
| <span class="text-purple-600 font-bold">2</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">醫療風險評估代理人</h4> | |
| <p class="text-sm text-gray-600">分析醫療報告與家族病史，評估特定疾病風險</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-green-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-green-100 p-2 rounded-full mr-3"> | |
| <span class="text-green-600 font-bold">3</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">生活風險評估代理人</h4> | |
| <p class="text-sm text-gray-600">分析職業、嗜好與生活型態相關風險</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-yellow-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-2 rounded-full mr-3"> | |
| <span class="text-yellow-600 font-bold">4</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">整合決策代理人</h4> | |
| <p class="text-sm text-gray-600">匯總資訊生成核保報告，標記需人工覆核案件</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-6 bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">效益提升</h4> | |
| <div class="grid grid-cols-2 gap-3"> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">處理時間</p> | |
| <p class="font-bold text-blue-600">-78%</p> | |
| </div> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">準確率</p> | |
| <p class="font-bold text-green-600">+35%</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 理賠工作流 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md agent-workflow-card"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-green-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-hand-holding-usd text-green-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">理賠自動化工作流</h3> | |
| <p class="text-sm text-gray-500">端到端理賠處理的AI Agent協作</p> | |
| </div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-blue-100 p-2 rounded-full mr-3"> | |
| <span class="text-blue-600 font-bold">1</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">文件驗證代理人</h4> | |
| <p class="text-sm text-gray-600">檢查理賠文件完整性與真實性</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-purple-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-purple-100 p-2 rounded-full mr-3"> | |
| <span class="text-purple-600 font-bold">2</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">詐欺偵測代理人</h4> | |
| <p class="text-sm text-gray-600">比對歷史模式與外部資料庫，識別可疑理賠</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-green-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-green-100 p-2 rounded-full mr-3"> | |
| <span class="text-green-600 font-bold">3</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">損失評估代理人</h4> | |
| <p class="text-sm text-gray-600">分析醫療報告/車損照片，計算合理賠付金額</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-yellow-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-2 rounded-full mr-3"> | |
| <span class="text-yellow-600 font-bold">4</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">支付處理代理人</h4> | |
| <p class="text-sm text-gray-600">生成理賠決策，自動化支付流程</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-6 bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">效益提升</h4> | |
| <div class="grid grid-cols-2 gap-3"> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">處理速度</p> | |
| <p class="font-bold text-blue-600">5x</p> | |
| </div> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">詐欺識別</p> | |
| <p class="font-bold text-green-600">92%</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 客戶服務工作流 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md agent-workflow-card"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-purple-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-headset text-purple-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">智能客服工作流</h3> | |
| <p class="text-sm text-gray-500">超越傳統聊天機器人的AI Agent系統</p> | |
| </div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-blue-100 p-2 rounded-full mr-3"> | |
| <span class="text-blue-600 font-bold">1</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">意圖理解代理人</h4> | |
| <p class="text-sm text-gray-600">分析客戶問題，識別真實需求與情緒</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-purple-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-purple-100 p-2 rounded-full mr-3"> | |
| <span class="text-purple-600 font-bold">2</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">知識檢索代理人</h4> | |
| <p class="text-sm text-gray-600">查詢保單條款、理賠規則等專業知識</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-green-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-green-100 p-2 rounded-full mr-3"> | |
| <span class="text-green-600 font-bold">3</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">系統操作代理人</h4> | |
| <p class="text-sm text-gray-600">執行保單查詢、理賠申請等後端操作</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-yellow-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-2 rounded-full mr-3"> | |
| <span class="text-yellow-600 font-bold">4</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">對話管理代理人</h4> | |
| <p class="text-sm text-gray-600">協調多輪對話，確保連貫性與上下文理解</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-6 bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">效益提升</h4> | |
| <div class="grid grid-cols-2 gap-3"> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">解決率</p> | |
| <p class="font-bold text-blue-600">85%</p> | |
| </div> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">滿意度</p> | |
| <p class="font-bold text-green-600">4.8/5</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 投資建議工作流 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md agent-workflow-card"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-red-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-chart-line text-red-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">投資建議工作流</h3> | |
| <p class="text-sm text-gray-500">個人化財務規劃的AI Agent協作</p> | |
| </div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="flex items-start bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-blue-100 p-2 rounded-full mr-3"> | |
| <span class="text-blue-600 font-bold">1</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">客戶分析代理人</h4> | |
| <p class="text-sm text-gray-600">評估風險承受度、財務目標與限制</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-purple-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-purple-100 p-2 rounded-full mr-3"> | |
| <span class="text-purple-600 font-bold">2</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">市場分析代理人</h4> | |
| <p class="text-sm text-gray-600">監控市場趨勢與投資機會</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-green-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-green-100 p-2 rounded-full mr-3"> | |
| <span class="text-green-600 font-bold">3</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">組合建構代理人</h4> | |
| <p class="text-sm text-gray-600">生成符合客戶需求的投資組合</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start bg-yellow-50 p-3 rounded-lg"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-2 rounded-full mr-3"> | |
| <span class="text-yellow-600 font-bold">4</span> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-gray-900">解釋溝通代理人</h4> | |
| <p class="text-sm text-gray-600">生成易理解的建議與風險說明</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-6 bg-gray-50 p-4 rounded-lg"> | |
| <h4 class="font-medium text-blue-600 mb-2">效益提升</h4> | |
| <div class="grid grid-cols-2 gap-3"> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">個人化程度</p> | |
| <p class="font-bold text-blue-600">+40%</p> | |
| </div> | |
| <div class="bg-white p-2 rounded text-center"> | |
| <p class="text-sm text-gray-500">轉化率</p> | |
| <p class="font-bold text-green-600">3x</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- MCP整合 --> | |
| <div id="mcp" class="py-16 tech-architecture text-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold sm:text-4xl"> | |
| <span class="text-blue-400">Model Context Protocol (MCP)</span> | |
| 數據整合框架 | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-300 mx-auto"> | |
| 打破數據孤島，讓AI Agent安全存取所需上下文 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <div> | |
| <h3 class="text-2xl font-bold text-blue-300 mb-6">MCP如何解決金融AI的數據挑戰</h3> | |
| <div class="space-y-6"> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-blue-900 p-2 rounded-full mr-4 mt-1"> | |
| <i class="fas fa-plug text-blue-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-bold text-white mb-2">標準化連接</h4> | |
| <p class="text-gray-300"> | |
| 提供統一接口連接內部系統、外部API與數據源，簡化AI Agent的數據存取 | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-purple-900 p-2 rounded-full mr-4 mt-1"> | |
| <i class="fas fa-lock text-purple-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-bold text-white mb-2">安全治理</h4> | |
| <p class="text-gray-300"> | |
| 精細的存取控制與數據脫敏機制，確保敏感金融數據的安全 | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-green-900 p-2 rounded-full mr-4 mt-1"> | |
| <i class="fas fa-bolt text-green-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-bold text-white mb-2">即時上下文</h4> | |
| <p class="text-gray-300"> | |
| AI Agent可獲取最新市場數據、客戶資訊與監管變更，做出更準確決策 | |
| </p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="flex-shrink-0 bg-yellow-900 p-2 rounded-full mr-4 mt-1"> | |
| <i class="fas fa-project-diagram text-yellow-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="text-lg font-bold text-white mb-2">工作流協調</h4> | |
| <p class="text-gray-300"> | |
| 支持多Agent協同工作，共享上下文而不暴露原始數據 | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="bg-gray-800 p-6 rounded-xl border border-gray-700 h-full"> | |
| <h3 class="text-xl font-bold text-center text-white mb-6">MCP在金融壽險業的典型應用</h3> | |
| <div class="space-y-4"> | |
| <div class="bg-gray-700 p-4 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="bg-blue-900 p-2 rounded-full mr-3"> | |
| <i class="fas fa-user-md text-blue-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-white">核保流程</h4> | |
| <p class="text-sm text-gray-300">連接健保資料庫、醫療影像系統與客戶健康記錄</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700 p-4 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="bg-purple-900 p-2 rounded-full mr-3"> | |
| <i class="fas fa-file-invoice-dollar text-purple-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-white">理賠處理</h4> | |
| <p class="text-sm text-gray-300">整合保單管理系統、詐欺資料庫與支付系統</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700 p-4 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="bg-green-900 p-2 rounded-full mr-3"> | |
| <i class="fas fa-robot text-green-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-white">智能客服</h4> | |
| <p class="text-sm text-gray-300">安全查詢客戶帳戶資訊與產品知識庫</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700 p-4 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="bg-yellow-900 p-2 rounded-full mr-3"> | |
| <i class="fas fa-chart-pie text-yellow-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-white">投資建議</h4> | |
| <p class="text-sm text-gray-300">實時獲取市場數據與客戶投資組合</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700 p-4 rounded-lg"> | |
| <div class="flex items-center"> | |
| <div class="bg-red-900 p-2 rounded-full mr-3"> | |
| <i class="fas fa-gavel text-red-300"></i> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-white">合規監控</h4> | |
| <p class="text-sm text-gray-300">監測法規變更並自動調整業務流程</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- MCP架構圖 --> | |
| <div class="mt-12 bg-gray-800 p-6 rounded-xl border border-gray-700"> | |
| <h3 class="text-xl font-bold text-center text-white mb-6">MCP技術架構圖</h3> | |
| <div class="bg-gray-900 p-4 rounded-lg"> | |
| <div class="flex flex-col items-center"> | |
| <div class="w-full max-w-4xl"> | |
| <!-- 數據源層 --> | |
| <div class="mb-8"> | |
| <h4 class="text-sm font-semibold text-gray-400 mb-3">數據源層</h4> | |
| <div class="grid grid-cols-4 gap-4"> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-gray-700"> | |
| <i class="fas fa-database text-blue-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">內部資料庫</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-gray-700"> | |
| <i class="fas fa-cloud text-purple-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">雲端服務</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-gray-700"> | |
| <i class="fas fa-plug text-green-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">外部API</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-gray-700"> | |
| <i class="fas fa-file-alt text-yellow-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">文件系統</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- MCP核心層 --> | |
| <div class="mb-8"> | |
| <div class="flex justify-center mb-3"> | |
| <div class="bg-blue-900 px-4 py-1 rounded-full"> | |
| <h4 class="text-sm font-semibold text-blue-300">MCP核心層</h4> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-3 gap-4"> | |
| <div class="bg-gray-800 p-3 rounded-lg border border-blue-900"> | |
| <div class="flex items-center mb-2"> | |
| <div class="bg-blue-900 p-2 rounded-full mr-2"> | |
| <i class="fas fa-key text-blue-300 text-sm"></i> | |
| </div> | |
| <h5 class="text-xs font-medium text-white">安全認證</h5> | |
| </div> | |
| <p class="text-xs text-gray-400">OAuth2.0/JWT驗證，角色基礎存取控制</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg border border-blue-900"> | |
| <div class="flex items-center mb-2"> | |
| <div class="bg-blue-900 p-2 rounded-full mr-2"> | |
| <i class="fas fa-exchange-alt text-blue-300 text-sm"></i> | |
| </div> | |
| <h5 class="text-xs font-medium text-white">協議轉換</h5> | |
| </div> | |
| <p class="text-xs text-gray-400">統一REST/gRPC接口，支持多種數據格式</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg border border-blue-900"> | |
| <div class="flex items-center mb-2"> | |
| <div class="bg-blue-900 p-2 rounded-full mr-2"> | |
| <i class="fas fa-mask text-blue-300 text-sm"></i> | |
| </div> | |
| <h5 class="text-xs font-medium text-white">數據脫敏</h5> | |
| </div> | |
| <p class="text-xs text-gray-400">敏感信息過濾，合規性檢查</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- AI Agent層 --> | |
| <div> | |
| <div class="flex justify-center mb-3"> | |
| <div class="bg-purple-900 px-4 py-1 rounded-full"> | |
| <h4 class="text-sm font-semibold text-purple-300">AI Agent應用層</h4> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-4 gap-4"> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-purple-900"> | |
| <i class="fas fa-file-medical text-purple-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">核保Agent</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-purple-900"> | |
| <i class="fas fa-hand-holding-usd text-purple-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">理賠Agent</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-purple-900"> | |
| <i class="fas fa-robot text-purple-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">客服Agent</p> | |
| </div> | |
| <div class="bg-gray-800 p-3 rounded-lg text-center border border-purple-900"> | |
| <i class="fas fa-chart-line text-purple-300 text-2xl mb-2"></i> | |
| <p class="text-xs text-gray-300">投資Agent</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <p class="text-center text-gray-400 mt-6 text-sm"> | |
| <i class="fas fa-shield-alt mr-2"></i>MCP通過金融級加密與審計日誌，確保符合台灣金管會監管要求 | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 解決方案區塊 --> | |
| <div id="solutions" class="py-16 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| 專為金融壽險業設計的 | |
| <span class="text-blue-600">GenAI+LLM整合方案</span> | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-500 mx-auto"> | |
| 結合AI Agent工作流與MCP數據整合，打造新一代智能金融服務 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- 方案1 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-blue-100 p-3 rounded-lg"> | |
| <i class="fas fa-file-medical text-blue-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">智能核保系統</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 多Agent協作分析健康數據與生活習慣，自動生成核保決策，複雜案件標記人工覆核。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>醫療NLP分析病歷與檢查報告</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>MCP整合健保資料庫與穿戴裝置數據</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>可解釋AI生成核保理由</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">處理時間縮短78%，準確率提升35%</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 方案2 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-purple-100 p-3 rounded-lg"> | |
| <i class="fas fa-hand-holding-usd text-purple-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">理賠自動化</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 端到端理賠處理流水線，從文件驗證到支付全自動化，詐欺偵測準確率達92%。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>計算機視覺分析醫療收據與車損照片</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>MCP連接詐欺資料庫與支付系統</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>多Agent協作處理不同理賠類型</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">理賠速度提升5倍，客戶滿意度4.8/5</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 方案3 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-green-100 p-3 rounded-lg"> | |
| <i class="fas fa-robot text-green-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">智能客服</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 超越傳統聊天機器人，理解複雜意圖，執行後端操作，解決率達85%。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>多輪對話管理與上下文理解</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>MCP安全查詢客戶帳戶與保單資料</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>自主啟動理賠申請等服務流程</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">客服成本降低65%，NPS提升25分</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 方案4 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-yellow-100 p-3 rounded-lg"> | |
| <i class="fas fa-chart-line text-yellow-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">個人化投資</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 主動式財務顧問，監控市場變化與客戶目標，提供動態調整建議。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>市場情緒分析與趨勢預測</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>MCP整合多源金融數據</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>風險調整的投資組合優化</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">個人化程度提升40%，轉化率3倍</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 方案5 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-red-100 p-3 rounded-lg"> | |
| <i class="fas fa-file-contract text-red-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">智能合規</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 自動監控法規變更，即時調整業務流程與文件，合規成本降低60%。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>法規變更即時偵測與影響分析</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>保單條款自動合規檢查</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>監管報告自動生成</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">法規調整時間從週縮短至24小時</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 方案6 --> | |
| <div class="bg-white rounded-xl shadow-md overflow-hidden card-hover transition duration-300 border border-gray-200"> | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="flex-shrink-0 bg-indigo-100 p-3 rounded-lg"> | |
| <i class="fas fa-people-arrows text-indigo-600 text-2xl"></i> | |
| </div> | |
| <h3 class="ml-4 text-xl font-bold text-gray-900">代理人助手</h3> | |
| </div> | |
| <p class="text-gray-600 mb-4"> | |
| 業務員的AI夥伴，提供客戶分析、銷售話術與行程管理，提升生產力。 | |
| </p> | |
| <div class="bg-gray-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-medium text-blue-600 mb-2">技術亮點</h4> | |
| <ul class="space-y-2 text-gray-600 text-sm"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>客戶畫像與需求預測</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>情境式銷售對話建議</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-blue-500 text-xs mt-1 mr-2"></i> | |
| <span>業績預測與目標管理</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <div class="flex items-center"> | |
| <i class="fas fa-bolt text-blue-500 mr-2"></i> | |
| <span class="text-sm font-medium">銷售轉化率提升30%，工作時間節省20%</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 應用案例 --> | |
| <div id="cases" class="py-16 bg-gray-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| 台北金融壽險業 | |
| <span class="text-blue-600">GenAI 成功案例</span> | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-500 mx-auto"> | |
| 實際應用場景與量化成果展示 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-8"> | |
| <!-- 案例1 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-blue-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-hospital-user text-blue-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">醫療險智能核保系統</h3> | |
| <p class="text-sm text-gray-500">某大型壽險公司台北分公司</p> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-gray-600"> | |
| 應用GenAI自動分析醫療收據與診斷書，結合健保資料庫比對，大幅提升核保效率與準確度。系統能自動識別異常投保模式，降低逆選擇風險。 | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-blue-50 p-4 rounded-lg"> | |
| <p class="text-sm text-blue-600 font-medium">核保處理時間</p> | |
| <p class="text-2xl font-bold text-gray-900">-78%</p> | |
| <p class="text-xs text-gray-500">從5.2天降至1.1天</p> | |
| </div> | |
| <div class="bg-green-50 p-4 rounded-lg"> | |
| <p class="text-sm text-green-600 font-medium">風險識別率</p> | |
| <p class="text-2xl font-bold text-gray-900">+42%</p> | |
| <p class="text-xs text-gray-500">準確識別高風險投保</p> | |
| </div> | |
| </div> | |
| <div class="mt-4 bg-gray-50 p-3 rounded-lg"> | |
| <h4 class="text-sm font-medium text-blue-600 mb-1">技術架構</h4> | |
| <p class="text-xs text-gray-600"> | |
| <span class="font-medium">Dify</span> 開發核保問答系統 + | |
| <span class="font-medium">n8n</span> 同步核保結論至理賠系統 + | |
| <span class="font-medium">MCP</span> 整合健保資料 | |
| </p> | |
| </div> | |
| </div> | |
| <!-- 案例2 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-purple-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-robot text-purple-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">智能客服轉型</h3> | |
| <p class="text-sm text-gray-500">某外商壽險台灣總部</p> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-gray-600"> | |
| 部署多語言GenAI客服系統，支援國台英語言，處理80%常見諮詢，並能自主啟動理賠申請流程，大幅提升客戶體驗。 | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-purple-50 p-4 rounded-lg"> | |
| <p class="text-sm text-purple-600 font-medium">客服成本</p> | |
| <p class="text-2xl font-bold text-gray-900">-65%</p> | |
| <p class="text-xs text-gray-500">年度節省$12M</p> | |
| </div> | |
| <div class="bg-yellow-50 p-4 rounded-lg"> | |
| <p class="text-sm text-yellow-600 font-medium">客戶滿意度</p> | |
| <p class="text-2xl font-bold text-gray-900">4.8/5</p> | |
| <p class="text-xs text-gray-500">提升1.2分</p> | |
| </div> | |
| </div> | |
| <div class="mt-4 bg-gray-50 p-3 rounded-lg"> | |
| <h4 class="text-sm font-medium text-blue-600 mb-1">技術架構</h4> | |
| <p class="text-xs text-gray-600"> | |
| <span class="font-medium">AI Agent</span> 多輪對話管理 + | |
| <span class="font-medium">MCP</span> 查詢保單資料 + | |
| <span class="font-medium">n8n</span> 啟動後端流程 | |
| </p> | |
| </div> | |
| </div> | |
| <!-- 案例3 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-green-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-dna text-green-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">基因檢測保險方案</h3> | |
| <p class="text-sm text-gray-500">某本土壽險創新部門</p> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-gray-600"> | |
| 利用GenAI分析基因檢測數據與生活習慣，開發個人化保單與健康管理方案，創造新市場並降低理賠率。 | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-green-50 p-4 rounded-lg"> | |
| <p class="text-sm text-green-600 font-medium">新客戶獲取</p> | |
| <p class="text-2xl font-bold text-gray-900">+230%</p> | |
| <p class="text-xs text-gray-500">相較傳統產品</p> | |
| </div> | |
| <div class="bg-blue-50 p-4 rounded-lg"> | |
| <p class="text-sm text-blue-600 font-medium">理賠率</p> | |
| <p class="text-2xl font-bold text-gray-900">-35%</p> | |
| <p class="text-xs text-gray-500">健康介入效果</p> | |
| </div> | |
| </div> | |
| <div class="mt-4 bg-gray-50 p-3 rounded-lg"> | |
| <h4 class="text-sm font-medium text-blue-600 mb-1">技術架構</h4> | |
| <p class="text-xs text-gray-600"> | |
| <span class="font-medium">Dify</span> 健康風險評估 + | |
| <span class="font-medium">AI Agent</span> 長期監控 + | |
| <span class="font-medium">MCP</span> 整合穿戴裝置數據 | |
| </p> | |
| </div> | |
| </div> | |
| <!-- 案例4 --> | |
| <div class="bg-white p-6 rounded-xl shadow-md"> | |
| <div class="flex items-start mb-6"> | |
| <div class="flex-shrink-0 bg-red-100 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-shield-alt text-red-600 text-2xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold text-gray-900">智能合規系統</h3> | |
| <p class="text-sm text-gray-500">某金控旗下壽險公司</p> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <p class="text-gray-600"> | |
| GenAI即時監控法規變更並自動調整保單條款與銷售流程，確保100%合規性，降低監管風險。 | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-red-50 p-4 rounded-lg"> | |
| <p class="text-sm text-red-600 font-medium">合規成本</p> | |
| <p class="text-2xl font-bold text-gray-900">-60%</p> | |
| <p class="text-xs text-gray-500">法遵人力需求</p> | |
| </div> | |
| <div class="bg-indigo-50 p-4 rounded-lg"> | |
| <p class="text-sm text-indigo-600 font-medium">調整速度</p> | |
| <p class="text-2xl font-bold text-gray-900">24hr</p> | |
| <p class="text-xs text-gray-500">法規生效後</p> | |
| </div> | |
| </div> | |
| <div class="mt-4 bg-gray-50 p-3 rounded-lg"> | |
| <h4 class="text-sm font-medium text-blue-600 mb-1">技術架構</h4> | |
| <p class="text-xs text-gray-600"> | |
| <span class="font-medium">AI Agent</span> 法規監測 + | |
| <span class="font-medium">MCP</span> 連接監管資料源 + | |
| <span class="font-medium">n8n</span> 自動化流程調整 | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 效益分析 --> | |
| <div class="py-16 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"> | |
| GenAI+LLM為金融壽險業帶來的 | |
| <span class="text-blue-600">轉型效益</span> | |
| </h2> | |
| <p class="mt-4 max-w-2xl text-xl text-gray-500 mx-auto"> | |
| 量化與質化的全方位價值提升 | |
| </p> | |
| </div> | |
| <div class="grid md:grid-cols-3 gap-8"> | |
| <!-- 效益1 --> | |
| <div class="bg-gray-50 p-6 rounded-xl"> | |
| <div class="flex justify-center mb-4"> | |
| <div class="bg-blue-100 p-4 rounded-full"> | |
| <i class="fas fa-money-bill-wave text-blue-600 text-2xl"></i> | |
| </div> | |
| </div> | |
| <h3 class="text-xl font-bold | |
| </html> |