Pages

Monday, July 09, 2018

[Web應用] Shotsnapp 讓你一指搞定 Mockup 視覺稿,操作簡易又流暢

現在運用網路工具做視覺稿 Mockup 很輕鬆,不用像以前在 Photoshop 大費周章弄一張圖片,而且選擇種類多,套用在手機、電腦、平板電腦各種 3C裝置,還有人物情境圖,可說是方便許多。Julia 曾整理一個 Mockup 工具清單,可惜沒有持續更新,現在只要發現一個新的應用服務,試用覺得不錯,以後再多整理。


shotsnapp00

各式網站套用操作模式大同小異,找到模版,再把自己選定的圖片上傳,即能有一張不錯的視覺稿可供下載。今日 Julia 要介紹的 Shotsnapp 又有何特別之處呢? 我必須先說明 Shotsnapp 目前是 Beta 版,種類不是很豐富,也沒有人物、背景情境可選用,但操作步驟卻是直覺又簡易,值得期待它下一次版本更新。

https://shotsnapp.com/

Shotsnapp 目前只有手機與瀏覽器模版可選,其他如電腦、平板電腦與穿戴裝置模版顯示 Coming soon,還沒有上架:剛開始選用 Phone 手機類別,在 Model 機型裡可挑的種類也不多,但也不用刻意針對這點挑剔。版型尺寸 Default 設定 為 1:1 比例,需在 Canva 把圖片長度調高,背景顏色與不透明度都可調整,在 Model 下方有對齊點,選定置中就好。


↓先選好圖片尺寸再套用自己的圖片
shotsnapp01

↓目前 Beta 版只有手機與瀏覽器模版

shotsnapp02


↓ 選擇瀏覽器種類
shotsnapp03


再來就是用拖曳方式,從電腦選一張圖片,拉近模版,馬上準備按右下角綠色按鈕 Download image,即可下載。從拖曳到下載,整個流程相當流暢,速度也快,瞬間一張模擬圖大功告成,可以馬上放進簡報、網站。

若要說 Shotsnapp 缺點除了還沒有足夠模版選項以外,就是把圖片拖曳進入模版後,無法在手動調整大小,或滿版套用,使用前必須先搞定圖片尺寸,免得不夠吻合。

★ 感謝你喜歡這篇文章,轉載分享時請尊重作者著作權,註明出處及原文網址,我在 Google+Facebook 同步分享,歡迎留言交流。

Related Posts with Thumbnails