俞靜：經常在網上看到一些介紹手機APP動效設計的文章，一直好奇這些動態(tài)圖片是怎么保存下來的。今天把這個小技能分享出來，UI設計師和想學優(yōu)秀動效的同學記得收藏！

自己在日常工作中也有看到好的動效設計要保存下來的需求——留著APP太占手機空間，刪了APP要用的時候又無法跟開發(fā)描述清楚。

要將手機APP里看到的一段動效保存成動態(tài)圖片（GIF），總的思路不外乎：先將這段動效錄屏，然后將這段錄制好的視頻轉換成GIF。

但由于iPhone系統(tǒng)權限問題，在不越獄的情況下，無法做到只用一部手機就搞定這些事情。在網上查閱了不少相關帖子，也咨詢了其他設計同行，摸索出一套自己目前覺得最滿意的方法，現分享給大家。

需要用到的配料：

• iPhone（iOS 需要升級至iOS 8）
• Mac（OS X 需要升級為Yosemite）
• PicGIF for Mac（一款小巧的格式轉換軟件）

目前給iPhone錄屏最方便的還是用Mac（好馬配好鞍...）。首先用手機數據線連接iPhone和Mac。找到Mac系統(tǒng)自帶的軟件QuickTime，雙擊打開。

在Dock欄上右鍵該圖標，選擇新建影片錄制（注意是影片錄制而不是屏幕錄制哦，這個設計的心智模型是不是很棒…）。

這時候你會看到默認打開的是mac攝像頭錄制的畫面（通常是自己的一張大臉）而不是手機屏幕的畫面。這時你需要點擊界面下方紅色圓點邊上的下拉箭頭，在菜單里選擇XX的iPhone這一項。

這時候就窗口變成了和你手機屏幕一樣的比例，同時顯示出了手機屏幕上的畫面。

That's it~?準備好之后，點擊界面下方的紅色圓點開始錄制，再次點擊停止錄制，這樣兩次點擊之間的操作畫面就被錄制下來了。點擊左上角關閉，在彈窗里選擇存儲。

接下來打開PicGIF這個軟件，點擊添加視頻，選擇剛才保存的那段視頻。

會看到一個視頻預覽畫面，右下角有一些參數供選擇：幀數越多，最后保存的圖片動效流暢度越好，但同時生成的圖片體積也越大。根據自己的需求把握，若沒有要更改的，直接點擊右下角的加載。

可以看到在界面底部，視頻已經被分成了一張張連續(xù)的靜態(tài)圖片（每一張代表一幀），你可以手動刪除其中看上去重復的幀，以減小最后生成的文件體積（通常在開始錄制和結束錄制時，操作會停止一會兒，這里會產生很多相同的幀，是可以刪掉的）。編輯完以后，點擊右上角的"創(chuàng)建GIF"。

預覽最終生成的GIF，點擊右下角的存儲。

好了，一張動態(tài)圖片制作完成！

歡迎關注作者的微信公眾號：

「優(yōu)設五月精品教程合集」

提升設計格調的漸變教程：
《實用教程！教你巧妙運用漸變色快速提升設計格調！》

將人物照轉成素描！
《PS教程！巧用濾鏡快速將人物照片轉成素描肖像》

3個酷炫的GIF 小動畫：
《PS教程！手把手教你繪制3個效果酷炫的GIF動畫效果》