[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-openai-live-launches-replayable-demos-zh":3,"article-related-openai-live-launches-replayable-demos-zh":30,"series-tools-cbc35043-83a4-4f36-a928-4bd7f09991b2":73},{"id":4,"slug":5,"title":6,"content":7,"summary":8,"source":9,"source_url":10,"author":11,"image_url":12,"cover_image":12,"category":13,"language":14,"translated_content":11,"related_article_id":15,"keywords":16,"key_takeaways":22,"views":26,"created_at":27,"published_at":28,"topic_cluster_id":29},"cbc35043-83a4-4f36-a928-4bd7f09991b2","openai-live-launches-replayable-demos-zh","OpenAI Live 把直播變可重播模板","\u003Cp data-speakable=\"summary\">以前直播頁只負責開場，現在它要把發表、重播和摘要一起收好。\u003C\u002Fp>\u003Cp>我盯產品直播頁很久了，老實說，大多數都像委員會拼出來的：字很多、畫面很滿、重點很散。人進來先被品牌圖卡洗臉，接著等半天才看到 demo，等你終於講到真正有用的地方，觀眾早就滑走了。我最近特別注意 \u003Ca href=\"https:\u002F\u002Fopenai.com\u002Flive\u002F\">OpenAI Live\u003C\u002Fa>，因為它看起來不像在做一個「活動頁」，而是在做一個能被回放、能被搜尋、能被重複使用的發表入口。這差很多。\u003C\u002Fp>\u003Cp>我最不爽的一點，是很多團隊把直播當成一次性的熱鬧，結束就散。頁面只剩標題、影片、還有一點點模糊的歸檔。你要回頭找重點，得自己翻社群、翻部落格、翻 YouTube。\u003Ca href=\"\u002Ftag\u002Fopenai\">OpenAI\u003C\u002Fa> 的做法比較像在說：直播只是入口，真正重要的是把資訊留在同一個地方，讓晚到的人也看得懂。\u003C\u002Fp>\u003Cp>這篇我就照這個頁面拆給你看。不是要你照抄 OpenAI 的皮，而是把它背後那套方法論拿走，拿去做你的產品發表、demo、版本公告，都能直接用。\u003C\u002Fp>\u003Ch2>它把直播頁做成資訊入口，不是活動海報\u003C\u002Fh2>\u003Cblockquote>Watch OpenAI livestreams featuring product launches, demos, and announcements. Explore past events, discover the latest AI innovations, and stay up to date.\u003C\u002Fblockquote>\u003Cp>翻譯一下就是：這頁不是拿來炫，是拿來讓人快速理解「現在有什麼、以前有什麼、我該看哪個」。它把直播、重播、過往活動放在同一個資訊架構裡，等於先把路鋪好，再讓內容上場。\u003C\u002Fp>\n\u003Cfigure class=\"my-6\">\u003Cimg src=\"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1784030597301-y4m2.png\" alt=\"OpenAI Live 把直播變可重播模板\" class=\"rounded-xl w-full\" loading=\"lazy\" \u002F>\u003C\u002Ffigure>\n\u003Cp>我以前也做過一個小工具的發表頁，當時我們很愛把 banner 做得很大，結果使用者進來只知道「有活動」，不知道「這活動到底改了什麼」。後來我才發現，大家不是不看，是看不懂。OpenAI Live 比較聰明的地方就在這裡：它先回答資訊問題，再談氣氛。\u003C\u002Fp>\u003Cp>實操寫法很簡單，頁面第一屏只留三件事：現在是 live、這支 replay 是什麼、下一場是什麼。不要把 CTA 塞滿整頁，也不要讓使用者自己猜狀態。你如果要做 launch hub，先把資訊順序排對，其他花樣都能晚點再加。\u003C\u002Fp>\u003Cul>\u003Cli>第一屏先講事件類型：發表、demo、公告。\u003C\u002Fli>\u003Cli>把 live \u002F replay \u002F archive 分成清楚的區塊。\u003C\u002Fli>\u003Cli>每個區塊都要能獨立理解，不靠上下文。\u003C\u002Fli>\u003C\u002Ful>\u003Ch2>它把重播當主菜，直播只是入口\u003C\u002Fh2>\u003Cp>這點\u003Ca href=\"\u002Fnews\u002Fmetacognition-in-llms-foundations-progress-opportunities-zh\">我覺\u003C\u002Fa>得很多團隊都搞反了。直播當下很熱鬧，但真正會留下來的人，通常是之後才來的人。OpenAI Live 的頁面結構很明顯是在照顧這群人：你錯過直播沒關係，重播和過往事件還在，而且路徑不難找。\u003C\u002Fp>\u003Cp>白話講，重播不是備份檔，重播才是主要資產。因為大部分開發者不是即時收看，他們會晚點看、跳著看、搜尋關鍵片段看。你如果只顧直播當下的氣氛，等於把最有價值的內容丟給少數即時在線的人。\u003C\u002Fp>\u003Cp>我自己最常遇到的狀況，是團隊把 demo 講到第 18 分鐘才\u003Ca href=\"\u002Fnews\u002Fgpt-5-6-microsoft-365-copilot-preferred-model-zh\">進入\u003C\u002Fa>重點，然後結束後還很有自信地說「影片有放」。有放不等於有用。OpenAI Live 的設計提醒我，頁面本身就該幫觀眾補上下文，不然 replay 再完整也只是長影片。\u003C\u002Fp>\u003Cp>實操上，你可以這樣做：重播頁面先放 2 到 3 句摘要，說清楚「這次改了什麼、跟誰有關、為什麼要看」。如果平台支援，直接把最重要的時間點標出來。不能標 chapter 也沒關係，至少先把關鍵段落寫出來。\u003C\u002Fp>\u003Cul>\u003Cli>重播頁要有摘要，不要只放影片。\u003C\u002Fli>\u003Cli>把最重要的變更寫成一行可掃描的文字。\u003C\u002Fli>\u003Cli>讓晚到的人 30 秒內知道這支影片值不值得看。\u003C\u002Fli>\u003C\u002Ful>\u003Ch2>它把摩擦壓到最低，因為活動頁最怕人卡住\u003C\u002Fh2>\u003Cp>我看 OpenAI Live 的時候，最有感的是它很少廢話。沒有一堆奇怪跳轉，沒有叫你先理解一整套活動系統。這種東西乍看很無聊，但做過 launch page 的人都知道，真正會害死人的是小摩擦：點不到、看不懂、分不清現在到底是直播還是回放。\u003C\u002Fp>\n\u003Cfigure class=\"my-6\">\u003Cimg src=\"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1784030597717-8kmb.png\" alt=\"OpenAI Live 把直播變可重播模板\" class=\"rounded-xl w-full\" loading=\"lazy\" \u002F>\u003C\u002Ffigure>\n\u003Cp>翻譯一下就是，活動頁的 UX 不是裝飾，是門口警衛。門口如果卡住，後面內容再好都沒用。我曾經看過一個新創把 demo 藏在三層導覽後面，還要求先登入才能看，然後怪沒人參加。不是沒人想看，是你把路做壞了。\u003C\u002Fp>\u003Cp>這種頁面最實際的寫法，就是每個狀態只給一個主動作。live 就是看直播，upcoming 就是看下一場或加行事曆，replay 就是直接播放。不要同一張卡片上塞三四個按鈕，使用者不是來解題的。\u003C\u002Fp>\u003Cp>如果你是做給\u003Ca href=\"\u002Ftag\u002F台灣開發者\">台灣開發者\u003C\u002Fa>看，還有一個很現實的點：很多人會先在手機上看到連結。手機上更不能亂。標題要短、狀態要清楚、按鈕要大，這些都比你想像中重要。\u003C\u002Fp>\u003Cul>\u003Cli>每個狀態只留一個主 CTA。\u003C\u002Fli>\u003Cli>標題直接講事件內容，不要靠語氣撐場面。\u003C\u002Fli>\u003Cli>手機首屏先能看懂，再談美術。\u003C\u002Fli>\u003C\u002Ful>\u003Ch2>格式固定，觀眾才不用每次重新學一次\u003C\u002Fh2>\u003Cp>我很喜歡 OpenAI Live 這種固定格式感。它的內容類型很明確：product launches、demos、announcements。這不是無聊，這是省腦力。觀眾知道自己現在要看的是什麼，也知道大概會從哪裡得到資訊。\u003C\u002Fp>\u003Cp>也就是說，格式本身就是產品的一部分。你每次發表都換一套說法、換一種版型、換一個命名，觀眾就得重新學一次。那很耗。對開發者來說尤其煩，因為我們本來就只想快速抓重點，不想陪你玩驚喜。\u003C\u002Fp>\u003Cp>我之前看過一個團隊每次 release 都換頁面結構，這次是長文、下次是影片、下下次又變成社群串。結果大家根本不知道要去哪裡找資訊。OpenAI Live 至少給了一個穩定的外殼：你知道這裡就是發表入口，剩下只要更新內容就好。\u003C\u002Fp>\u003Cp>實操寫法是把你的公開溝通拆成固定三段：開場一句話講變更、demo 講功能、結尾講下一步。每次都照這個順序走。你不用每次重新發明格式，觀眾也不用重新適應你。\u003C\u002Fp>\u003Ch2>歸檔不是備份，是讓人回頭查證的記憶庫\u003C\u002Fh2>\u003Cp>很多公司把 archive 做得像倉庫，丟進去就不管了。我覺得這很可惜。OpenAI Live 至少讓人感覺到，過往事件不是裝飾，而是可查、可回、可對照的內容庫。這對開發者很重要，因為我們很常需要知道「上次怎麼講的」、「這次跟上次差在哪」。\u003C\u002Fp>\u003Cp>白話講，歸檔是讓產品故事有連續性。你如果只有單次發表，別人看到的是碎片；你如果有整理好的過往事件，別人看到的是變化。這對理解產品方向、模型更新、功能演進都\u003Ca href=\"\u002Fnews\u002Fanthropics-j-space-useful-not-breakthrough-en-zh\">很有用\u003C\u002Fa>。\u003C\u002Fp>\u003Cp>我自己在看 \u003Ca href=\"\u002Ftag\u002Fai-工具\">AI 工具\u003C\u002Fa>更新時，最怕的就是官方只留一篇最新公告，舊的全散掉。你根本沒辦法比對版本差異。OpenAI Live 的好處，是它把 past events 放在同一個入口裡，讓查找成本低很多。\u003C\u002Fp>\u003Cp>實操上，你應該替每一場活動加一行可搜尋的描述，最好再補一個日期和主題。標題不要只寫很空的名字，因為那會害死搜尋。你要讓人一眼看懂，也要讓未來的自己找得到。\u003C\u002Fp>\u003Cul>\u003Cli>每場活動保留日期、主題、摘要。\u003C\u002Fli>\u003Cli>舊內容不要沉到頁尾看不見。\u003C\u002Fli>\u003Cli>歸檔頁要能被搜尋引擎抓到。\u003C\u002Fli>\u003C\u002Ful>\u003Ch2>這套方法可以直接搬去產品發表頁\u003C\u002Fh2>\u003Cp>我覺得 OpenAI Live 真正值得偷的，不是它的視覺，而是它的結構。它把「發表、說明、保存」這三件事串成一條線。你只要有這條線，直播頁、更新頁、內部 demo 頁都能套。\u003C\u002Fp>\u003Cp>翻譯一下就是：先讓人知道發生了什麼，再讓人看見怎麼發生，最後讓人以後還找得到。這比做一個華麗但一次性的活動頁實用多了。尤其對開發團隊來說，公開溝通本來就該可回放、可引用、可延伸。\u003C\u002Fp>\u003Cp>我不太喜歡那種只顧當下熱度的做法。你今天發完一篇公告，明天連自己都找不到，那就等於沒發。OpenAI Live 讓我更確定一件事：好的發表頁不是把聲量做大，是把資訊放穩。\u003C\u002Fp>\u003Cp>實操寫法你可以直接照這個順序：一句總結、live 狀態、重播、過往事件、下一步。只要這五塊齊了，頁面就能工作。其他像動畫、顏色、視覺語氣，都是加分，不是根本。\u003C\u002Fp>\u003Ch2>可抄的模板\u003C\u002Fh2>\u003Cpre>\u003Ccode>&lt;section class=\"launch-hub\"&gt;\n  &lt;p class=\"launch-hub__summary\"&gt;我們把產品發表、demo、公告放在同一個頁面，讓你能直接看直播、回放和過往更新。&lt;\u002Fp&gt;\n\n  &lt;article class=\"launch-hub__block launch-hub__block--live\"&gt;\n    &lt;h3&gt;Live now&lt;\u002Fh3&gt;\n    &lt;p&gt;目前正在直播，直接看這次發表的最新內容。&lt;\u002Fp&gt;\n    &lt;a href=\"\u002Fevents\u002Flive\"&gt;Watch live&lt;\u002Fa&gt;\n  &lt;\u002Farticle&gt;\n\n  &lt;article class=\"launch-hub__block launch-hub__block--replay\"&gt;\n    &lt;h3&gt;Replay&lt;\u002Fh3&gt;\n    &lt;p&gt;錯過直播也沒關係，這裡有重播和 3 句摘要。&lt;\u002Fp&gt;\n    &lt;ul&gt;\n      &lt;li&gt;這次改了什麼&lt;\u002Fli&gt;\n      &lt;li&gt;為什麼重要&lt;\u002Fli&gt;\n      &lt;li&gt;你下一步要看哪裡&lt;\u002Fli&gt;\n    &lt;\u002Ful&gt;\n    &lt;a href=\"\u002Fevents\u002Freplay\u002Flatest\"&gt;Watch replay&lt;\u002Fa&gt;\n  &lt;\u002Farticle&gt;\n\n  &lt;article class=\"launch-hub__block launch-hub__block--archive\"&gt;\n    &lt;h3&gt;Past events&lt;\u002Fh3&gt;\n    &lt;p&gt;整理過往發表，方便搜尋、引用和比較版本差異。&lt;\u002Fp&gt;\n    &lt;ul&gt;\n      &lt;li&gt;&lt;a href=\"\u002Fevents\u002F2026-07-launch\"&gt;2026-07 Product launch&lt;\u002Fa&gt;&lt;\u002Fli&gt;\n      &lt;li&gt;&lt;a href=\"\u002Fevents\u002F2026-06-demo\"&gt;2026-06 Demo update&lt;\u002Fa&gt;&lt;\u002Fli&gt;\n      &lt;li&gt;&lt;a href=\"\u002Fevents\u002F2026-05-announcement\"&gt;2026-05 Announcement&lt;\u002Fa&gt;&lt;\u002Fli&gt;\n    &lt;\u002Ful&gt;\n  &lt;\u002Farticle&gt;\n\n  &lt;section class=\"launch-hub__notes\"&gt;\n    &lt;h3&gt;What changed&lt;\u002Fh3&gt;\n    &lt;p&gt;這次更新了什麼、適合誰看、下一步去哪裡，都寫在這一段。&lt;\u002Fp&gt;\n  &lt;\u002Fsection&gt;\n&lt;\u002Fsection&gt;\u003C\u002Fcode>\u003C\u002Fpre>\u003Cp>如果我自己要落地，我會先把這模板塞進產品官網，再補一個每場活動固定格式的摘要區。這樣晚到的人看得懂，搜尋引擎也抓得到，團隊以後回頭整理不會全靠記憶。\u003C\u002Fp>\u003Cp>原始來源是 \u003Ca href=\"https:\u002F\u002Fopenai.com\u002Flive\u002F\">https:\u002F\u002Fopenai.com\u002Flive\u002F\u003C\u002Fa>，我這篇是拆它的頁面結構和溝通方法，模板是我重新整理後給台灣開發者直接抄的版本。另可參考 \u003Ca href=\"https:\u002F\u002Fopenai.com\u002F\">OpenAI 官方網站\u003C\u002Fa>、\u003Ca href=\"https:\u002F\u002Fwww.youtube.com\u002F@OpenAI\">OpenAI YouTube\u003C\u002Fa>、\u003Ca href=\"https:\u002F\u002Fplatform.openai.com\u002Fdocs\">OpenAI Docs\u003C\u002Fa>，把直播、影片和文件串成同一套發表系統。","我拆 OpenAI Live 的頁面結構，整理成一套可直接套用的發表頁、重播頁與公告頁模板。","openai.com","https:\u002F\u002Fopenai.com\u002Flive\u002F",null,"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1784030597301-y4m2.png","tools","zh","1e93ef63-9ec1-4fea-98f4-64a9519e096c",[17,18,19,20,21],"livestream","launch page","replay","event hub","product communication",[23,24,25],"直播頁要先解決資訊查找，不是先做氣氛","重播與歸檔才是長尾資產","固定格式能降低觀眾理解成本",0,"2026-07-14T12:02:48.940758+00:00","2026-07-14T12:02:48.929+00:00","ddbe17bf-4560-43f7-af76-3e7d6e08e601",{"tags":31,"relatedLang":32,"relatedPosts":36},[],{"id":15,"slug":33,"title":34,"language":35},"openai-live-launches-replayable-demos-en","OpenAI Live turns launches into replayable demos","en",[37,43,49,55,61,67],{"id":38,"slug":39,"title":40,"cover_image":41,"image_url":41,"created_at":42,"category":13},"8491db12-2ab9-4b65-8dc6-c9b7fd1ca267","cloudflare-one-partner-program-ai-security-rollout-zh","Cloudflare One 用夥伴加速 AI 安全落地","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1784037807706-id7p.png","2026-07-14T14:02:56.933008+00:00",{"id":44,"slug":45,"title":46,"cover_image":47,"image_url":47,"created_at":48,"category":13},"39150bf9-9a7d-4c9b-808b-e1419d814f63","openclaw-ollama-telegram-bot-zh","OpenClaw 讓 Ollama 變 Telegram 機器人","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1783949637366-zv39.png","2026-07-13T13:33:29.779328+00:00",{"id":50,"slug":51,"title":52,"cover_image":53,"image_url":53,"created_at":54,"category":13},"419deb6d-ea65-4fa7-9dd1-73763f373b53","bailian-token-plan-agent-credits-guide-zh","百炼Token Plan把Agent接入变简单","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1783929835818-cyp6.png","2026-07-13T08:03:24.024727+00:00",{"id":56,"slug":57,"title":58,"cover_image":59,"image_url":59,"created_at":60,"category":13},"5c5c6733-6f41-49ca-b61e-c0a53399c327","one-api-gateway-turns-six-ai-apis-into-one-zh","一個閘道把六個 AI API 收成一套","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1783883027640-gz6i.png","2026-07-12T19:03:22.171684+00:00",{"id":62,"slug":63,"title":64,"cover_image":65,"image_url":65,"created_at":66,"category":13},"953466bc-6d94-4ffe-944b-ac7728d09184","fde-playbook-fixes-broken-agent-projects-zh","FDE 讓烂尾 Agent 回正軌","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1783881221882-yw1n.png","2026-07-12T18:33:16.193979+00:00",{"id":68,"slug":69,"title":70,"cover_image":71,"image_url":71,"created_at":72,"category":13},"bd3b5d5c-02d9-49c4-8ca4-dcb6df373374","ai-zaobao-template-daily-to-reusable-report-zh","AI 早报拆成可复用周报","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1783879420413-rlwb.png","2026-07-12T18:03:11.617929+00:00",[74,79,84,89,94,99,104,109,114,119],{"id":75,"slug":76,"title":77,"created_at":78},"855cd52f-6fab-46cc-a7c1-42195e8a0de4","surepath-real-time-mcp-policy-controls-zh","SurePath 推出即時 MCP 政策控管","2026-03-26T07:57:40.77233+00:00",{"id":80,"slug":81,"title":82,"created_at":83},"9b19ab54-edef-4dbd-9ce4-a51e4bae4ebb","mcp-in-2026-the-ai-tool-layer-teams-use-zh","2026 年 MCP：團隊真的在用的 AI 工具層","2026-03-26T08:01:46.589694+00:00",{"id":85,"slug":86,"title":87,"created_at":88},"af9c46c3-7a28-410b-9f04-32b3de30a68c","prompting-in-2026-what-actually-works-zh","2026 提示工程，真正有用的是什麼","2026-03-26T08:08:12.453028+00:00",{"id":90,"slug":91,"title":92,"created_at":93},"05553086-6ed0-4758-81fd-6cab24b575e0","garry-tan-open-sources-claude-code-toolkit-zh","Garry Tan 開源 Claude Code 工具包","2026-03-26T08:26:20.068737+00:00",{"id":95,"slug":96,"title":97,"created_at":98},"042a73a2-18a2-433d-9e8f-9802b9559aac","github-ai-projects-to-watch-in-2026-zh","2026 必看 20 個 GitHub AI 專案","2026-03-26T08:28:09.619964+00:00",{"id":100,"slug":101,"title":102,"created_at":103},"a5f94120-ac0d-4483-9a8b-63590071ac6a","claude-code-vs-cursor-2026-zh","Claude Code 與 Cursor 深度對比：202…","2026-03-26T13:27:14.279193+00:00",{"id":105,"slug":106,"title":107,"created_at":108},"0975afa1-e0c7-4130-a20d-d890eaed995e","practical-github-guide-learning-ml-2026-zh","2026 機器學習入門 GitHub 實用指南","2026-03-27T01:16:49.712576+00:00",{"id":110,"slug":111,"title":112,"created_at":113},"bfdb467a-290f-4a80-b3a9-6f081afb6dff","aiml-2026-student-ai-ml-lab-repo-review-zh","AIML-2026：像課綱的學生實驗 Repo","2026-03-27T01:21:51.467798+00:00",{"id":115,"slug":116,"title":117,"created_at":118},"80cabc3e-09fc-4ff5-8f07-b8d68f5ae545","ai-trending-github-repos-and-research-feeds-zh","AI Trending：把 AI 資源收成一張表","2026-03-27T01:31:35.262183+00:00",{"id":120,"slug":121,"title":122,"created_at":123},"3ce6e6e2-bac5-463e-9f8d-45caabcc61f7","awesome-ai-for-science-research-tools-map-zh","AI 科研工具清單，開始像地圖了","2026-03-27T01:46:50.521945+00:00"]