Launch kit — 隨發布一起推出媒體內容
您正在製作的是 RELEASE 的媒體資產,而不是一支影片:一次拍攝已出貨的功能,就能成為發布所需的所有資產,並根據每個目標管道進行組合、調整尺寸和驗證,且保留為可編輯文件,以便下一次發布只需重新渲染,而不是重新拍攝。一切皆為資料;預覽即為渲染結果;在任何解析度下(最高 4K)皆可免費匯出,無浮水印;引擎採用 MIT 授權。
這個套件透過一個指令 vos deliver 進行渲染,其來源是承載著美學風格的文件:每一張卡片都是一個 POSTER 文件的一個影格(一個純粹的拍攝,其卡片位於海報想要的位置,並將文字和標記作為片段放置),每一個剪輯片段播放 vos plan 提議的動態(一個入場、一個結束卡、字幕、背景音樂),靜止時刻來自故事,兩個驗證器會用文字指出問題所在。deliver 不做任何組合編排。您的判斷力需要投入三個檔案(BRAND.md、LAUNCH.md、actions.json)、一個選擇(卡片遵循哪個架子上的海報)和一個決定(哪些時刻是故事),絕不用於手動裁切。
設定
npm i -D @vosjs/cli # vos CLI(包含拍攝管線)
系統路徑中的 ffmpeg 用於處理 CLI 未輸出的內容(PH 懸停 GIF),並讓 vos validate --picture 能讀取影片的第一幀和最後一幀。MP4 渲染需要系統中的 Chrome(--format mp4)。
1. 確立發布
在開始任何錄製之前,先確認五個事實:
-
交付了什麼 — 功能、版本字串、運行的網址。
-
哪些目標管道 — 每個管道的規格表以資料形式存在:
node_modules/@vosjs/cli/schema/channel-specs.json(CWS、Product Hunt、X、LinkedIn、GitHub、OG、YouTube;尺寸、數量、位元組和時長上限、字詞政策以及每個管道的安全矩形,以及每個圖片的 GENRE:screenshot是真實頁面,card是海報文件的一個影格;references/channel-specs.md是以表格形式呈現的相同資料)。**遍歷它,絕不要手動輸入尺寸。**詢問此次發布會推向哪些管道;預設使用上次發布的管道清單。JSON 中包含一個verified日期;如果超過一季,請在出貨前抽樣檢查管道文件。 -
品牌 — 在製作任何資產之前先解決它,絕不要預設使用版型的自有調色盤。專案資料夾中的
BRAND.md就是品牌套件(frontmatter 攜帶顏色角色bgA bgB bgC ink accent、字體角色fontDisplay fontBody、logoUrl(一個純粹的標記,絕不是平鋪圖示)、wordmark以及look,即網站自身要求的外觀呈現:一般網站用plate,深色網站用dark,否則用gradient)。如果沒有,vos brand <url>會從網站的/design.md、/llms.txt和頁面本身見證品牌,並寫入每個角色及其來源;閱讀它,修正頁面無法說明的部分,然後用vos recipe push BRAND.md --folder <slug>歸檔。將其放置在拍攝文件旁邊(或拍攝文件的父資料夾中):plan和deliver無需任何標記即可在此讀取它。 -
文字 — 與拍攝文件並排的
LAUNCH.md在其 frontmatter 中承載發布的角色,無需標記即可讀取:headline: "六個字以內
可換行,最多三行" # 海報和結束卡 kicker: "PRODUCT V2.1" # 如果不存在 = wordmark 加上 --release music: upbeat # 目錄別名或情緒;none = 靜音 entrance: tilt-in # tilt-in | pull-out | rise | none endCard: on # 官方 End card 範本;none 將其關閉;一個標題、vos id 或 doc.json 的名稱指定另一個 with: "Split cover, landscape@end" # 可選:任何放置在錨點(@end | @start | @step: | @)的範本 captions: on # none 關閉節拍字幕 poster: poster/landscape # 可選:每張卡片渲染自哪個文件 poster-tile: poster/tile # 可選:一個獨立的類別
標題是本次發布唯一要說的一行話;用 `\n` 跨越行數書寫。`vos plan` 在提議剪輯動態時讀取動態角色,`plan --style` 將文字輸入到海報中;`deliver` 只讀取 `poster` 角色,如果沒有,則會在拍攝文件旁邊尋找 `poster/<class>/doc.json`。
- **版型** — 卡片將遵循的海報,放在一個架子上。vos.so 上的官方 `Poster families` 專案為每個長寬比類別(landscape、square、portrait、tile)保存一個範例,以及其 `POSTER.md`,該文件說明何時使用哪個類別;創作者自己的專案也是同樣的結構。`vos folder pull poster-families` 會列出它們及其 vos id。沒有版型名稱,也沒有 `--layout` 標記:範例本身就是版型,透過資料複製。
目標管道決定了**視口**,在任何錄製之前:素材解析度 = 視口,一個 1280×720 的拍攝無法誠實地填滿 1920×1080 的影片規格。對於 1080p 套件,以 1920×1080 錄製;當目標管道尺寸更大時,以 2560×1440 錄製。
如果作品落在 vos.so 的專案(資料夾)中,請先拉取它,並讀取其中的每一個 `.md` 配方 — `LAUNCH.md` 綁定這個循環,就像 `CUT.md` 綁定一個剪輯,而 `POSTER.md` 綁定海報。配方會覆寫此技能文件的預設值。
## 2. 來源:一次真實事物的拍攝
套件是從**產品**製作的,絕非來自 mockup(商店政策同意:誤導性的列表圖片是違規行為,可能會導致商品被下架)。
**在錄製前像佈景一樣布置內容。**區分高級發布圖片和螢幕截圖的一半因素是螢幕上顯示的內容。在裁切任何海報或商店靜態圖片之前,`actions.json` 必須將產品置於一個自豪的螢幕截圖會顯示的狀態 — 輸入的標籤、看起來真實的資料、功能處於故事中間。`deliver` 會丟棄一個空白時刻(一個壁紙,一個空白畫布)並說明原因,但它無法為您布置場景。
**將故事寫入 `actions.json`。**為步驟提供一個 `id`(時刻和重新渲染循環通過它來定址),並在需要節拍的地方提供一個 `caption`(兩到八個字;`plan` 會將其提議為該步驟時刻的下方三分之一字幕,用於需要文字的剪輯)。在點擊導致導航後,添加一個 `wait` 等待載入:靜態圖片將在該等待的**結束時**被讀取,因此影格會顯示頁面,而不是載入中圖示。
- **全新錄製**:`product-video` 技能的循環(探索 → `actions.json` → `vos record --strict` → 調整 `doc.json`)。將 `actions.json` 保存在 repo 中 — 它是下一次發布的腳本。
- **已出貨功能需要登入**:在腳本執行前,透過 `product-video` 技能的階梯解決會話問題(完整內容請見 https://vos.so/llms-full.txt, "Sessions"):從 repo 已有的測試授權中建立一個,否則離機腳本化表單,否則人類手動登入一次(`vos session open <url> --name <app>`,然後使用 `--session <app>`),否則他們使用擴充功能錄製,您再進行剪輯。使用 `--storage-state <file>` 錄製。每個發布版本都會重新錄製,因此優先選擇不需要人類參與的階層:這是下一次發布時仍然有效的方案。絕不要輸入或接受生產環境密碼;將狀態檔案保存在拍攝文件之外,且不在 git 中;從演示帳戶錄製,因為商店列表顯示真實客戶資料是違規行為。
- **現有拍攝**:使用 `vos-cut` 技能進行剪輯。託管在 vos.so 上的拍攝文件可以透過 `vos fetch <vosId|watch-url> --out dir --media` 下載到本地。
- **已拍攝產品的新版本**:使用 `vos record` 重新錄製到**同一個**拍攝文件(素材被取代,剪輯以 `doc.prev.json` 的形式保留),然後 `vos plan take --reuse` 將剪輯重新計時到新的錄製上,並指出哪些部分無法跟進。絕不要從頭開始;每個修正都是對 `doc.json` 的編輯。
在其他地方渲染的動態圖形片段是一個**輸入**:它作為媒體疊加片段或背景放入文件中,絕不是反過來。
## 3. 海報和動態,作為文件
**剪輯透過資料運作。**一個新的 `vos plan` 會根據 `LAUNCH.md` 中的角色,將剪輯的動態提議寫入 `doc.json`:卡片的入場、END CARD(vos.so 上的官方 `End card` 範本,放置在結尾:卡片在最後一幀持續一秒的凍結幀上縮小,然後是標記、標題逐字出現、發布資訊行和網址落地;其片段標記為 `from: endcard`)、`with:` 命名的任何範本在其錨點的位置、每個步驟的字幕、背景音樂以及在拍攝沒有麥克風時每次按鍵的點擊音效;每個提議都有一個穩定的 id(`bed`、`click-<n>`、`caption-<step>`)。在現有剪輯上,`--motion` 會重新提議;刷新則不會,因此被刪除的結束卡將保持刪除狀態。範本是架子上的一個純粹拍攝,其片段帶有穩定的 id;引用是官方架子上的標題(`"End card"`、`"Split cover, square"`)、一個 vos id 或磁碟上的一個文件。在 studio 中打開拍攝文件,您所見即套件渲染所得。
```bash
vos plan take --motion --release v2.1
海報是一個 DOCUMENT,一個純粹的拍攝:卡片透過 frame.inset 放置(負值側邊會使其超出邊緣),透過傾斜軌道的靜止姿勢傾斜,文字和標記作為疊加片段,帶有穩定的 id(stage-title、stage-kicker、stage-brand、stage-mark),以及最後一個片段上的尾部 hold,其 START 就是靜止影格。為發布所需的每個長寬比類別(landscape、square、portrait、tile)製作一個,每個都使用拍攝文件自身的素材:
cp -r take poster/landscape # 或 vos duplicate <take vosId>,然後 fetch --media
vos plan poster/landscape --style <poster vosId|doc.json> --headline "…" --kicker "…"
vos frames poster/landscape --frame <rest>; vos validate poster/landscape
vos push poster/landscape --folder <project-slug> --label "poster, landscape"
plan --style <poster> 會複製 LAYOUT(卡片的放置和外觀、帶有來自 LAUNCH.md 或標記的發布文字更新後的舞台片段、其餘的傾斜、hold)到拍攝文件上,並保留拍攝文件自身的長寬比、瀏覽器 chrome 和剪輯;來自 BRAND.md logoUrl 的品牌標記會被擷取到 brand/ 中用於 stage-mark,並說明哪些部分無法跟進。將片段範圍縮小到關鍵時刻(縮放頂點、點擊後畫面穩定下來的反應),以便其餘部分顯示功能,而不是開場空白;產品可以繼續在卡片內部播放,直到 hold。然後查看 rest 影格:海報在推送前需要通過肉眼判斷。人類在 studio 中打開它,拖動卡片,就地重新輸入文字,移動 hold 的位置;vos pull --media 將這些變更拉回本地,下一次發布使用相同的 plan --style 從其自身推送的文件中重新填入文字。
4. 交付
vos deliver take --to cws,producthunt,x,linkedin,og,github,youtube --release v2.1
一次傳遞,指令會決定您過去需要手動決定的內容:
- **時刻。**靜止時間來自故事:每個步驟的結束加上一個穩定時間(點擊後等待的結束),然後是縮放頂點,然後是分散分布。每個候選時刻都會被當作真實頁面讀取一次;空白會被丟棄,同一影格的兩個候選會合併為一個,每個被丟棄的項目都會記錄在
skipped[]中。--times step:<id>[+offset]指定一個時刻。 - 螢幕截圖是真實頁面,滿版顯示:商店靜止圖片和圖庫預設會去掉剪輯的縮放、傾斜和瀏覽器 chrome(
--composed保留它們,並且圖片驗證會拒絕)