# Deepseek作图提示词 ## 主标题页面 创建一个现代科技风格的PPT封面，深蓝色渐变背景，标题"智能知识服务三大支柱"使用白色粗体字，副标题"构建数据-知识-智能-决策闭环，智能知识服务是战略基础设施"使用较小的白色字体。背景添加抽象的数字化元素、光线效果和几何图形，体现科技感和智能化特征。整体布局简洁大气，符合企业级演示标准。 ## 三大支柱概览图 设计一个三柱式结构图，深蓝色背景，三根白色柱子从底部向上延伸，每根柱子上方有白色向上箭头。从左到右分别标注： 第一根柱子："1. 数据资产构建" - 下方详细说明"结构化+非结构化多源数据治理，行业级定向采集，7×24小时自动更新与质量监控" 第二根柱子："2. 智能认知引擎" - 下方说明"私有大模型适配与训练，文档理解+语义分析+规则表达，多模态融合：文本、图表、知识图谱" 第三根柱子："3. 场景化智能体应用" - 下方说明"合规中枢、科研顾问、商业洞察等智能Agent，充实强工作自动化，所见式交互能力（实体、判断、行动）" 在三根柱子之间用虚线连接，体现相互支撑的关系。 ## 数据资产构建详细页 创建一个数据流程图，显示从"数据孤岛"到"系统知识资产"的转化过程。左侧展示分散的数据源（文档、数据库、系统等），中间是处理流程（包含数据整合、知识图谱构建、语义标准化等步骤），右侧是结构化的知识资产库。使用蓝色调配色方案，添加数据流动的箭头和连接线，突出转化过程的系统性和专业性。 ## 智能认知引擎详细页 设计一个大脑形状的智能处理中心图，中央是大脑轮廓，周围环绕着不同的处理能力模块：语义理解、文档解析、关联推理、个性化推荐等。用不同颜色的连接线表示信息流向，体现AI的学习和推理过程。背景使用深蓝到浅蓝的渐变，营造智能科技氛围。 ## 场景化智能体应用详细页 创建一个中央控制台式的界面设计，中心是一个圆形的决策中枢，周围分布着不同类型的智能体：战略分析师Agent、科研顾问Agent、商业洞察Agent等。每个Agent用不同的图标表示，通过彩色连接线与中央决策中枢相连。整体采用深色背景配亮色元素，体现决策中心的专业性和权威性。 ## 实施效果对比图 制作一个前后对比的信息图表，左侧展示传统模式（数据分散、效率低下、决策滞后），右侧展示智能化模式（数据整合、智能分析、快速决策）。使用图表、数字和百分比来量化改进效果，如"知识利用效率提升3倍"、"决策响应速度提升5倍"等。配色使用对比鲜明的红色（传统模式）和绿色/蓝色（智能模式）。 ## 技术架构图 绘制一个四层架构图，从下到上分别是：基础设施层（云原生架构）、数据层（数据湖+知识图谱）、算法层（大模型+专业算法库）、应用层（智能体+可视化界面）。每层用不同深度的蓝色表示，层间用双向箭头连接，体现数据和信息的双向流动。整体呈现立体层次感和技术专业性。 - Initial Deployment
052dc5c verified | <html lang="zh-CN"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Deepseek智能知识服务</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| deepblue: { | |
| 100: '#cce8ff', | |
| 200: '#99d1ff', | |
| 300: '#66baff', | |
| 400: '#3393ff', | |
| 500: '#007cff', | |
| 600: '#0064cc', | |
| 700: '#004c99', | |
| 800: '#003466', | |
| 900: '#001c33' | |
| }, | |
| teal: { | |
| 500: '#20c9c9', | |
| 600: '#0ea5a5' | |
| } | |
| }, | |
| animation: { | |
| 'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite', | |
| 'float': 'float 6s ease-in-out infinite', | |
| 'light-ray': 'lightRay 5s linear infinite' | |
| }, | |
| keyframes: { | |
| float: { | |
| '0%, 100%': { transform: 'translateY(0)' }, | |
| '50%': { transform: 'translateY(-15px)' } | |
| }, | |
| lightRay: { | |
| '0%': { backgroundPosition: '0 0' }, | |
| '100%': { backgroundPosition: '100% 100%' } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700;900&display=swap'); | |
| body { | |
| font-family: 'Noto Sans SC', sans-serif; | |
| background: linear-gradient(135deg, #001c33 0%, #003466 100%); | |
| color: white; | |
| scroll-behavior: smooth; | |
| } | |
| .digital-bg { | |
| background: | |
| radial-gradient(circle at 10% 20%, rgba(0, 92, 175, 0.4) 0%, transparent 25%), | |
| radial-gradient(circle at 90% 80%, rgba(0, 131, 255, 0.3) 0%, transparent 30%), | |
| radial-gradient(circle at 50% 50%, rgba(0, 60, 120, 0.6) 0%, transparent 50%), | |
| linear-gradient(135deg, #001c33 0%, #003466 100%); | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .digital-bg::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: | |
| linear-gradient(45deg, | |
| rgba(0, 131, 255, 0.1) 25%, | |
| transparent 25%, | |
| transparent 75%, | |
| rgba(0, 131, 255, 0.1) 75%), | |
| linear-gradient(45deg, | |
| rgba(0, 131, 255, 0.1) 25%, | |
| transparent 25%, | |
| transparent 75%, | |
| rgba(0, 131, 255, 0.1) 75%); | |
| background-size: 60px 60px; | |
| background-position: 0 0, 30px 30px; | |
| z-index: 0; | |
| } | |
| .pillar { | |
| position: relative; | |
| animation: float 6s ease-in-out infinite; | |
| transition: all 0.3s ease; | |
| } | |
| .pillar::before { | |
| content: ''; | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| top: 0; | |
| left: 0; | |
| background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.1)); | |
| clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%); | |
| border-radius: 10px; | |
| z-index: -1; | |
| } | |
| .light-ray { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: linear-gradient(135deg, | |
| rgba(255,255,255,0) 0%, | |
| rgba(255,255,255,0.15) 25%, | |
| rgba(255,255,255,0) 50%, | |
| rgba(255,255,255,0.15) 75%, | |
| rgba(255,255,255,0) 100%); | |
| z-index: 1; | |
| animation: lightRay 5s linear infinite; | |
| background-size: 300% 300%; | |
| } | |
| .brain-node { | |
| position: absolute; | |
| background: linear-gradient(145deg, rgba(32,201,201,0.9), rgba(0,123,255,0.9)); | |
| width: 70px; | |
| height: 70px; | |
| border-radius: 50%; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| color: white; | |
| font-weight: bold; | |
| box-shadow: 0 0 15px rgba(0, 195, 255, 0.7); | |
| z-index: 10; | |
| } | |
| .architecture-layer { | |
| transition: all 0.3s ease; | |
| box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3); | |
| } | |
| .architecture-layer:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.4); | |
| } | |
| .comparison-card { | |
| transition: all 0.3s ease; | |
| box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2); | |
| overflow: hidden; | |
| position: relative; | |
| } | |
| .comparison-card::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 5px; | |
| } | |
| .traditional::before { | |
| background: linear-gradient(90deg, #f56565, #e53e3e); | |
| } | |
| .intelligent::before { | |
| background: linear-gradient(90deg, #0ea5a5, #047481); | |
| } | |
| @media (max-width: 768px) { | |
| .brain-node { | |
| width: 50px; | |
| height: 50px; | |
| font-size: 0.7rem; | |
| } | |
| .three-pillars { | |
| flex-direction: column; | |
| align-items: center; | |
| } | |
| .pillar { | |
| width: 90%; | |
| margin-bottom: 2rem; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body class="min-h-screen relative"> | |
| <!-- Navigation --> | |
| <nav class="fixed top-0 left-0 right-0 z-50 bg-black/70 backdrop-blur-lg py-4"> | |
| <div class="container mx-auto px-4 flex justify-between items-center"> | |
| <div class="flex items-center space-x-2"> | |
| <div class="w-10 h-10 rounded-full bg-gradient-to-r from-teal-500 to-blue-600 flex items-center justify-center"> | |
| <i class="fas fa-brain text-white"></i> | |
| </div> | |
| <span class="text-xl font-bold text-white">Deepseek AI</span> | |
| </div> | |
| <ul class="hidden md:flex space-x-8 text-sm"> | |
| <li><a href="#overview" class="text-white hover:text-teal-300">三大支柱</a></li> | |
| <li><a href="#data" class="text-white hover:text-teal-300">数据资产</a></li> | |
| <li><a href="#cognitive" class="text-white hover:text-teal-300">智能认知</a></li> | |
| <li><a href="#agents" class="text-white hover:text-teal-300">智能体应用</a></li> | |
| <li><a href="#comparison" class="text-white hover:text-teal-300">实施效果</a></li> | |
| <li><a href="#architecture" class="text-white hover:text-teal-300">技术架构</a></li> | |
| </ul> | |
| <button class="md:hidden text-white text-xl"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </nav> | |
| <!-- Main Cover --> | |
| <section class="digital-bg min-h-screen flex items-center justify-center relative overflow-hidden"> | |
| <div class="light-ray"></div> | |
| <div class="absolute top-0 left-0 w-full h-full overflow-hidden"> | |
| <div class="absolute top-20 left-10 w-4 h-4 rounded-full bg-blue-400 shadow-xl"></div> | |
| <div class="absolute top-40 right-20 w-6 h-6 rounded-full bg-teal-500 shadow-2xl"></div> | |
| <div class="absolute bottom-1/4 left-1/3 w-8 h-8 rounded-full bg-blue-300 shadow-2xl"></div> | |
| <div class="absolute bottom-1/3 right-1/4 w-5 h-5 rounded-full bg-cyan-300 shadow-xl"></div> | |
| </div> | |
| <div class="container mx-auto px-4 z-10 text-center relative"> | |
| <div class="text-6xl md:text-8xl font-black mb-6 text-white"> | |
| <span class="bg-clip-text text-transparent bg-gradient-to-r from-white via-teal-200 to-white"> | |
| 智能知识服务三大支柱 | |
| </span> | |
| </div> | |
| <p class="text-xl md:text-2xl max-w-3xl mx-auto text-white/90 leading-relaxed"> | |
| 构建数据-知识-智能-决策闭环，智能知识服务是战略基础设施 | |
| </p> | |
| <div class="mt-16 flex justify-center space-x-4"> | |
| <a href="#overview" class="px-8 py-3 bg-gradient-to-r from-teal-500 to-blue-600 rounded-full text-white font-medium shadow-lg hover:shadow-xl transition-shadow"> | |
| 探索三大支柱 | |
| </a> | |
| <a href="#architecture" class="px-8 py-3 bg-white/20 backdrop-blur-sm border border-white/30 rounded-full text-white font-medium hover:bg-white/30 transition"> | |
| 查看技术架构 | |
| </a> | |
| </div> | |
| </div> | |
| <div class="absolute bottom-0 left-0 right-0 h-16 flex justify-center items-center"> | |
| <a href="#overview" class="text-white text-2xl animate-bounce"> | |
| <i class="fas fa-chevron-down"></i> | |
| </a> | |
| </div> | |
| </section> | |
| <!-- Three Pillars Overview --> | |
| <section id="overview" class="py-20 bg-gradient-to-b from-deepblue-800 to-deepblue-900 relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative"> | |
| <h2 class="text-4xl md:text-5xl font-bold text-center mb-16 text-white">智能知识服务三大支柱</h2> | |
| <div class="three-pillars flex justify-center gap-8 md:gap-16 relative z-10"> | |
| <!-- Pillar 1 --> | |
| <div class="pillar" style="animation-delay: 0s;"> | |
| <div class="w-20 md:w-24 h-64 md:h-72 bg-gradient-to-b from-white to-gray-100 mx-auto rounded-md shadow-2xl flex flex-col items-center justify-end"> | |
| <div class="mb-8"> | |
| <i class="fas fa-database text-4xl text-blue-600"></i> | |
| </div> | |
| <div class="w-0 h-0 border-l-[20px] border-l-transparent border-r-[20px] border-r-transparent border-b-[40px] border-b-white transform -translate-y-1"></div> | |
| </div> | |
| <div class="mt-8 text-center px-4"> | |
| <div class="text-xl md:text-2xl font-bold mb-2">1. 数据资产构建</div> | |
| <div class="text-sm md:text-base text-gray-200 leading-relaxed"> | |
| 结构化+非结构化多源数据治理，行业级定向采集，7×24小时自动更新与质量监控 | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Pillar 2 --> | |
| <div class="pillar" style="animation-delay: 1s;"> | |
| <div class="w-20 md:w-24 h-72 md:h-80 bg-gradient-to-b from-white to-gray-100 mx-auto rounded-md shadow-2xl flex flex-col items-center justify-end"> | |
| <div class="mb-8"> | |
| <i class="fas fa-microchip text-4xl text-teal-500"></i> | |
| </div> | |
| <div class="w-0 h-0 border-l-[20px] border-l-transparent border-r-[20px] border-r-transparent border-b-[40px] border-b-white transform -translate-y-1"></div> | |
| </div> | |
| <div class="mt-8 text-center px-4"> | |
| <div class="text-xl md:text-2xl font-bold mb-2">2. 智能认知引擎</div> | |
| <div class="text-sm md:text-base text-gray-200 leading-relaxed"> | |
| 私有大模型适配与训练，文档理解+语义分析+规则表达，多模态融合：文本、图表、知识图谱 | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Pillar 3 --> | |
| <div class="pillar" style="animation-delay: 2s;"> | |
| <div class="w-20 md:w-24 h-64 md:h-72 bg-gradient-to-b from-white to-gray-100 mx-auto rounded-md shadow-2xl flex flex-col items-center justify-end"> | |
| <div class="mb-8"> | |
| <i class="fas fa-robot text-4xl text-indigo-400"></i> | |
| </div> | |
| <div class="w-0 h-0 border-l-[20px] border-l-transparent border-r-[20px] border-r-transparent border-b-[40px] border-b-white transform -translate-y-1"></div> | |
| </div> | |
| <div class="mt-8 text-center px-4"> | |
| <div class="text-xl md:text-2xl font-bold mb-2">3. 场景化智能体应用</div> | |
| <div class="text-sm md:text-base text-gray-200 leading-relaxed"> | |
| 合规中枢、科研顾问、商业洞察等智能Agent，充实强工作自动化，所见式交互能力 | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Connection lines --> | |
| <div class="hidden md:block"> | |
| <div class="absolute top-1/3 left-1/4 right-1/4 h-0.5 bg-white/30"></div> | |
| <div class="absolute top-1/3 left-1/4 w-1/4 flex justify-between"> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| </div> | |
| <div class="absolute top-1/3 right-1/4 w-1/4 flex justify-between"> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| <div class="w-2 h-2 rounded-full bg-teal-400"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Data Assets Detail --> | |
| <section id="data" class="py-20 bg-gradient-to-b from-deepblue-900 to-deepblue-800 relative overflow-hidden"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-4xl font-bold text-center mb-16 text-white">数据资产构建</h2> | |
| <div class="max-w-6xl mx-auto"> | |
| <div class="data-flow flex flex-col md:flex-row items-center justify-between"> | |
| <!-- Left: Data Sources --> | |
| <div class="w-full md:w-1/4 mb-10 md:mb-0"> | |
| <div class="text-center mb-6"> | |
| <div class="text-2xl font-bold text-teal-300 mb-4">数据源</div> | |
| <div class="inline-block bg-gradient-to-br from-deepblue-700 to-deepblue-800 p-6 rounded-2xl shadow-xl border border-white/10"> | |
| <div class="text-white/80 mb-4">数据孤岛</div> | |
| <div class="space-y-4"> | |
| <div class="bg-white/10 p-3 rounded-lg"> | |
| <i class="fas fa-file-alt text-blue-400 mr-2"></i> | |
| <span>文档数据</span> | |
| </div> | |
| <div class="bg-white/10 p-3 rounded-lg"> | |
| <i class="fas fa-server text-purple-400 mr-2"></i> | |
| <span>数据库</span> | |
| </div> | |
| <div class="bg-white/10 p-3 rounded-lg"> | |
| <i class="fas fa-network-wired text-teal-400 mr-2"></i> | |
| <span>系统数据</span> | |
| </div> | |
| <div class="bg-white/10 p-3 rounded-lg"> | |
| <i class="fas fa-cloud text-blue-300 mr-2"></i> | |
| <span>云存储</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Middle: Processing --> | |
| <div class="w-full md:w-2/4 mb-10 md:mb-0"> | |
| <div class="text-center mb-16"> | |
| <div class="text-2xl font-bold text-amber-300 mb-6">数据处理流程</div> | |
| <div class="flex flex-col items-center space-y-4"> | |
| <div class="bg-gradient-to-r from-teal-500 to-blue-600 p-4 rounded-xl w-48 shadow-lg"> | |
| 数据整合 | |
| </div> | |
| <div class="text-white text-2xl animate-pulse-slow"> | |
| <i class="fas fa-arrow-down"></i> | |
| </div> | |
| <div class="bg-gradient-to-r from-amber-500 to-orange-500 p-4 rounded-xl w-48 shadow-lg"> | |
| 知识图谱构建 | |
| </div> | |
| <div class="text-white text-2xl animate-pulse-slow"> | |
| <i class="fas fa-arrow-down"></i> | |
| </div> | |
| <div class="bg-gradient-to-r from-purple-500 to-indigo-600 p-4 rounded-xl w-48 shadow-lg"> | |
| 语义标准化 | |
| </div> | |
| <div class="text-white text-2xl animate-pulse-slow"> | |
| <i class="fas fa-arrow-down"></i> | |
| </div> | |
| <div class="bg-gradient-to-r from-green-500 to-emerald-600 p-4 rounded-xl w-48 shadow-lg"> | |
| 质量监控 | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Right: Structured Assets --> | |
| <div class="w-full md:w-1/4"> | |
| <div class="text-center"> | |
| <div class="text-2xl font-bold text-green-300 mb-4">知识资产</div> | |
| <div class="inline-block bg-gradient-to-tr from-deepblue-600 to-teal-900 p-6 rounded-2xl shadow-xl border border-teal-500/30"> | |
| <div class="text-white/90 mb-4">系统知识资产</div> | |
| <div class="space-y-3"> | |
| <div class="bg-teal-900/50 p-2 rounded-lg text-sm text-left"> | |
| <i class="fas fa-project-diagram text-green-400 mr-2"></i> | |
| <span>结构化知识库</span> | |
| </div> | |
| <div class="bg-teal-900/50 p-2 rounded-lg text-sm text-left"> | |
| <i class="fas fa-sitemap text-green-400 mr-2"></i> | |
| <span>行业知识图谱</span> | |
| </div> | |
| <div class="bg-teal-900/50 p-2 rounded-lg text-sm text-left"> | |
| <i class="fas fa-search text-green-400 mr-2"></i> | |
| <span>智能检索系统</span> | |
| </div> | |
| <div class="bg-teal-900/50 p-2 rounded-lg text-sm text-left"> | |
| <i class="fas fa-bell text-green-400 mr-2"></i> | |
| <span>实时更新机制</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Flow Arrows --> | |
| <div class="hidden md:flex justify-between items-center absolute left-1/4 right-1/4 top-1/2 transform -translate-y-1/2"> | |
| <div class="text-3xl animate-pulse text-blue-400"> | |
| <i class="fas fa-long-arrow-alt-right"></i> | |
| </div> | |
| <div class="text-3xl animate-pulse text-amber-400"> | |
| <i class="fas fa-long-arrow-alt-right"></i> | |
| </div> | |
| <div class="text-3xl animate-pulse text-purple-400"> | |
| <i class="fas fa-long-arrow-alt-right"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Cognitive Engine Detail --> | |
| <section id="cognitive" class="py-20 bg-gradient-to-b from-deepblue-800 to-deepblue-900 relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative"> | |
| <h2 class="text-4xl font-bold text-center mb-16 text-white">智能认知引擎</h2> | |
| <div class="max-w-4xl mx-auto"> | |
| <div class="brain-diagram flex justify-center relative"> | |
| <!-- Brain Background --> | |
| <div class="w-72 h-72 bg-gradient-to-tr from-blue-900 to-teal-800 rounded-full flex items-center justify-center shadow-2xl"> | |
| <div class="w-64 h-64 bg-gradient-to-br from-blue-700 to-teal-800 rounded-full flex items-center justify-center relative overflow-hidden"> | |
| <!-- Neural network lines --> | |
| <div class="absolute w-full h-full"> | |
| <div class="line-connector" style="top: 20%; left: 15%; width: 50px; height: 60px; transform: rotate(45deg);"></div> | |
| <div class="line-connector" style="top: 30%; left: 70%; width: 40px; height: 50px; transform: rotate(120deg);"></div> | |
| <div class="line-connector" style="top: 65%; left: 25%; width: 70px; height: 40px; transform: rotate(75deg);"></div> | |
| </div> | |
| <div class="absolute w-full h-full"> | |
| <div class="w-3 h-3 rounded-full bg-white/20 absolute" style="top: 30%; left: 40%;"></div> | |
| <div class="w-3 h-3 rounded-full bg-white/20 absolute" style="top: 50%; left: 30%;"></div> | |
| <div class="w-3 h-3 rounded-full bg-white/20 absolute" style="top: 70%; left: 60%;"></div> | |
| <div class="w-3 h-3 rounded-full bg-white/20 absolute" style="top: 40%; left: 70%;"></div> | |
| </div> | |
| <div class="text-white text-xl font-bold z-10">AI认知中心</div> | |
| </div> | |
| </div> | |
| <!-- Nodes --> | |
| <div class="brain-node" style="top: 15%; left: 15%;"> | |
| <span class="text-xs text-center">语义理解</span> | |
| </div> | |
| <div class="brain-node" style="top: 15%; left: 75%;"> | |
| <span class="text-xs text-center">文档解析</span> | |
| </div> | |
| <div class="brain-node" style="top: 50%; left: 10%;"> | |
| <span class="text-xs text-center">关联推理</span> | |
| </div> | |
| <div class="brain-node" style="top: 50%; left: 80%;"> | |
| <span class="text-xs text-center">智能推荐</span> | |
| </div> | |
| <div class="brain-node" style="top: 85%; left: 25%;"> | |
| <span class="text-xs text-center">规则学习</span> | |
| </div> | |
| <div class="brain-node" style="top: 85%; left: 65%;"> | |
| <span class="text-xs text-center">知识抽取</span> | |
| </div> | |
| <div class="brain-node" style="top: 35%; left: 45%;"> | |
| <span class="text-xs text-center">多模态分析</span> | |
| </div> | |
| </div> | |
| <div class="mt-20 grid grid-cols-2 md:grid-cols-4 gap-6"> | |
| <div class="bg-white/5 p-6 rounded-xl border border-white/10 hover:border-teal-500/50 transition"> | |
| <div class="w-16 h-16 rounded-full bg-teal-700/30 flex items-center justify-center text-2xl mb-4"> | |
| <i class="fas fa-language text-teal-300"></i> | |
| </div> | |
| <div class="font-bold text-lg text-white mb-2">自然语言处理</div> | |
| <div class="text-sm text-gray-300">理解上下文，提取实体关系和语义内容</div> | |
| </div> | |
| <div class="bg-white/5 p-6 rounded-xl border border-white/10 hover:border-teal-500/50 transition"> | |
| <div class="w-16 h-16 rounded-full bg-blue-700/30 flex items-center justify-center text-2xl mb-4"> | |
| <i class="fas fa-file-invoice text-blue-300"></i> | |
| </div> | |
| <div class="font-bold text-lg text-white mb-2">文档智能解析</div> | |
| <div class="text-sm text-gray-300">处理PDF、图像、表格等多格式文档信息</div> | |
| </div> | |
| <div class="bg-white/5 p-6 rounded-xl border border-white/10 hover:border-teal-500/50 transition"> | |
| <div class="w-16 h-16 rounded-full bg-purple-700/30 flex items-center justify-center text-2xl mb-4"> | |
| <i class="fas fa-project-diagram text-purple-300"></i> | |
| </div> | |
| <div class="font-bold text-lg text-white mb-2">知识图谱</div> | |
| <div class="text-sm text-gray-300">构建实体关系网络，实现知识推理</div> | |
| </div> | |
| <div class="bg-white/5 p-6 rounded-xl border border-white/10 hover:border-teal-500/50 transition"> | |
| <div class="w-16 h-16 rounded-full bg-indigo-700/30 flex items-center justify-center text-2xl mb-4"> | |
| <i class="fas fa-robot text-indigo-300"></i> | |
| </div> | |
| <div class="font-bold text-lg text-white mb-2">持续学习</div> | |
| <div class="text-sm text-gray-300">通过用户反馈和新增数据不断优化模型</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Scene Application --> | |
| <section id="agents" class="py-20 bg-gradient-to-b from-deepblue-900 to-deepblue-800 relative overflow-hidden"> | |
| <div class="container mx-auto px-4 relative"> | |
| <h2 class="text-4xl font-bold text-center mb-16 text-white">场景化智能体应用</h2> | |
| <div class="max-w-5xl mx-auto"> | |
| <div class="control-center flex justify-center relative mb-20"> | |
| <!-- Center Console --> | |
| <div class="w-48 h-48 rounded-full bg-gradient-to-br from-deepblue-700 to-deepblue-900 border border-white/20 shadow-2xl flex items-center justify-center"> | |
| <div class="w-40 h-40 rounded-full bg-gradient-to-tr from-teal-600/70 to-teal-900/50 border border-teal-500/30 flex items-center justify-center"> | |
| <div class="text-center"> | |
| <div class="text-white text-xl font-bold">决策中枢</div> | |
| <div class="text-teal-300 text-sm">AI智能协调</div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Agents --> | |
| <div class="agent absolute" style="top: 0; left: 50%; transform: translateX(-50%);"> | |
| <div class="agent-card"> | |
| <div class="bg-indigo-900/70 border border-indigo-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-indigo-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-balance-scale text-indigo-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">合规中枢</div> | |
| <div class="text-xs text-indigo-200">风险识别与管理</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="agent absolute" style="top: 35%; right: 10%;"> | |
| <div class="agent-card"> | |
| <div class="bg-blue-900/70 border border-blue-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-blue-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-flask text-blue-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">科研顾问</div> | |
| <div class="text-xs text-blue-200">文献分析·实验设计</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="agent absolute" style="top: 35%; left: 10%;"> | |
| <div class="agent-card"> | |
| <div class="bg-amber-900/70 border border-amber-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-amber-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-chart-line text-amber-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">商业洞察</div> | |
| <div class="text-xs text-amber-200">趋势预测·市场分析</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="agent absolute" style="bottom: 0; left: 50%; transform: translateX(-50%);"> | |
| <div class="agent-card"> | |
| <div class="bg-emerald-900/70 border border-emerald-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-emerald-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-cogs text-emerald-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">流程自动化</div> | |
| <div class="text-xs text-emerald-200">工作流自动化处理</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="agent absolute" style="top: 70%; left: 20%;"> | |
| <div class="agent-card"> | |
| <div class="bg-rose-900/70 border border-rose-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-rose-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-user-friends text-rose-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">客户服务</div> | |
| <div class="text-xs text-rose-200">智能咨询·交互系统</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="agent absolute" style="top: 70%; right: 20%;"> | |
| <div class="agent-card"> | |
| <div class="bg-purple-900/70 border border-purple-500/30 py-4 px-6 rounded-2xl flex items-center shadow-lg"> | |
| <div class="w-10 h-10 rounded-full bg-purple-700 flex items-center justify-center mr-4"> | |
| <i class="fas fa-file-contract text-purple-300"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-white">合同分析</div> | |
| <div class="text-xs text-purple-200">条款识别·风险预警</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Connection Lines --> | |
| <div class="hidden md:block"> | |
| <svg class="absolute top-0 left-0 w-full h-full pointer-events-none"> | |
| <line x1="50%" y1="30%" x2="50%" y2="15%" stroke="rgba(59, 130, 246, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| <line x1="50%" y1="35%" x2="70%" y2="40%" stroke="rgba(16, 185, 129, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| <line x1="50%" y1="35%" x2="30%" y2="40%" stroke="rgba(245, 158, 11, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| <line x1="50%" y1="65%" x2="50%" y2="85%" stroke="rgba(5, 150, 105, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| <line x1="50%" y1="60%" x2="40%" y2="75%" stroke="rgba(244, 63, 94, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| <line x1="50%" y1="60%" x2="60%" y2="75%" stroke="rgba(139, 92, 246, 0.6)" stroke-width="2" stroke-dasharray="4"></line> | |
| </svg> | |
| </div> | |
| <div class="text-center mt-16"> | |
| <p class="text-xl text-white/90 max-w-2xl mx-auto"> | |
| 通过多种智能体协同工作，提供端到端的智能服务方案， | |
| 实现所见即所得式的智能交互体验 | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Comparison Section --> | |
| <section id="comparison" class="py-20 bg-gradient-to-b from-deepblue-800 to-deepblue-900"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-4xl font-bold text-center mb-16 text-white">实施效果对比</h2> | |
| <div class="max-w-5xl mx-auto"> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-10"> | |
| <!-- Traditional Mode --> | |
| <div class="comparison-card traditional bg-gradient-to-br from-gray-800 to-gray-900 rounded-2xl p-8"> | |
| <div class="text-center mb-8"> | |
| <div class="text-3xl font-bold text-red-400 mb-2">传统模式</div> | |
| <div class="text-gray-400">效率低下·响应滞后·价值受限</div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="bg-gray-700/50 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-red-500/20 flex items-center justify-center text-red-400 text-xl mr-4"> | |
| <i class="fas fa-exclamation-triangle"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-gray-300">数据分散</div> | |
| <div class="text-sm text-gray-400">信息孤岛，难以整合利用</div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700/50 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-red-500/20 flex items-center justify-center text-red-400 text-xl mr-4"> | |
| <i class="fas fa-hourglass-half"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-gray-300">效率低下</div> | |
| <div class="text-sm text-gray-400">人工处理耗时长，响应慢</div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700/50 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-red-500/20 flex items-center justify-center text-red-400 text-xl mr-4"> | |
| <i class="fas fa-tachometer-alt"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-gray-300">知识利用率 ≤20%</div> | |
| <div class="text-sm text-gray-400">大量知识未被发现与利用</div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-700/50 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-red-500/20 flex items-center justify-center text-red-400 text-xl mr-4"> | |
| <i class="fas fa-brain"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-gray-300">决策滞后</div> | |
| <div class="text-sm text-gray-400">依赖人工分析，机会易流失</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Intelligent Mode --> | |
| <div class="comparison-card intelligent bg-gradient-to-br from-teal-900/70 to-teal-800/90 rounded-2xl p-8"> | |
| <div class="text-center mb-8"> | |
| <div class="text-3xl font-bold text-teal-300 mb-2">智能模式</div> | |
| <div class="text-teal-200">效率提升·敏捷决策·价值创造</div> | |
| </div> | |
| <div class="space-y-4"> | |
| <div class="bg-teal-800/40 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-teal-500/20 flex items-center justify-center text-teal-300 text-xl mr-4"> | |
| <i class="fas fa-database"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-teal-100">数据整合</div> | |
| <div class="text-sm text-teal-200">多源数据统一治理与应用</div> | |
| </div> | |
| </div> | |
| <div class="bg-teal-800/40 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-teal-500/20 flex items-center justify-center text-teal-300 text-xl mr-4"> | |
| <i class="fas fa-bolt"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-teal-100">效率提升</div> | |
| <div class="text-sm text-teal-200">知识利用效率提升<span class="text-teal-300 font-bold">3倍</span></div> | |
| </div> | |
| </div> | |
| <div class="bg-teal-800/40 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-teal-500/20 flex items-center justify-center text-teal-300 text-xl mr-4"> | |
| <i class="fas fa-rocket"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-teal-100">响应加速</div> | |
| <div class="text-sm text-teal-200">决策响应速度提升<span class="text-teal-300 font-bold">5倍</span></div> | |
| </div> | |
| </div> | |
| <div class="bg-teal-800/40 p-4 rounded-xl flex"> | |
| <div class="w-10 h-10 rounded-full bg-teal-500/20 flex items-center justify-center text-teal-300 text-xl mr-4"> | |
| <i class="fas fa-lightbulb"></i> | |
| </div> | |
| <div> | |
| <div class="font-bold text-teal-100">智能决策</div> | |
| <div class="text-sm text-teal-200">AI支持下的数据驱动决策</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-20 bg-black/30 backdrop-blur-sm p-8 rounded-2xl border border-white/10"> | |
| <div class="text-center text-2xl font-bold text-white mb-6">实施效果数据展示</div> | |
| <div class="grid grid-cols-2 md:grid-cols-4 gap-6"> | |
| <div class="text-center p-6"> | |
| <div class="text-4xl font-bold text-teal-400 mb-2">3×</div> | |
| <div class="text-white">知识利用效率</div> | |
| </div> | |
| <div class="text-center p-6"> | |
| <div class="text-4xl font-bold text-teal-400 mb-2">5×</div> | |
| <div class="text-white">决策响应速度</div> | |
| </div> | |
| <div class="text-center p-6"> | |
| <div class="text-4xl font-bold text-teal-400 mb-2">68%</div> | |
| <div class="text-white">流程自动化率</div> | |
| </div> | |
| <div class="text-center p-6"> | |
| <div class="text-4xl font-bold text-teal-400 mb-2">85%</div> | |
| <div class="text-white">数据处理效率</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Architecture Section --> | |
| <section id="architecture" class="py-20 bg-gradient-to-b from-deepblue-900 to-deepblue-800"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-4xl font-bold text-center mb-16 text-white">技术架构图</h2> | |
| <div class="max-w-4xl mx-auto"> | |
| <div class="architecture flex flex-col items-center"> | |
| <!-- Application Layer --> | |
| <div class="architecture-layer w-full max-w-md bg-gradient-to-b from-blue-500/10 to-blue-700/30 backdrop-blur p-8 rounded-2xl mb-4 border border-blue-500/20 shadow-lg"> | |
| <div class="flex items-center justify-between"> | |
| <div class="text-white"> | |
| <div class="text-xl font-bold">应用层</div> | |
| <div class="text-sm opacity-80">智能体+可视化界面</div> | |
| </div> | |
| <div class="w-12 h-12 rounded-full bg-blue-700 flex items-center justify-center"> | |
| <i class="fas fa-rocket text-blue-300"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="h-8 flex items-center justify-center"> | |
| <div class="w-1 h-full bg-gradient-to-b from-blue-500 to-teal-500 rounded-full"></div> | |
| </div> | |
| <!-- Algorithm Layer --> | |
| <div class="architecture-layer w-full max-w-lg bg-gradient-to-b from-teal-500/10 to-teal-700/30 backdrop-blur p-8 rounded-2xl mb-4 border border-teal-500/20 shadow-lg"> | |
| <div class="flex items-center justify-between"> | |
| <div class="text-white"> | |
| <div class="text-xl font-bold">算法层</div> | |
| <div class="text-sm opacity-80">大模型+专业算法库</div> | |
| </div> | |
| <div class="w-12 h-12 rounded-full bg-teal-700 flex items-center justify-center"> | |
| <i class="fas fa-brain text-teal-300"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="h-8 flex items-center justify-center"> | |
| <div class="w-1 h-full bg-gradient-to-b from-teal-500 to-blue-700 rounded-full"></div> | |
| </div> | |
| <!-- Data Layer --> | |
| <div class="architecture-layer w-full max-w-xl bg-gradient-to-b from-blue-700/10 to-blue-800/30 backdrop-blur p-8 rounded-2xl mb-4 border border-blue-600/20 shadow-lg"> | |
| <div class="flex items-center justify-between"> | |
| <div class="text-white"> | |
| <div class="text-xl font-bold">数据层</div> | |
| <div class="text-sm opacity-80">数据湖+知识图谱</div> | |
| </div> | |
| <div class="w-12 h-12 rounded-full bg-blue-800 flex items-center justify-center"> | |
| <i class="fas fa-database text-blue-300"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="h-8 flex items-center justify-center"> | |
| <div class="w-1 h-full bg-gradient-to-b from-blue-700 to-deepblue-800 rounded-full"></div> | |
| </div> | |
| <!-- Infrastructure Layer --> | |
| <div class="architecture-layer w-full max-w-2xl bg-gradient-to-b from-deepblue-700/10 to-deepblue-900/30 backdrop-blur p-8 rounded-2xl border border-deepblue-500/20 shadow-lg"> | |
| <div class="flex items-center justify-between"> | |
| <div class="text-white"> | |
| <div class="text-xl font-bold">基础设施层</div> | |
| <div class="text-sm opacity-80">云原生架构</div> | |
| </div> | |
| <div class="w-12 h-12 rounded-full bg-deepblue-800 flex items-center justify-center"> | |
| <i class="fas fa-server text-deepblue-300"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-20 text-center"> | |
| <div class="text-white text-xl max-w-2xl mx-auto mb-10"> | |
| 双向数据流贯穿各技术层，实现从底层基础设施到上层智能应用的 | |
| 一体化知识处理与智能决策闭环 | |
| </div> | |
| <a href="#" class="inline-flex items-center px-6 py-3 bg-gradient-to-r from-teal-500 to-blue-600 rounded-full text-white font-medium shadow-lg hover:shadow-xl transition group"> | |
| <span>开始智能知识之旅</span> | |
| <i class="fas fa-arrow-right ml-3 group-hover:translate-x-1 transition-transform"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="py-12 bg-black/50 backdrop-blur border-t border-white/5"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="flex items-center mb-6 md:mb-0"> | |
| <div class="w-12 h-12 rounded-full bg-gradient-to-r from-teal-500 to-blue-600 flex items-center justify-center"> | |
| <i class="fas fa-brain text-white"></i> | |
| </div> | |
| <div class="ml-4"> | |
| <div class="text-xl font-bold text-white">Deepseek</div> | |
| <div class="text-sm text-gray-400">智能知识服务解决方案</div> | |
| </div> | |
| </div> | |
| <div class="text-gray-400 text-sm"> | |
| © 2023 Deepseek AI. 保留所有权利。 | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| // Smooth scrolling for navigation links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function (e) { | |
| e.preventDefault(); | |
| document.querySelector(this.getAttribute('href')).scrollIntoView({ | |
| behavior: 'smooth' | |
| }); | |
| }); | |
| }); | |
| // Simple animation observer | |
| const observer = new IntersectionObserver((entries) => { | |
| entries.forEach(entry => { | |
| if (entry.isIntersecting) { | |
| entry.target.classList.add('animate-fadeIn'); | |
| } | |
| }); | |
| }, { threshold: 0.1 }); | |
| document.querySelectorAll('.pillar, .brain-node, .agent-card, .architecture-layer, .comparison-card').forEach(el => { | |
| el.classList.add('opacity-0', 'transition-opacity', 'duration-1000'); | |
| observer.observe(el); | |
| }); | |
| // Apply animation when elements are in view | |
| document.addEventListener('DOMContentLoaded', function() { | |
| document.querySelectorAll('.pillar, .brain-node, .agent-card, .architecture-layer, .comparison-card').forEach(el => { | |
| setTimeout(() => { | |
| el.classList.remove('opacity-0'); | |
| }, 100); | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://deepsite.hf.co/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://deepsite.hf.co" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://deepsite.hf.co?remix=maomaobj/k1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |