Files
OverCoocked-FrontPage/index.html
T
2026-07-30 21:31:50 +08:00

169 lines
13 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="煮糊了 OverCooked 为影视服务提供品牌门户、统一运营、媒体处理和播放节点调度。">
<title>煮糊了 OverCooked|影视流媒体平台</title>
<link rel="icon" href="favicon.svg">
<link rel="stylesheet" href="assets/apple.css">
</head>
<body>
<a class="skip-link" href="#content">跳至主要内容</a>
<header class="site-header" data-header>
<nav class="nav-island" aria-label="主导航">
<a class="wordmark" href="#top" aria-label="OverCooked 首页">
<img class="wordmark-logo" src="overcooked-white.png" alt="" aria-hidden="true">
<span>OverCooked</span>
</a>
<div class="desktop-nav">
<a href="#platform">平台</a>
<a href="#capabilities">能力</a>
<a href="#delivery">交付</a>
<a href="pricing.html">定价</a>
</div>
<div class="nav-actions">
<a class="nav-contact" href="pricing.html">选择方案 <span aria-hidden="true">→</span></a>
<button class="menu-button" type="button" aria-expanded="false" aria-controls="mobile-menu" aria-label="打开导航" data-menu-button><span></span><span></span></button>
</div>
</nav>
<div class="mobile-menu" id="mobile-menu" data-mobile-menu hidden>
<a href="#platform">平台</a><a href="#capabilities">能力</a><a href="#delivery">交付</a><a href="pricing.html">定价</a><a href="mailto:lachong930@gmail.com">联系团队</a>
</div>
</header>
<main id="content">
<section class="hero" id="top">
<div class="hero-media" aria-hidden="true"></div>
<div class="hero-inner">
<div class="hero-copy">
<p class="hero-eyebrow"><span></span>为影视运营而生</p>
<h1>OverCooked</h1>
<p class="hero-product">新一代流媒体一体服务平台</p>
<p class="hero-lead">让天下的服主安心开服。</p>
<div class="hero-actions">
<a class="button button-primary" href="pricing.html">查看服务定价 <span aria-hidden="true">→</span></a>
<a class="text-button" href="#platform">了解平台 <span aria-hidden="true">↓</span></a>
</div>
</div>
<div class="product-stage" data-product-stage>
<div class="product-window" data-product-window aria-label="OverCooked 控制台交互预览">
<div class="window-bar">
<div class="traffic-lights" aria-hidden="true"><i></i><i></i><i></i></div>
<div class="window-title"><span class="window-mark"></span>Manage Console</div>
<div class="window-status"><span></span>服务正常</div>
</div>
<div class="window-layout">
<aside class="window-sidebar" aria-label="控制台视图">
<button class="console-tab is-active" type="button" data-console-tab="overview" aria-pressed="true"><i>⌂</i><span>概览</span></button>
<button class="console-tab" type="button" data-console-tab="media" aria-pressed="false"><i>▶</i><span>媒体</span></button>
<button class="console-tab" type="button" data-console-tab="nodes" aria-pressed="false"><i>⌁</i><span>节点</span></button>
</aside>
<div class="window-main">
<section class="console-view is-active" data-console-view="overview">
<div class="console-heading"><div><small>7 月 29 日 · 今天</small><h2>运营概览</h2></div><span class="view-chip">实时更新</span></div>
<div class="metric-row">
<article><small>活跃用户</small><strong>8,642</strong><span class="trend">↑ 12.4%</span></article>
<article><small>正在播放</small><strong>1,284</strong><span>实时</span></article>
<article><small>节点可用率</small><strong>99.98%</strong><span>稳定</span></article>
</div>
<div class="chart-panel">
<div class="panel-title"><span>播放趋势</span><small>最近 24 小时</small></div>
<div class="bar-chart" aria-label="播放量持续增长的柱状图"><i style="--h:24%"></i><i style="--h:34%"></i><i style="--h:30%"></i><i style="--h:46%"></i><i style="--h:55%"></i><i style="--h:48%"></i><i style="--h:65%"></i><i style="--h:60%"></i><i style="--h:76%"></i><i style="--h:88%"></i><i style="--h:82%"></i><i style="--h:96%"></i></div>
</div>
</section>
<section class="console-view" data-console-view="media" hidden>
<div class="console-heading"><div><small>自动处理队列</small><h2>媒体中心</h2></div><span class="view-chip">3 个任务</span></div>
<div class="media-list">
<article><span class="poster poster-one"></span><div><b>远方来信</b><small>4K · HDR · 已就绪</small></div><em>可播放</em></article>
<article><span class="poster poster-two"></span><div><b>沉默海岸</b><small>1080P · 正在转码</small></div><em>68%</em></article>
<article><span class="poster poster-three"></span><div><b>城市片段</b><small>4K · HDR · 已就绪</small></div><em>可播放</em></article>
</div>
</section>
<section class="console-view" data-console-view="nodes" hidden>
<div class="console-heading"><div><small>全球播放网络</small><h2>节点健康</h2></div><span class="view-chip">7 个区域</span></div>
<div class="node-map" aria-label="全球播放节点状态图"><div class="map-grid"></div><span class="node node-a"><i></i>上海</span><span class="node node-b"><i></i>新加坡</span><span class="node node-c"><i></i>东京</span><span class="node node-d"><i></i>洛杉矶</span></div>
<div class="node-summary"><span><i></i>平均响应 42ms</span><b>运行稳定</b></div>
</section>
</div>
</div>
</div>
<div class="live-activity" aria-label="当前实时播放 1,284"><span class="live-activity-icon" aria-hidden="true"><i></i><i></i><i></i></span><span><small>实时播放</small><strong>1,284</strong></span></div>
</div>
</div>
</section>
<section class="signal-strip" aria-label="平台关键指标">
<div><span>可用率</span><strong>99.98%</strong></div><i></i><div><span>关键服务</span><strong>7 × 24</strong></div><i></i><div><span>统一控制台</span><strong>1 个</strong></div>
</section>
<section class="platform" id="platform">
<div class="platform-intro reveal">
<p class="section-kicker">OverCooked Platform</p>
<h2>复杂留在幕后。<br><span>运营回到一眼看清。</span></h2>
<p>门户、用户、订单、片库和播放节点不再散落在不同系统。所有关键状态围绕你的工作流出现,常用动作始终触手可及。</p>
</div>
<div class="principle-grid reveal">
<article><span>01</span><h3>看见</h3><p>重要状态实时呈现,异常不再藏在报表深处。</p></article>
<article><span>02</span><h3>行动</h3><p>控制与对象相邻,减少页面切换和重复确认。</p></article>
<article><span>03</span><h3>扩展</h3><p>从一个品牌到多节点网络,能力随业务自然生长。</p></article>
</div>
</section>
<section class="capabilities" id="capabilities">
<div class="capabilities-head reveal">
<div><p class="section-kicker">核心能力</p><h2>一个界面,<br>四种关键视角。</h2></div>
<div class="capabilities-side">
<p>连续浏览四种工作视角,看平台如何把复杂任务压缩成清楚、连贯的操作。</p>
<div class="feature-rail-controls" aria-label="核心能力卡片导航">
<button type="button" data-feature-prev aria-label="上一项能力">←</button>
<button type="button" data-feature-next aria-label="下一项能力">→</button>
</div>
</div>
</div>
<div class="feature-rail reveal" data-feature-rail tabindex="0" aria-label="平台核心能力">
<article class="feature-card">
<div class="feature-copy"><p><b>01</b> 品牌门户</p><h3>从第一帧开始,<br>就是你的品牌。</h3><span>首页、详情页和播放体验完整定制,多端适配与独立域名默认就绪。</span></div>
<div class="portal-preview" aria-hidden="true"><div class="portal-bar"><i></i><span></span></div><div class="portal-hero"><small>NOW STREAMING</small><b>远方来信</b><em>继续观看 →</em></div><div class="portal-posters"><i></i><i></i><i></i><i></i></div></div>
</article>
<article class="feature-card">
<div class="feature-copy"><p><b>02</b> 统一运营</p><h3>用户、套餐与订单,<br>在同一条时间线上。</h3><span>清楚掌握用户生命周期与经营数据,把日常运营动作放回业务上下文。</span></div>
<div class="operations-preview" aria-hidden="true"><div class="op-chart"><span>本月收入</span><strong>¥128,460</strong><div><i style="--h:28%"></i><i style="--h:42%"></i><i style="--h:36%"></i><i style="--h:58%"></i><i style="--h:71%"></i><i style="--h:66%"></i><i style="--h:86%"></i></div></div><div class="op-event"><i></i><span><b>专业套餐</b><small>刚刚完成续订</small></span><em>+¥599</em></div></div>
</article>
<article class="feature-card">
<div class="feature-copy"><p><b>03</b> 媒体处理</p><h3>内容进入之后,<br>流程自动向前。</h3><span>检查、转码、归类和可用性验证持续运行,团队只处理真正需要判断的部分。</span></div>
<div class="pipeline-preview" aria-hidden="true"><div class="pipeline-step is-done"><i>✓</i><span><b>媒体接入</b><small>S3 / WebDAV</small></span></div><em></em><div class="pipeline-step is-active"><i></i><span><b>智能转码</b><small>4K · HDR</small></span></div><em></em><div class="pipeline-step"><i></i><span><b>分发就绪</b><small>7 个节点</small></span></div></div>
</article>
<article class="feature-card">
<div class="feature-copy"><p><b>04</b> 节点网络</p><h3>让每一次播放,<br>走更合适的线路。</h3><span>按区域、延迟和健康状态自动调度,同时保留清楚的人工控制与审计记录。</span></div>
<div class="network-preview" aria-hidden="true"><div class="network-grid"></div><span class="pulse p1"></span><span class="pulse p2"></span><span class="pulse p3"></span><span class="pulse p4"></span><div class="network-card"><span>全球健康度</span><strong>99.98%</strong><small>全部区域正常</small></div></div>
</article>
</div>
</section>
<section class="delivery" id="delivery">
<div class="delivery-head reveal"><p class="section-kicker">清晰交付</p><h2>从想法到上线,<br>没有黑箱。</h2></div>
<ol class="delivery-steps">
<li class="reveal"><span>01</span><div><h3>理解业务</h3><p>品牌、内容来源、用户规模与部署环境。</p></div><i aria-hidden="true">→</i></li>
<li class="reveal"><span>02</span><div><h3>配置平台</h3><p>门户、控制台、权限和线路策略。</p></div><i aria-hidden="true">→</i></li>
<li class="reveal"><span>03</span><div><h3>接入数据</h3><p>媒体库、存储节点与现有用户体系。</p></div><i aria-hidden="true">→</i></li>
<li class="reveal"><span>04</span><div><h3>上线陪跑</h3><p>测试、迁移、上线与持续运行支持。</p></div><i aria-hidden="true">✓</i></li>
</ol>
</section>
<section class="closing">
<div class="closing-media" aria-hidden="true"></div>
<div class="closing-copy reveal"><p class="section-kicker">准备好开始了吗</p><h2>把注意力留给内容,<br>把平台交给我们。</h2><p>告诉我们你的业务模式和现有环境,我们会给出合适的建设与迁移方案。</p><div class="hero-actions"><a class="button button-primary" href="mailto:lachong930@gmail.com">联系团队 <span aria-hidden="true">→</span></a><a class="text-button" href="pricing.html">查看方案</a></div></div>
</section>
</main>
<footer class="site-footer">
<div class="footer-main"><a class="wordmark" href="#top"><img class="wordmark-logo" src="overcooked-white.png" alt="" aria-hidden="true"><span>煮糊了</span><b>OverCooked</b></a><p>让每一个影视服务,都有一套好平台。</p></div>
<div class="footer-meta"><span>© 2026 OverCooked Platform Service.</span><div><a href="pricing.html">服务定价</a><a href="mailto:lachong930@gmail.com">商务联系</a><a href="https://overcooked.top">Back to Global Website</a></div></div>
</footer>
<script src="script.js"></script>
</body>
</html>