原文鏈接：iOS 應用截圖神器 - ASOer 的福音

截圖是應用市場中展示 App 的三大視覺元素之一，在很大程度上驅動著用戶的下載行為，其重要性不言而喻。

市場上 App 截圖質量良莠不齊，一組優秀的截圖能讓人看一眼就有下載的衝動。那麼到底怎樣獲取並優化截圖呢？這裡面的玄機還真不少。

本文將著重介紹 App Store 應用截圖製作技巧，讓你省時省力地做出精緻美觀的截圖。

先來看看常見的幾種截圖方式：

1.耿直 boy 常用方法：手動截圖

毫無疑問，這種方法最耗時，還易出錯。手動截圖意味著：

你的工作量 = 1 組截圖（5張） × 支持的語言種類 × 所有設備類型（5.5 英寸屏幕, 4.7 英寸屏幕, 4 英寸屏幕, 3.5 英寸屏幕以及 iPad 的 2 種屏幕尺寸）。

小編表示對這種「苦力活兒」深有體會，邊截圖邊牛（liu）肋（lei），兩行血淚啊~~~

小編也見過很多 App 只準備了一種語言的截圖，但發布到所有的語言。對於這種看似 hin 「機智」的做法，小編想問一句，你腦海中有沒有預演過用戶看到你的截圖時一臉懵逼的樣子？截圖文案不做本地化，用戶看不懂，還會下載嗎？

另外，手動截圖的最大痛點是，當截圖中出現了小錯誤或 App 版本更新增加了新內容/功能，您就不得不手！動！把所有語言所有設備的圖重新截一遍。小編已經看到您兩行血淚的樣子了呢~

看這過程就很心酸呢，不多說了，來看看效果吧。

注意前三張截圖的大小、字體 ( iPhone 4, iPhone 5, iPhone 6 ) 其實是一毛一樣的。只有最後一張截圖 ( iPhone 6 Plus ) 中字體大小看起來像是三倍圖。（註：以下討論的截圖效果都使用的這四種設備）

2. 美工 boy 常用方法：想要啥圖做啥圖

有了美工哥哥，您的截圖工作就可以大大減輕了呢。目前 App Store 可上傳 5 張截圖，首頁展現出來的約為 2 張。也就是說，您只需要使用一種設備為每種語言準備 5 張截圖，然後美工哥哥幫你把截圖批量加工成各種不同的尺寸。省時省力又美觀。

美工哥哥還可以幫你將截圖添加一個設備邊框，你要的逼格這下都有了。下面這幾張圖便是這樣完成的，你只需要準備一張截圖就可以得到以下效果。

此處要注意：要給每一個屏幕尺寸選擇對應的正確的設備框架。

如果你還是覺得準備 App Store 截圖讓你很抓狂？

福音來啦！

iTunes Connect 新規則：

支持在所有的設備上使用一整套截圖，iTunes 會自動縮放圖片，讓每個設備都完美展示截圖內容。

運營狗們終於不用在截圖這件事上抓耳撓腮了，一套圖搞定所有設備。省時省力 2.0.

那麼接下來，小編就要開始放大招了。像手動截圖，美工作圖這種 low 雞的方法都已經被拍死在沙灘上並且曬成乾兒了。現在的運營大牛們都已經在使用神祕武器 – 自！動！截！圖！了！以下展示的全都是神祕武器的自動截圖的成果，先看看效果吧！

手機截圖效果

在iPhone 4, iPhone 5和 iPhone 6上，字體是完全一樣的。但是在 iPhone6 Plus 上，使用的是三倍圖，所以文字看起來大一些。

橫屏效果

iPhone 6 Plus 顯示了 App 橫屏時的分區屏幕。小一點的屏幕只能顯示列表。這樣，用戶在安裝應用之前，就能預先體驗該應用在自己的設備上是什麼樣子。

組圖效果

多語言截圖效果

不明嚼慄？我們當然會將此絕技傳授給您！不過這個技能，您可能需要請程序猿大哥的協助來完成。從此您就是截圖大牛了！膜拜！

見證奇蹟的時刻到了！（我已經焚香沐浴了，來吧！）

以上顯示的所有截圖都是利用神器通過兩步自動生成的：

準備截圖 – 神器 NO.1 Snapshot

使用 Snapshot 您可以自動截取所有設備上的本地化截圖。您只需要提供一個JavaScript UI 自動化文件，告訴 Snapshot 在您的應用中如何操作，在哪裡截圖即可。

這個步驟會準備好所有語言和設備的截圖原圖，如果您對截圖沒有過高的要求，您就已經可以把這些截圖上傳 iTunes Connect 了。

美化截圖 – 神器 No.2 Frameit

早期的 Frameit，只是為了給截圖加邊框。Frameit 2.0 可以添加設備邊框、定製背景以及給截圖加文字說明。

支持以下功能：

* 定製背景

* 使用一個關鍵詞+標題，讓屏幕看起來更色彩斑斕

* 可以使用自定義的字體

* 自定義文本顏色

* 截圖支持橫屏和豎屏

* 使用 .strings 文件來提供翻譯後的標題

* 支持 iPhone，IPad 和 Mac 截圖

相同的截圖在 iPhone, iPad 和 Mac 上的顯示效果

具體如何操作呢？

為了簡單起見，我準備了一個開源配置文件（open source setup）指導您用 Frameit 來獲取截圖，點擊文末「閱讀原文」查看詳情。

Framefile.json：包含了字體系列、字體顏色和背景圖片

Each language folder：包括一個 keyword.strings 和 title.strings，包含標題本地化的文本。

您現在需要做的就是運行 Frameit white，通過 Snapshot 開始截圖。

點此查看開源配置文件

這個是不是很膩害！

推薦閱讀：