【我們為什麼挑選這篇文章】
同時身為 iOS 工程師和半個介面設計師的 Samuel， 工作領域跨越工程開發和介面設，在工作過程中便發現工程和設計合作時的各種眉角，於是將心得分享給各位。只能說 iOS工程師和設計師一定要看啊！裡面內容詳盡，把工程師該知道的設計相關背景，和設計師能夠考慮到的工程師難處，都一一寫出來了，看完就能少抱怨對方不懂你的專業了吧哈哈哈，要想合作順暢就靠這篇攻略了。
（責任編輯：謝秉芸）
2017–06–13 更新：
根據這篇內容所述，在 iOS 11 中將完整支援 PDF 向量格式的內容，換句話說……放進去的 PDF 將完整的保留向量格式，設計師再也不需要再考慮尺寸啦（撒花，當然還是要盡可能地降低圖片尺寸大小啦 xD）
本篇文章中提及的內容包含：
- Icon 的切圖該如何處理？
- PDF 圖檔要注意些什麼？
- PNG 圖檔要注意些什麼？
- 按鈕的切圖該如何處理？
- 設計師常常忽略的那點事
講在前面：其實啊其實，這一系列的文章本來想要取名叫做「與看不出圖片糊掉的工程師戰鬥系列」，開玩笑的（逃）。好啦，我只是想先跟各位夥伴說……文中所提到的習慣跟技巧都是以個人經驗為主，並不代表「怎麼做就一定是正確的喔」（超膽小）！能夠大家一起開開心心，快快樂樂工作的方法肯定就是好方法啦（越講越小聲）。如果內容有錯誤或是需要修正的地方歡迎各位前輩給予指教，讓我們大家一起加油吧！
前言
Hello，我是Samuel，目前是一個 iOS 工程師與半個介面設計師，歡迎各路夥伴交個朋友一起學習?。
由於前陣子剛好跟幾位設計師朋友聊到 iOS 切圖上面的幾個問題，意外的發現每位設計師在與工程師合作的過程中都會衍生出一套特別的合作模式（笑）；一直以來都想跟各位夥伴聊聊這種介於工程與設計之間模糊模糊沒有絕對對錯的題目，就好比在程式碼中，相同的功能並沒有絕對正確的寫法一樣（通常的處理方式是從某個維度找出一個當下的最佳解）。
在文章的內容中也會跟各位夥伴分享一些小弟我在誤打誤撞東拼西湊的過程中，逐漸養成的一些工作習慣與實作細節，希望多少能夠在工程與設計的合作上面提供各位一些參考。
在文章開始之前，我必須要特別謝謝「醒大」，一位在我踏入職場至今都持續不吝給予指導的大神級前輩；從程式開發、介面設計到程式架構上面都從前輩那邊學到相當多的經驗。
為什麼會注意到這些？
因為工作的關係，一路走來在開發跟介面設計上面大部分走的都是單打獨鬥的路線；至於共同合作的部分，由於合作的工程夥伴一個比一個厲害（Shou & Aydan），基本上一個眼神配上一張什麼都不用標注的介面圖稿（喂，我亂講的），夥伴們就能夠把畫面做到接近完美，就是那種不偷偷把你的設計間距除以二，不偷偷把字體調大10pt 或是不偷偷加動畫加 icon 的那種完美（各位偉大的設計師，介面被亂改的痛，我懂！！！因為我聽見你們的聲音啦！！）。
為了提升整體開發的效率，在開發與設計的過程中，我們都會盡可能地透過事前的規劃來降低溝通與設計成本，規劃的議題包含如何在 iPad, iPhone 的尺寸上面快速取得平衡（透過一些簡單的數學邏輯），如何標注跟設計能夠降低工程師/設計師彼此的負擔（找出讓我最省工的模式）等等；如何切圖的教學其實在網路上隨便一撈就可以撈到滿坑滿谷，但在這篇文章中要跟各位伙伴分享的是一些設計師可能從來不會注意到的，或是那些工程師從來就沒有告訴過你的切圖技巧與背後的原因。
關於 ICON
一般來說，大部分的設計師在輸出 icon 給工程師時，通常會在設計好 icon 在頁面上的尺寸之後，針對正常、點擊與不可點擊三種狀態分別輸出 PNG 檔給工程師使用；這樣的合作模式其實分工相當明確，同時也不會產生其他額外的「大問題」。
那你寫這篇幹嘛？當然是有原因的啊；有一些麻煩的事情像是當設計師想要微調 icon 的顏色，微調 icon 的尺寸，製作特定的動畫效果等等，往往需要重新輸出所有的圖檔，再請工程師重新置入所有更新的圖檔，一旦今天心血來潮決定來個大改版，把所有紅色的 icon 全部換成綠色的 icon 時……通常悲劇就很有可能發生。（工程師抵死不從，或是說好要幫你改但是不小心就失憶了?）
以我個人的習慣，在實際開始開發/切圖前我會評估 icon 設計的類型，以下圖兩個情境為例：
