經常在網上看到一些介紹手機APP動效設計的文章，一直好奇這些動態圖片是怎麼保存下來的。今天把這個小技能分享出來，UI設計師和想學優秀動效的同學記得收藏!

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

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

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

　　需要用到的配料：

　　iPhone(iOS 需要升級至iOS 8)

　　Mac(OS X 需要升級為Yosemite)

　　PicGIF for Mac(一款小巧的格式轉換軟件)

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

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

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

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

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

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

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

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

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

　　好了，一張動態圖片制作完成!