562 lines
21 KiB
HTML
562 lines
21 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>云栖象限（ChuQuadrant）项目介绍</title>
|
||
<style>
|
||
/* Basic Reset */
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Microsoft YaHei", "微软雅黑", sans-serif;
|
||
line-height: 1.7;
|
||
color: #333;
|
||
background-color: #f8f9fa;
|
||
padding: 20px;
|
||
}
|
||
|
||
.container {
|
||
max-width: 900px;
|
||
margin: 20px auto;
|
||
background-color: #ffffff;
|
||
padding: 30px 40px;
|
||
border-radius: 8px;
|
||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
|
||
}
|
||
|
||
/* Header */
|
||
header {
|
||
text-align: center;
|
||
margin-bottom: 40px;
|
||
border-bottom: 2px solid #e0e0e0;
|
||
padding-bottom: 20px;
|
||
}
|
||
|
||
header h1 {
|
||
font-size: 2.5em;
|
||
color: #2c3e50;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
header .tagline {
|
||
font-size: 1.2em;
|
||
color: #555;
|
||
font-weight: 500;
|
||
background-color: #eef2f7; /* Light blue background for tagline */
|
||
padding: 10px 15px;
|
||
border-radius: 6px;
|
||
display: inline-block;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
header .intro-text {
|
||
margin-top: 20px;
|
||
font-size: 1.1em;
|
||
color: #444;
|
||
text-align: left; /* Align intro text left for readability */
|
||
}
|
||
|
||
header .intro-text strong {
|
||
color: #1a73e8; /* Highlight key features */
|
||
}
|
||
|
||
/* Style for the new buttons */
|
||
.header-buttons {
|
||
margin-top: 25px;
|
||
text-align: center; /* Center the buttons */
|
||
}
|
||
|
||
.btn {
|
||
display: inline-block;
|
||
padding: 12px 25px;
|
||
margin: 8px;
|
||
font-size: 1.1em;
|
||
font-weight: bold;
|
||
color: #fff;
|
||
background-color: #1a73e8; /* Primary button color */
|
||
border: none;
|
||
border-radius: 6px;
|
||
text-decoration: none;
|
||
transition: background-color 0.3s ease, transform 0.2s ease;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.btn:hover {
|
||
background-color: #0b5ed7; /* Darker blue on hover */
|
||
transform: translateY(-2px); /* Slight lift effect */
|
||
}
|
||
|
||
.btn-secondary {
|
||
background-color: #6c757d; /* Secondary button color */
|
||
}
|
||
|
||
.btn-secondary:hover {
|
||
background-color: #5a6268;
|
||
}
|
||
|
||
/* Sections */
|
||
section {
|
||
margin-bottom: 40px;
|
||
}
|
||
|
||
section h2 {
|
||
font-size: 1.8em;
|
||
color: #1a73e8; /* Primary color for main headings */
|
||
margin-bottom: 20px;
|
||
padding-bottom: 10px;
|
||
border-bottom: 1px solid #d0d0d0;
|
||
}
|
||
|
||
section h3 {
|
||
font-size: 1.4em;
|
||
color: #34495e; /* Darker secondary color */
|
||
margin-top: 25px;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
section h4 {
|
||
font-size: 1.15em;
|
||
color: #555;
|
||
margin-top: 15px;
|
||
margin-bottom: 10px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
/* Lists */
|
||
ul, ol {
|
||
margin-left: 25px; /* Indentation for lists */
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
li {
|
||
margin-bottom: 10px;
|
||
color: #444;
|
||
}
|
||
|
||
li strong {
|
||
color: #e67e22; /* Accent color for strong text in lists */
|
||
}
|
||
|
||
/* Specific Element Styling */
|
||
.problem-statement {
|
||
background-color: #fff3cd; /* Light yellow for problem emphasis */
|
||
border-left: 4px solid #ffeeba;
|
||
padding: 15px;
|
||
margin: 20px 0;
|
||
border-radius: 4px;
|
||
color: #856404;
|
||
}
|
||
|
||
.problem-statement strong {
|
||
color: #856404;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.advantage-item h3 {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 1.3em;
|
||
}
|
||
|
||
.advantage-item h3::before {
|
||
content: '✓'; /* Checkmark or other icon */
|
||
color: #27ae60; /* Green for advantages */
|
||
font-size: 1.2em;
|
||
margin-right: 10px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.comparison-block {
|
||
background-color: #f1f3f5;
|
||
padding: 15px;
|
||
margin: 15px 0;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 6px;
|
||
}
|
||
|
||
.comparison-block h4 {
|
||
color: #0b5ed7; /* Blue for comparison titles */
|
||
margin-top: 0;
|
||
margin-bottom: 8px;
|
||
}
|
||
|
||
.comparison-block strong { /* e.g., 云栖象限的突破 */
|
||
color: #1a73e8;
|
||
}
|
||
|
||
code {
|
||
background-color: #e9ecef;
|
||
padding: 0.2em 0.4em;
|
||
margin: 0;
|
||
font-size: 0.9em;
|
||
border-radius: 3px;
|
||
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||
}
|
||
|
||
.user-levels {
|
||
display: flex;
|
||
gap: 30px;
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.user-levels > div {
|
||
flex: 1;
|
||
background-color: #eef2f7;
|
||
padding: 20px;
|
||
border-radius: 6px;
|
||
border: 1px solid #d0d9e2;
|
||
}
|
||
|
||
.user-levels h3 {
|
||
margin-top: 0;
|
||
color: #2c3e50;
|
||
}
|
||
|
||
.speed-section strong {
|
||
color: #d9534f; /* Red/accent for speed highlight */
|
||
}
|
||
.speed-section ul {
|
||
list-style-type: '⚡ '; /* Fun icon for speed points */
|
||
}
|
||
|
||
/* Promises Section */
|
||
.promises {
|
||
background-color: #e8f5e9; /* Light green background */
|
||
border-left: 5px solid #4caf50; /* Green border */
|
||
padding: 20px;
|
||
margin: 30px 0;
|
||
border-radius: 5px;
|
||
}
|
||
|
||
.promises h3 {
|
||
color: #1b5e20; /* Dark green title */
|
||
margin-top: 0;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.promises p {
|
||
margin-bottom: 8px;
|
||
font-size: 1.1em;
|
||
}
|
||
|
||
.promises .no {
|
||
color: #c62828; /* Red for 'No' points */
|
||
font-weight: bold;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.promises .yes {
|
||
color: #2e7d32; /* Green for 'Yes' points */
|
||
font-weight: bold;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
/* Footer */
|
||
footer {
|
||
text-align: center;
|
||
margin-top: 50px;
|
||
padding-top: 20px;
|
||
border-top: 1px solid #e0e0e0;
|
||
font-size: 0.9em;
|
||
color: #666;
|
||
}
|
||
|
||
footer .final-tagline {
|
||
font-size: 1.2em;
|
||
font-weight: bold;
|
||
color: #1a73e8;
|
||
margin-bottom: 15px;
|
||
display: block; /* Make it block for spacing */
|
||
}
|
||
|
||
footer .org-info {
|
||
margin-top: 10px;
|
||
font-size: 0.85em;
|
||
color: #777;
|
||
}
|
||
|
||
/* Style for the opensource link */
|
||
footer .opensource-link {
|
||
margin-top: 15px;
|
||
font-size: 0.9em;
|
||
color: #555;
|
||
}
|
||
|
||
footer .opensource-link a {
|
||
color: #1a73e8;
|
||
text-decoration: none;
|
||
}
|
||
|
||
footer .opensource-link a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* Responsive Design */
|
||
@media (max-width: 768px) {
|
||
.container {
|
||
padding: 20px 25px;
|
||
}
|
||
|
||
header h1 {
|
||
font-size: 2em;
|
||
}
|
||
|
||
header .tagline {
|
||
font-size: 1.1em;
|
||
}
|
||
|
||
section h2 {
|
||
font-size: 1.6em;
|
||
}
|
||
|
||
section h3 {
|
||
font-size: 1.3em;
|
||
}
|
||
|
||
section h4 {
|
||
font-size: 1.1em;
|
||
}
|
||
|
||
.user-levels {
|
||
flex-direction: column;
|
||
gap: 15px;
|
||
}
|
||
|
||
footer .final-tagline {
|
||
font-size: 1.1em;
|
||
}
|
||
|
||
.btn {
|
||
padding: 10px 20px;
|
||
font-size: 1em;
|
||
}
|
||
}
|
||
|
||
@media (max-width: 480px) {
|
||
body {
|
||
padding: 10px;
|
||
}
|
||
.container {
|
||
padding: 15px 20px;
|
||
}
|
||
header h1 {
|
||
font-size: 1.8em;
|
||
}
|
||
header .tagline {
|
||
font-size: 1em;
|
||
}
|
||
section h2 {
|
||
font-size: 1.4em;
|
||
}
|
||
section h3 {
|
||
font-size: 1.2em;
|
||
}
|
||
section h4 {
|
||
font-size: 1.05em;
|
||
}
|
||
.btn {
|
||
padding: 8px 15px;
|
||
font-size: 0.95em;
|
||
}
|
||
}
|
||
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<h1>云栖象限（ChuQuadrant）项目介绍</h1>
|
||
<p class="tagline">定位：AI学习伴侣 × 创意工坊 × 情感树洞</p>
|
||
<p class="intro-text">当其他软件还在“聊天”层面内卷时，云栖象限已通过<strong>可编程对话流、自然化知识管理、人格量化设计</strong>，重新定义了AI工具的边界——既能帮学生解一道方程题，也能陪你造一个宇宙。</p>
|
||
<!-- Added Buttons -->
|
||
<div class="header-buttons">
|
||
<a href="/" target="_blank" class="btn">立即使用</a>
|
||
<a href="/" target="_blank" class="btn btn-secondary">备用使用</a>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<section id="why-choose">
|
||
<h2>一、为什么选择云栖象限？——赋能强大，专注成长</h2>
|
||
<div class="problem-statement">
|
||
<p>面对市面上商业化AI应用（如Glow、星野、元宝等）的<strong>内容局限严重、隐私条款模糊、功能模式单一、模型效率低下</strong>等问题...</p>
|
||
</div>
|
||
<p>云栖象限以<strong>开源、自由、安全</strong>为核心，为高中生量身打造了一个既能辅助学习，又能释放创意的AI平台。</p>
|
||
</section>
|
||
|
||
<section id="features">
|
||
<h2>二、云栖象限如何助力学习？——三大核心场景</h2>
|
||
|
||
<h3>1. 学科知识沉浸式学习</h3>
|
||
<ul>
|
||
<li><strong>历史/文学/科技场景还原</strong>：与AI扮演的“李白”对诗、向“爱因斯坦”提问物理原理，让知识点活起来。</li>
|
||
<li><strong>多语言实战</strong>：支持英语等对话练习，AI实时纠正语法错误并生成学习报告。</li>
|
||
<li><strong>理科思维训练</strong>：通过云栖象限学习逻辑推理，用AI生成数理化应用题并分步解析。</li>
|
||
</ul>
|
||
|
||
<h3>2. 创造力与表达力培养</h3>
|
||
<ul>
|
||
<li><strong>零门槛创作工具</strong>：
|
||
<ul>
|
||
<li>输入关键词，AI自动生成短篇小说、诗歌甚至剧本。</li>
|
||
<li>一键总结，方便故事概括。</li>
|
||
</ul>
|
||
</li>
|
||
<li><strong>辩论与演讲训练</strong>：AI模拟反方辩手，提供论点攻防实战。</li>
|
||
</ul>
|
||
|
||
<h3>3. 心理健康轻陪伴</h3>
|
||
<ul>
|
||
<li><strong>学生树洞</strong>：匿名倾诉压力，AI基于心理学知识提供情绪疏导建议。</li>
|
||
<li><strong>校园社交模拟</strong>：通过AI角色演练人际沟通技巧，避免现实尴尬。</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section id="advantages">
|
||
<h2>三、云栖象限 vs 商业软件的独特优势——安全可控，极速开放</h2>
|
||
|
||
<div class="advantage-item">
|
||
<h3>① 完全掌控你的数据</h3>
|
||
<p>云栖象限是开源项目，所有人都可以审查、修改、发布源代码。所有对话记录、角色卡、预设<strong>仅存储在云栖象限服务器设备</strong>，无云端监控，不与第三方共享，彻底杜绝隐私泄露。 还支持一键打包下载用户数据与删除数据，符合欧盟严格隐私标准。</p>
|
||
</div>
|
||
|
||
<div class="advantage-item">
|
||
<h3>② 技术开放，兼容并蓄</h3>
|
||
<p>打破AI生态壁垒，支持<strong>多模型自由切换</strong>。从云端到本地，从全球视野到本土深耕，云栖象限让每一个灵感都能找到最适合的AI引擎：无论国际顶尖模型（<code>GPT-o1</code>、<code>Claude 3.7</code>）还是国产新锐力量（深度求索<code>DeepSeek</code>、通义千问<code>Qwen</code>），均可无缝接入。</p>
|
||
</div>
|
||
|
||
<div class="advantage-item">
|
||
<h3>③ 低成本，高效能</h3>
|
||
<p>无需各种付费政策，一部手机或电脑即可使用。</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="killer-features">
|
||
<h2>四、云栖象限 vs 其他LLM前端的杀手锏——极客级工具，小白也能玩</h2>
|
||
<p>云栖象限不仅比商业化App更自由安全，在技术功能上也远超同类开源前端，提供<strong>垂直场景深度优化</strong>的创作生态链：</p>
|
||
|
||
<h3>① 对话补全预设（Advanced Presets）</h3>
|
||
<div class="comparison-block">
|
||
<h4>对比商业App：</h4>
|
||
<p>Glow等仅支持简单关键词触发回复，套路单一。</p>
|
||
</div>
|
||
<div class="comparison-block">
|
||
<h4>对比开源前端：</h4>
|
||
<p>Open WebUI需手动编写复杂提示词，门槛高。</p>
|
||
</div>
|
||
<div class="comparison-block">
|
||
<h4><strong>云栖象限的突破：</strong></h4>
|
||
<ul>
|
||
<li>内置“学习模式”预设库：一键切换“辩论教练”“作文批改助手”等场景，自动适配学术话术。</li>
|
||
<li><strong>正则表达式强化</strong>：用正则规则定制AI行为（例：自动识别数学公式并调用计算模块）。</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<h3>② 世界书（World Book）——构建你的平行宇宙</h3>
|
||
<div class="comparison-block">
|
||
<h4>开源竞品短板：</h4>
|
||
<p>Open WebUI仅支持单次对话记忆，无法维持长期设定。</p>
|
||
</div>
|
||
<div class="comparison-block">
|
||
<h4><strong>云栖象限的解决方案：</strong></h4>
|
||
<ul>
|
||
<li>用“世界书”为AI注入<strong>多层知识体系</strong>：
|
||
<ul>
|
||
<li>第一层：全局世界观（如“科幻未来都市规则”）。</li>
|
||
<li>第二层：角色专属背景（如“仿生人三大定律”）。</li>
|
||
<li>第三层：实时事件时间轴（如“化学实验爆炸倒计时”）。</li>
|
||
</ul>
|
||
</li>
|
||
<li>教师可用此功能构建<strong>虚拟实验室/历史战场</strong>，让知识立体化。</li>
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
<h3>③ 角色卡（Character Card）——人格精确到神经元</h3>
|
||
<div class="comparison-block">
|
||
<h4>商业化App局限：</h4>
|
||
<p>星野等角色模板固定，无法调整心理参数。</p>
|
||
</div>
|
||
<div class="comparison-block">
|
||
<h4><strong>云栖象限的深度控制：</strong></h4>
|
||
<ul>
|
||
<li>支持深度人格设定：
|
||
<ul>
|
||
<li>自定义人物，让AI角色拥有“人性温度”。</li>
|
||
<li>绑定学科知识（例：设定“莎士比亚”角色优先引用文学典故）。</li>
|
||
</ul>
|
||
</li>
|
||
<li>支持<strong>媒体扩展</strong>：为角色卡关联图片、语音甚至3D模型。</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<h3>④ 扩展（Extensions）——模块化赋能学习</h3>
|
||
<div class="comparison-block">
|
||
<h4>开源前端劣势：</h4>
|
||
<p>Open WebUI插件生态匮乏，功能依赖代码能力。</p>
|
||
</div>
|
||
<div class="comparison-block">
|
||
<h4><strong>云栖象限的教育化扩展：</strong></h4>
|
||
<ul>
|
||
<li><strong>学习看板</strong>：自动统计对话中的知识点密度，生成总结。</li>
|
||
<li><strong>数学公式</strong>：正确处理 <code>LaTeX</code> 数学符号，动态生成数学题。</li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="user-levels">
|
||
<h2>五、从萌新到极客——云栖象限陪你走进阶之路</h2>
|
||
<p>云栖象限以<strong>分层设计理念</strong>兼顾不同用户需求：</p>
|
||
<div class="user-levels">
|
||
<div>
|
||
<h3>对高级用户/创作者</h3>
|
||
<p>开放<code>API</code>、正则表达式控制、世界书编辑等深度工具链，支持从角色心理学到虚拟物理规则的精密设计，让硬核玩家打造独一无二的AI生态。</p>
|
||
</div>
|
||
<div>
|
||
<h3>对普通学生</h3>
|
||
<p>提供“学习快捷面板”——预置学科知识模板、一键启动校园场景（如“英语角模拟”“作文灵感激发”），<strong>3分钟即可掌握基础交互</strong>。</p>
|
||
</div>
|
||
</div>
|
||
<p style="margin-top: 20px;">无论是想用AI解微积分的理科生，还是试图构建幻想大陆的文学社新人，云栖象限都提供<strong>从入门到精通的平滑成长路径</strong>。技术不应是门槛，而是创意的翅膀。 <strong>让天才更极致，让小白变高手——这就是云栖象限的哲学。</strong></p>
|
||
</section>
|
||
|
||
<section id="speed" class="speed-section">
|
||
<h2>六、速度革命——快思考，零等待</h2>
|
||
<p>无论是课堂抢答还是灵感刹那，云栖象限永远快人一步。我们<strong>重新定义AI工具的效率标准</strong>：</p>
|
||
<ul>
|
||
<li><strong>默认搭载Gemini 2.0极速引擎</strong>，1秒可生成<strong>300+ token</strong>（约450汉字），比主流商业化App提速<strong>600%</strong>，彻底告别“打字20秒，等待2分钟”的卡顿焦虑。</li>
|
||
<li><strong>高性能架构优化</strong>：
|
||
<ul>
|
||
<li>动态负载均衡：多人同时对话时自动分配算力，确保实验室/教室场景流畅运行。</li>
|
||
<li>预加载技术：最近对话常驻内存，调用历史记录快如闪电。</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section class="promises">
|
||
<h3>我们的承诺</h3>
|
||
<p>云栖象限不是“娱乐至死”的聊天玩具，而是秉持<strong>技术向善</strong>原则的教育伙伴：</p>
|
||
<p><span class="no">❌</span> 无诱导沉迷机制</p>
|
||
<p><span class="no">❌</span> 无隐蔽付费陷阱</p>
|
||
<p><span class="no">❌</span> 无数据滥用</p>
|
||
<p><span class="yes">✅</span> 为一中学习场景定制学习模式卡</p>
|
||
<p><span class="yes">✅</span> 定期更新学科知识库</p>
|
||
<p><span class="yes">✅</span> 提供统一管理能力</p>
|
||
</section>
|
||
</main>
|
||
|
||
<footer>
|
||
<span class="final-tagline">让AI回归工具本质，为成长插上翅膀！</span>
|
||
<p>云栖 AI | 开源共享 · 安全可控</p>
|
||
<p class="org-info">云栖 AI 是 愚人众团队 的一个子组织，云栖象限是其开发的大语言模型前端应用。<br>愚人众服务器提供示例云栖象限实例云计算能力。</p>
|
||
<p class="opensource-link">开源地址：<a href="https://git.fatui.xyz/ChuCloudAI/ChuQuadrant" target="_blank">https://git.fatui.xyz/ChuCloudAI/ChuQuadrant</a></p>
|
||
</footer>
|
||
</div>
|
||
</body>
|
||
</html> |