什麼是手機模具?
手機模具是套在截圖、影片或介面外面的裝置外形,讓設計出現在真實比例裡。和一張平面 PNG 貼圖不同,三維模具可以改鏡頭和鉸鏈,螢幕內容仍然貼在玻璃上。
瀏覽器內免費
響應式頁面會隨你摺疊,從封面螢幕展開到內雙螢幕。拖入自己的圖片或影片、裁切後,再匯出 MP4。
自訂畫面畫在 HTML 畫布上,貼到 Duo 內螢幕和外螢幕。鉸鏈是活的滑桿,不是 GIF。錄製匯出的是帶著你內容的三維畫面。
這一頁就是工具。自訂內容畫在 HTML 畫布上,貼到 Duo 螢幕,並在瀏覽器裡錄成片。
示範網站會從第一螢幕重排到雙螢幕寬度。也可以拖入檔案並拖曳裁切,就像擺大頭照一樣。
拖滑桿時 1:1 跟著。鬆手後從當前動作彈簧落到打開或合上。
錄一段帶你內容的開合,下載能播的 MP4。不經過遠端算圖。
靜幀貼圖不夠時,讓鉸鏈跟著故事走。
讓應用或網站在摺疊螢幕上打開,然後匯出這一鏡。
丟進直式影片,摺疊裝置,同一條檔案去投廣告或社群。
把設計靜幀貼到兩塊螢幕上,不用離開瀏覽器。
留在這一頁,不用裝軟體。
自訂模式會先放一個會隨手機打開而展開的響應式頁面。拖入圖片或影片即可裁切並擺位。
拖滑桿。跟手;鬆手後彈簧落到打開或合上。
把一次開合錄成 MP4。編碼在瀏覽器裡完成。
靜幀手機框撐不起故事的時候。
不用電影級算圖,也能讓產品介面在摺疊螢幕上打開。
丟進影片,踩著節奏摺疊,匯出這一鏡。
把落地頁截圖貼到兩塊螢幕上,今天就能出片。
需要真實手部底片,而不是三維模具?
手機模具是套在截圖、影片或介面外面的裝置外形,讓設計出現在真實比例裡。和一張平面 PNG 貼圖不同,三維模具可以改鏡頭和鉸鏈,螢幕內容仍然貼在玻璃上。
摺疊手機模具的鉸鏈角度是活的參數。合上時看到外螢幕,打開時看到內螢幕。同一段內容可以隨角度鋪到兩塊螢幕上。
除非對方網站回傳跨域標頭,瀏覽器會把別的網站像素當成私有。畫到畫布上等於讓工具讀這些像素。沒有標頭時,老實的做法是拒絕嵌入,改收上傳的截圖或影片。
除非資源帶跨域標頭,跨源內容不能畫到畫布上,以免一個頁面讀到另一個網站的像素。
MDN — CORS ↗WebCodecs 讓網站在瀏覽器裡編碼畫布或影片幀,而不把幀傳到伺服器。
W3C WebCodecs ↗FAQ
歡迎提問!