有時候在網(wǎng)路上看到別人制作的插圖很有質(zhì)感，通常會在圖庫素材中整合自家產(chǎn)品，不但沒有違合感，還能解決類似照片不好拍出來的問題，其實不用透過專業(yè)軟體就有一些線上工具可以做到，例如Smartmockups除了網(wǎng)頁版以外還能付費購買Mac應用程式，其他像是Magic Mockups、MockUPhone或Dimmy.club都能滿足類似需求，當然圖庫相片多不多也會是選擇的因素之一。

本文要推薦另一款類似的免費服務「Mockuper」，可以快速將手邊的擷圖或任何相片整合到圖庫裝置螢幕中，Mockuper提供各種裝置類型，包括桌上電腦、筆記型電腦、平板電腦、手機、智慧手表和一些實體物件，例如名片、畫框、廣告看板或筆記本，只要選擇裁切范圍，調(diào)整后就能輸出各種尺寸大小的相片。

特別的是Mockuper 能為裝置螢幕內(nèi)的圖片加入「反射」效果，可再調(diào)整不透明度及反射形狀，讓它看起來更有真實感，目前Mockuper 收錄大約190 張素材，有部分在其他網(wǎng)站曾經(jīng)看過，但它在操作上還算好用，不過速度稍慢一些。

網(wǎng)站名稱：Mockuper
網(wǎng)站鏈結(jié)：https:///

使用教學

STEP 1

開啟Mockuper網(wǎng)站，從左側(cè)選取要使用的圖庫素材，點擊「Choose」大圖會顯示在網(wǎng)頁右側(cè)，同時在裝置螢幕中標示出建議置入的圖片長寬大小，如使用合適尺寸較能獲得最佳顯示效果。

網(wǎng)頁左上角可切換不同的裝置類型，包括桌上電腦、筆電、平板電腦、手機等等。

STEP 2

選好圖片后，要怎么把我的畫面整合到裝置螢幕中呢？很簡單，點選右側(cè)螢幕，就能進入圖片上傳及編輯功能，如果之后要清除，可直接點選上方「Clear」按鈕。

STEP 3

將你要呈現(xiàn)的圖片拖曳到中間虛線框。

接著調(diào)整要顯示的范圍，如果你依照Mockuper 建議，上傳合適的圖片大小，那么應該不用移動或放大縮小，就會符合顯示范圍；另外，左側(cè)是用來調(diào)整「反射」效果、不透明度和形狀的功能，如果套用反射后看起來很不正確，也可回到編輯模式將它關閉停用。

STEP 4

將圖片整合到素材畫面中，看起來非常真實，角落也不會出現(xiàn)鋸齒或顏色錯誤問題。若想再次調(diào)整編輯，可以點擊上方綠色的「Screenshot & Settings」按鈕。

STEP 5

最后，點選右下角的「下載」按鈕，挑選要下載的相片尺寸，從最小XS、S、M、L到最大張的XL ，不過網(wǎng)站沒有提示這些相片的實際尺寸。

點選后跳出相片，在上方點選滑鼠右鍵，找到「另存圖片」就能將相片保存下載。