甲方爸爸說：這個圖你需要嵌到樣機里給我看，才有真實性嘛。老板說：這個圖你需要搞個好看的背景，才能夠更加吸引人。于是，你焦頭爛額的打開網(wǎng)頁下載樣機，再打開 PS 把圖片嵌入樣機。這個時候，隔壁小王早就做好了一切，開始了下一項任務(wù)。

小王是怎么做到如此迅速的呢？今天我就給你們來揭曉答案！原來是用了下面這些神器，點開瀏覽器，上傳圖片，調(diào)整參數(shù)，導(dǎo)出！一氣呵成，不需要任何下載，也不用打開 PS，就可以得到大氣美觀的樣機界面和背景界面。跟著我一起看看究竟有哪些界面展示神器吧。

mobile mockup

網(wǎng)站鏈接：https://www.kapwing.com/mobile-mockup

值得一試的理由：

• 點擊即可獲得漂亮的移動端模型圖，右鍵即可保存為 PNG 格式的圖片。
• 點擊上傳圖片，雖然網(wǎng)站上傳圖片的理想尺寸是 360×668，不過網(wǎng)站貼心的提供三種圖片嵌入模式：裁切、符合大小、拉伸，不想提前調(diào)整圖片尺寸的你，在這里可以自行選擇~
• 不想自己輸入色號的話，提供的背景顏色和樣機顏色搭配也會讓你生成一個漂亮的包裝界面。樣機還自帶陰影，讓你的素材更加凸顯。

screenzy

網(wǎng)站鏈接：https://screenzy.io

值得一試的理由：

• 想要漂亮的漸變色背景嗎？點擊上方鏈接，各種超好看超潮流漸變色便來到你的懷抱。導(dǎo)出圖片的格式為 PNG 或者 JPG 哦。
• 點擊即可上傳你的素材，有5 種外框可選，可分別調(diào)整背景的顏色、漸變角度、對比度、亮度、背景長度和寬度。
• 內(nèi)置 10 種英文字體，便于你添加標題或者說明，5 種模板樣式，讓你在焦頭爛額的時候快速生成過稿背景。

screely

網(wǎng)站鏈接：https://www.screely.com/

值得一試的理由：

• 你覺得點擊頁面，選擇素材再上傳，這樣很麻煩？這個網(wǎng)站擁有 3 種上傳素材的模式！可直接拖拽、可點擊上傳、也可復(fù)制圖片粘貼上傳。
• 自帶色板，可選擇你喜愛的顏色應(yīng)用到背景中去，并且可改變背景的高度和素材占整個頁面的比例哦，甲方爸爸說大一點，那我們就乖乖大一點。
• 雖然沒有花里胡哨的邊框加持，不過框頭是可以選擇的，并且可以根據(jù)個人的需要開啟邊框陰影。一切完成之后就可以導(dǎo)出為 JPG、PNG 或者 SVG 格式啦。

mockupphone

網(wǎng)站鏈接：https://mockuphone.com/#ios

值得一試的理由：

• 我發(fā)誓這是可以滿足你 60% 要求的樣機素材了，5 大類型，幾十種樣機模型供你選擇，不論是蘋果還是安卓，iOS 還是 Windows， 應(yīng)有盡有。連最新的 iPhone X 也有哦。
• 選擇你需要的樣機，根據(jù)推薦尺寸載入素材，如果跳過這一步也不要緊，網(wǎng)站會自動調(diào)整素材大小，你就可以獲得擁有舒適視覺效果的圖片。透明的背景便于你進行多樣的運用。
• 一次可以上傳多張素材！拖拽、粘貼、點擊都可上傳素材。右鍵即可保存，如果想要垂直和水平兩種方向的效果，就需要點擊下載按鈕，輸入郵箱，即可獲得zip文件。

dimmy

網(wǎng)站鏈接：https://dimmy.club/

值得一試的理由：

• 在糾結(jié)放在哪一個樣機模型里效果最好嗎？這個網(wǎng)站，你只要上傳你的素材，1秒即可在所有模型里看到效果，點擊選擇你需要的即可。
• 上傳的素材如果不是那么服帖的話，可以通過覆蓋、填充、包含和拉伸進行調(diào)配，達到視覺上的最佳效果。緊跟著更改背景顏色和透明度，下載即可導(dǎo)出 PNG 格式的圖片。

browserframe

網(wǎng)站鏈接：https://browserframe.com/

值得一試的理由：

• 這是一個專為各類瀏覽器界面包裝服務(wù)的網(wǎng)站，包含iOS、 Chrome、 火狐和IE等等常用瀏覽器的頁面，最終導(dǎo)出圖片的格式為 PNG。
• 可自行調(diào)整填充物的大小、屏幕比例和圖片的預(yù)覽效果。如果要修改背景色、屏幕顏色、屏幕的寬度和高度則需自己手動輸入，不過換角度想一想這也是另一種定制方式啦。

screen guru

網(wǎng)站鏈接：https://screen.guru/

值得一試的理由：

• 想要把這個網(wǎng)頁的圖片加進去，但是自己截圖總是截不好，要不是左邊多一點就是右邊少一點，那么這款快速網(wǎng)頁截圖的生成工具就是你的救星！
• 首先選用透明背景或自己定制背景顏色，輸入想要截圖的網(wǎng)址，回車，噔噔噔噔，自動生成網(wǎng)址頁面的截圖就閃亮登場了，右鍵保存即可生成 PNG 格式的圖片。
• 如果沒有生成出來，記得多嘗試幾次哦。

shotsnapp

網(wǎng)站鏈接：https://app.shotsnapp.com/#

值得一試的理由：

• 終于不是一張背景圖上只有樣機啦，這個神器自己會有一些簡單好看的版式供你選擇。不過只是部分的免費哦，包括一些蘋果手機、頁面、筆記本和臺式機，蘋果手表也有哦。
• 這里的樣機是可以用鼠標移動的！更改上傳素材的對齊方式、樣機的大小以及傾斜角度，根據(jù)你的想法讓呈現(xiàn)出來的界面更加活潑和具有設(shè)計感。
• 可自己上傳照片作為背景，如果沒有現(xiàn)成的圖片又急需的話，這個網(wǎng)站超級貼心的為你關(guān)聯(lián)了免費可商用的圖庫 Unsplash， 你可以在其中進行選擇。

以上都是靜態(tài)的展示界面，你說好像感覺不夠吸引人？想要 3D 和動態(tài)的界面展示效果！這里推薦一款神器絕對滿足你，需要的設(shè)計師們可以自行下載使用，雖然是全英文的，但是超棒的設(shè)計師早已經(jīng)做出了使用教程，讓你一看就會，下載鏈接和使用說明都在下面這篇文章里哦：
《過稿神器！動效視覺堪比蘋果宣傳片的3D樣機DesignCamera》

收藏這篇文章，在急需的時候就不會慌亂啦。運用以上這些神器，相信超級棒的你會在最短的時間內(nèi)生成最好效果的展示界面哦！