設計師在設計稿的過程中，很容易陷入到某一個點中，對其他的細節選擇性忽視了。這個時候就需要在交稿前，對設計稿進行自查，把一些低級的錯誤扼殺在搖籃中。
自查表按照我自己的經驗，大致分為兩個大類，一個是設計稿本身，二是與其他頁面的統一性。在這裡有個建議，當設計稿做完的時候，先去上個廁所或者出去走一下，回來再來看，放鬆一下眼睛和思維。
一、設計稿本身
設計稿本身指的是就當前頁面來說，所存在的問題，包括沒對齊、圖標風格和大小不統一、間距過大過小、文字對比不明顯、圖片沒有鋪滿等等。
1.對齊
頁面上的元素必須得有它對齊的方式，左對齊、右對齊、居中對齊都可以，但一定要有明顯的能被人一眼看出來的對齊方式，不然就會覺得頁面上的元素是隨意放置的。
自查的時候首先要注意那些明顯的沒對齊的地方。（PS：為了方便大家看清楚差別，所以示意圖稍微誇張了點，實際大多是一兩像素沒對齊）
2.圖標
風格
檢查一下圖標的風格是不是一樣，比如面性的就都是面性的，線性的都是線性的。
大小
大小主要指的是圖標的大小在頁面中的比例，在視覺層面上是否合適，有些時候圖標本身風格、樣式都沒什麼問題，但就是跟頁面其他元素相比太大或者太小了。還需要注意一點，物理大小一樣不代表視覺大小也一樣，優先滿足視覺大小一致。
我自己之前就遇到過，當時特別認真的畫了一組圖標，信心滿滿覺得比之前畫的好很多，小溜Epik 看過之後第一反應就說太大了，不合適，過了一會我自己從那個畫圖標的興奮感中出來之後，自己再看也覺得太大了，跟整體不搭。所以這也是為什麼文章一開頭，就建議大家做完稿之後，出去晃悠一會再回過頭來看。
在這裡舉個例子吧，介於當時的圖不合適發出，特此憑湊了一張圖，不過意思是一樣的。
左邊的圖標單個看沒什麼問題，但和文字放一起，圖標就顯得整體大了很多，看起來及其不協調。而右邊就看起來般配一點。
3.間距
間距的作用是用來區分層級，間距的大與小或多或少會影響到這一點。正如《寫給大家看的設計書》中所說的親密性一樣，區分層級的本質也就是區分親密性，頁面上間距最小的，親密性最強，屬於同一層級；頁面上間距最大的，親密性最弱，不屬於同一層級。
自查的時候需要著重看一下，信息層級是否區分開了，比如兩個模塊之間的間距一定是要大於模塊內部的。
4.對比
區分層級除了通過間距還可以通過對比，對比的方式、種類有很多種，這裡就不一一展開說了，這裡只講文字間的顏色對比。以討論區為例，討論區一般包含用戶頭像、暱稱、時間、評論內容以及一些輔助的功能，點贊收藏、評論、回覆那些。
下圖中網易新聞和喜馬拉雅兩者相比起來，就信息層級來說，網易新聞區分的更開一點，層級更明確。
而去對比它們頁面所使用的顏色，就可以發現，網易新聞的顏色對比度更大，對比度大，信息自然而然就更明顯了。
而我們在交付前的設計自查時，就需要著重檢查一下頁面的信息是否區分開了，對比度是否合理。這一點算比較深層次的自查了，新手可能很難發現問題，這時候可以去尋求他人的幫忙，比如同事、朋友等。
5.圖片
在 Sketch 裡，大家都是畫一個矩形，然後和圖片一起做成蒙版，但有時候會出現圖片沒有鋪滿整個矩形。
有時候圖片比較小，比如頭像的時候，手機預覽的時候不容易被看到，所以在自查的時候最好把設計稿放大放大看細節。
二、頁面統一性
頁面統一性指的是 APP 整體的統一性，輸出的設計稿是否和之前統一，同時輸出的幾個頁面是否統一等等，這個時候就需要跳出單個頁面，來看整體了。最容易出錯的問題分別是：兩個頁面同一位置的元素位置出現偏移、分割線顏色不一樣、按鈕的圓角度不統一等。
1.位置偏移
這個真的很多人都會栽在這個坑裡，原因我猜是做設計圖的時候，都是電腦連著手機實時預覽，預覽軟件在翻頁的時候，是直接出現新的頁面，不是那種上一頁下一頁翻頁的形式。所以當元素位置發生偏移的時候，純靠手機預覽很難發現。
至於解決方案也很簡單，只需要自查的時候，把所有圖按照順序導出，全部選中進行預覽，這個時候頁面元素動了的話，在翻頁過程中極其明顯，發現有出錯的地方，重新修改再導出，直至沒有問題為止。
2.分割線
分割線也是一個極易容易出錯的地方，特別是最開始做的時候沒有定義分割線的顏色，隨便用一個，後續覺得不好，又改了，改的又不徹底，有些地方沒改到。加上分割線顏色普遍偏淺，不仔細看很難發現。
這個自查的時候，通過翻頁預覽，發現後也能修改，不過還有一個更好的辦法，從源頭改變。前期把分割線都做成 Symbols，統一用，後期自查的時候，只需要檢查分割線是否用的是Symbols ，是的話顏色肯定是一樣的。
3.按鈕圓角度
檢查不同頁面的按鈕圓角度是否一致，不一致的地方要統一，定好規範之後，後續所有的頁面都需要延續。
小貼士：
當有人告訴你，你的頁面有細節問題的時候，千萬不要解釋，這個時候乖乖認錯就好，你越解釋別人越會覺得心裡不舒服，不解釋可能沒什麼，一解釋就有可能減分了。
三、總結
在設計稿輸出交付前，設計師需要對自己的設計稿先自查一遍，避免出現低級錯誤。不然這些錯誤持續出現，每次都等別人發現，會影響你在團隊中的形象。
自查主要分兩個方面，一個是設計稿本身，需要注意頁面元素對齊、圖標風格大小和頁面整體搭配、間距要能體現親密性、文字對比要明顯；二是頁面整體的統一性，需要注意的是避免出現同一元素不同頁面位置發生偏移、分割線顏色統一、按鈕的圓角度統一等。
原文地址：https://www.ui.cn/detail/424451.html
作者地址：https://i.ui.cn/ucenter/292869.html
閱讀更多 UI小志 的文章
