更新於 2023/05/18閱讀時間約 1 分鐘

7 步驟,輕鬆製作 iPhone Mockup

幾年前,要把 app 介面,做成 iphone Mockup 的畫面,不是用 photoshop 合成就是用 Illustrator 畫,下載 3D 軟體又覺得太麻煩。現在只要透過 Spline (3D界的 figma) ,打開瀏覽器後,7 步驟,就能簡單地製作一張 iPhone mockup 啦!而且還能隨心調整成你想要的角度!

前置作業

註冊 Spline 的帳號:https://spline.design/

步驟

步驟 1
到 Library 搜尋 iPhone 找到模型

步驟 2
左側圖層找到 Screen

步驟 3
右側 Upload image 上傳你要的截圖

步驟 4
上方或右側找到 Edit frame 可以輸入大小或拖拉 frame 範圍,這裡以 450x800 為例,待會輸出時可以再放大倍率

步驟 5,6
調整好 Frame 後,可以按滑主中鍵調整鏡頭,讓 iPhone 調整到你想要的位置,跳整好後按下 Export

步驟 7
選擇你想要的檔案格式,這裡以 PNG 為範例,Ratio 可以放大你 Frame 的尺寸,按下 Export 就完成了!

最後
你還可以旋轉模型,調整成你要的角度,也可以透過左側的圖層,選擇你要的元件,調整模型的顏色或材質。也可以在右側的 Camera 欄位中,新增一個自訂鏡頭,調整鏡頭的數值,改變拍攝範圍。

分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.