docs(site): switch the promo film to the 62-second no-narration cut (#1438)

This commit is contained in:
程序员阿江-Relakkes
2026-10-04 13:22:17 +08:00
committed by GitHub
parent 7e50c31986
commit 195b406e91
7 changed files with 11 additions and 11 deletions
+2 -2
View File
@@ -34,8 +34,8 @@ cc-haha is a **desktop Claude Code workspace** for macOS, Windows, and Linux: mu
</p> </p>
<p align="center"> <p align="center">
<a href="https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v1.mp4"><img src="docs/images/readme-film-cover-en.webp" width="720" alt="Watch the 90-second cc-haha film"></a> <a href="https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v2.mp4"><img src="docs/images/readme-film-cover-en.webp" width="720" alt="Watch the 62-second cc-haha film"></a>
<br><sub>A 90-second film made with Opus 5.5, narrated in Chinese with Chinese subtitles. Opens the video in your browser.</sub> <br><sub>A 62-second film made with Claude, with no narration. Opens the video in your browser.</sub>
</p> </p>
Start here: [install the app](docs/en/start/install.md) → [connect a model](docs/en/start/models.md) → [run your first session](docs/en/start/first-session.md) → [explore settings](docs/en/desktop/settings.md) → [try real workflows](docs/en/cases/index.md). For hands-free cross-app work on macOS, follow the [Computer Use guide](docs/en/desktop/computer-use.md). Start here: [install the app](docs/en/start/install.md) → [connect a model](docs/en/start/models.md) → [run your first session](docs/en/start/first-session.md) → [explore settings](docs/en/desktop/settings.md) → [try real workflows](docs/en/cases/index.md). For hands-free cross-app work on macOS, follow the [Computer Use guide](docs/en/desktop/computer-use.md).
+2 -2
View File
@@ -34,8 +34,8 @@ cc-haha 是一个**桌面端 Claude Code 工作台**:多会话与全局搜索
</p> </p>
<p align="center"> <p align="center">
<a href="https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v1.mp4"><img src="docs/images/readme-film-cover-zh-CN.webp" width="720" alt="观看 90 秒 cc-haha 宣传片"></a> <a href="https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v2.mp4"><img src="docs/images/readme-film-cover-zh-CN.webp" width="720" alt="观看 62 秒 cc-haha 宣传片"></a>
<br><sub>由 Opus 5.5 制作的 90 秒宣传片,点击在浏览器中播放。</sub> <br><sub>由 Claude 制作的 62 秒宣传片,无旁白,点击在浏览器中播放。</sub>
</p> </p>
从 0 开始:[下载安装](docs/start/install.md) → [连接模型](docs/start/models.md) → [跑通第一条会话](docs/start/first-session.md) → [设置指南](docs/desktop/settings.md) → [实战案例](docs/cases/index.md)。想体验不抢鼠标的跨应用操作,接着看 [Computer Use 指南](docs/desktop/computer-use.md)。 从 0 开始:[下载安装](docs/start/install.md) → [连接模型](docs/start/models.md) → [跑通第一条会话](docs/start/first-session.md) → [设置指南](docs/desktop/settings.md) → [实战案例](docs/cases/index.md)。想体验不抢鼠标的跨应用操作,接着看 [Computer Use 指南](docs/desktop/computer-use.md)。
Binary file not shown.

Before

Width:  |  Height:  |  Size: 141 KiB

After

Width:  |  Height:  |  Size: 57 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 144 KiB

After

Width:  |  Height:  |  Size: 56 KiB

+6 -6
View File
@@ -19,7 +19,7 @@ import './home.css'
const VIDEO = 'https://pollen-batch-41236914.figma.site/_components/v2/f0ee2dae7671c170c34f12e31c4cb41418976c98/769c564298c132f7919405cd9f17c1b1231f341d.769c5642.mp4' const VIDEO = 'https://pollen-batch-41236914.figma.site/_components/v2/f0ee2dae7671c170c34f12e31c4cb41418976c98/769c564298c132f7919405cd9f17c1b1231f341d.769c5642.mp4'
// The film is hosted on the CDN; versioned keys keep cached copies from going stale. // The film is hosted on the CDN; versioned keys keep cached copies from going stale.
const FILM = 'https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v1.mp4' const FILM = 'https://cdn.zizhi1.com/cc-haha/site/cchaha-film-1080p-v2.mp4'
const featureIcons = [Code2, MousePointer2, GitCompareArrows] const featureIcons = [Code2, MousePointer2, GitCompareArrows]
const stepIcons = [Download, SlidersHorizontal, FolderOpen, ScanEye] const stepIcons = [Download, SlidersHorizontal, FolderOpen, ScanEye]
const taskSteps = { const taskSteps = {
@@ -150,16 +150,16 @@ function Film({ locale }: { locale: LandingLocale }) {
const en = locale === 'en' const en = locale === 'en'
// The video element is only created after a click, so visitors who never play it download nothing. // The video element is only created after a click, so visitors who never play it download nothing.
const [started, setStarted] = useState(false) const [started, setStarted] = useState(false)
const posterAlt = en ? 'Closing frame of the cc-haha film: the wordmark over a painted countryside' : 'cc-haha 宣传片片尾:田园风景上的 cc-haha 字标' const posterAlt = en ? 'Frame from the cc-haha film: an Agent Team with every task finished' : 'cc-haha 宣传片画面:Agent Teams 四项任务全部完成'
return <section className="wander-film wander-section" id="film" aria-labelledby="film-title"> return <section className="wander-film wander-section" id="film" aria-labelledby="film-title">
<div className="wander-section__heading"><span className="wander-eyebrow">cc-haha / {en ? 'THE FILM · 1:30' : '90 秒短片'}</span><h2 id="film-title">{en ? <>Ninety seconds.<br />See it <em>at work.</em></> : <>90 秒,<br />看它<em>怎么做事。</em></>}</h2><p>{en ? 'A team splits the work, hands it off, runs on schedule, and picks up again on your phone.' : '组队分工、接力推进、按时执行,再到手机上接着聊。'}</p></div> <div className="wander-section__heading"><span className="wander-eyebrow">cc-haha / {en ? 'THE FILM · 1:02' : '62 秒短片'}</span><h2 id="film-title">{en ? <>One minute.<br />See it <em>at work.</em></> : <>一分钟,<br />看它<em>怎么做事。</em></>}</h2><p>{en ? 'A team splits the work, you mark up the page, it works on its own cursor, and every session keeps moving.' : '组队分工、边看边批注、用自己的光标操作应用,多个会话同时推进。'}</p></div>
<div className="wander-showcase wander-film__frame"> <div className="wander-showcase wander-film__frame">
<div className="wander-showcase__bar"><span className="wander-window-dots"><i /><i /><i /></span><span>cc-haha / {en ? 'FILM' : '宣传片'}</span><span>{en ? 'CHINESE NARRATION' : '有声 · 中文字幕'}</span></div> <div className="wander-showcase__bar"><span className="wander-window-dots"><i /><i /><i /></span><span>cc-haha / {en ? 'FILM' : '宣传片'}</span><span>{en ? 'NO NARRATION' : '无旁白 · 有配乐'}</span></div>
{started {started
? <video className="wander-film__media" src={FILM} poster={filmPoster} controls autoPlay playsInline preload="metadata" aria-label={en ? 'cc-haha film' : 'cc-haha 宣传片'} /> ? <video className="wander-film__media" src={FILM} poster={filmPoster} controls autoPlay playsInline preload="metadata" aria-label={en ? 'cc-haha film' : 'cc-haha 宣传片'} />
: <button className="wander-film__media wander-film__start" onClick={() => setStarted(true)} aria-label={en ? 'Play the 90-second film' : '播放 90 秒宣传片'}><img src={filmPoster} alt={posterAlt} width={1600} height={900} loading="lazy" /><span className="wander-primary"><Play size={16} />{en ? 'Play the film' : '播放短片'}</span></button>} : <button className="wander-film__media wander-film__start" onClick={() => setStarted(true)} aria-label={en ? 'Play the 62-second film' : '播放 62 秒宣传片'}><img src={filmPoster} alt={posterAlt} width={1600} height={900} loading="lazy" /><span className="wander-primary"><Play size={16} />{en ? 'Play the film' : '播放短片'}</span></button>}
</div> </div>
{en && <p className="wander-film__note">Narrated in Chinese with Chinese subtitles. Demo data; on-screen times are staged.</p>} {en && <p className="wander-film__note">No narration; the film plays with music and sound effects. Demo data; on-screen times are staged.</p>}
{!en && <p className="wander-film__note">片中为演示数据,画面中的时间为演示设定。</p>} {!en && <p className="wander-film__note">片中为演示数据,画面中的时间为演示设定。</p>}
</section> </section>
} }
+1 -1
View File
@@ -3,7 +3,7 @@
Updated 2026-09-26. The user explicitly supplied the video and requested this art direction for the complete cc-haha landing page. Updated 2026-09-26. The user explicitly supplied the video and requested this art direction for the complete cc-haha landing page.
- `wandor-poster.webp`: 1920×1080 static frame captured in Ego Lite from the supplied video. Used during loading, media failure and reduced motion. The video is loaded from the exact supplied Figma URL in HomePage.tsx; no external video is required during deterministic build/check. - `wandor-poster.webp`: 1920×1080 static frame captured in Ego Lite from the supplied video. Used during loading, media failure and reduced motion. The video is loaded from the exact supplied Figma URL in HomePage.tsx; no external video is required during deterministic build/check.
- `film-poster.webp`: 1600px frame at 1:25 of the user's 90-second cc-haha promo film (2026-10-02), taken before the closing download chip appears so it does not sit behind the play button. The film itself (1080p, faststart MP4) is hosted on the user's Qiniu CDN under `cc-haha/site/`; HomePage.tsx creates the video element only after a click, so build/check never fetches it. Upload a replacement under a new `-vN` key rather than overwriting. - `film-poster.webp`: 1600px frame at 0:16.5 of the 62-second, no-narration cc-haha film v2 (2026-10-04): the Agent Teams board with all four tasks done. The closing frame was rejected because the centred HTML play button covered its wordmark. The film itself (1080p, faststart MP4) is hosted on the user's Qiniu CDN under `cc-haha/site/`; HomePage.tsx creates the video element only after a click, so build/check never fetches it. Upload a replacement under a new `-vN` key rather than overwriting.
- `quiet-landscape.webp`: original image generated with the built-in imagegen tool, optimized to WebP. Used behind the feature gallery, onboarding and closing sections. - `quiet-landscape.webp`: original image generated with the built-in imagegen tool, optimized to WebP. Used behind the feature gallery, onboarding and closing sections.
- `quiet-moments.webp`: original image generated with the built-in imagegen tool, optimized to 900px WebP. Editorial still life beside the task examples. - `quiet-moments.webp`: original image generated with the built-in imagegen tool, optimized to 900px WebP. Editorial still life beside the task examples.
- `project-session.png`: the exact 3456×2168 PNG supplied by the user on 2026-09-26. The user explicitly requested displaying the real project and session list without masking. Copied unchanged; no cropping, redaction, or reconstruction. Used for the landing page's code tab in both locales and its full-size preview. - `project-session.png`: the exact 3456×2168 PNG supplied by the user on 2026-09-26. The user explicitly requested displaying the real project and session list without masking. Copied unchanged; no cropping, redaction, or reconstruction. Used for the landing page's code tab in both locales and its full-size preview.
Binary file not shown.

Before

Width:  |  Height:  |  Size: 170 KiB

After

Width:  |  Height:  |  Size: 74 KiB