UI設計在視覺化介面操作的階段，與平面設計的交集是如何組織和處理每個介面的資訊。下面是YJBYS小編整理的平面設計基礎相關知識，希望對你有幫助!
1. 如何組織資訊
組織頁面資訊的首要任務是判斷資訊優先順序，分清重要資訊與次要資訊，刪除無用資訊。化繁為簡，降低視覺干擾。舉個小例子，數份簡歷扎堆時，資訊有效快速傳達是第一步，再者才是加入一點點自己的小個性。
2. 如何對齊
首先達成資訊優先順序主次的共識，可以提升排版的效率。
a. 資訊分組
先從一個酒店預定成功通知訊息案例來看，通知資訊文字平鋪直敘，並未合理分組(左圖)。圖片部分上方酒店評價、資訊地址和電話操作按鈕劇中對齊，酒店名成為了一個小標題。做適當調整後(右圖)，使得正文通知、價格和時間欄位分組明確。電話按鈕同酒店資訊組對齊，使得圖片區域的文字和操作資訊更為整體。
b. 居中對齊or左對齊
資訊分組後，居中排列每組資訊的小標題，模組感增強，使得閱讀標題和每個組資訊中產生視線的跳躍。小標題和每組資訊統一居左對齊，更符合快速瀏覽和操作。
3. 如何有重點
a. 大小對比
前面談了如何組織資訊，那如何使主要資訊更為有重點?首先可以通過拉開大小比例，拿一張活動海報來舉例。5米處能看到什麼?海報的大圖案渲染氣氛的整體感受;3米處能看到什麼?活動主標題;1米近距離又能發現什麼?具體資訊和時間等。
b. 並非均分
看似沒有什麼差錯的資訊佈局(左圖)，為什麼始終差了一些什麼?由於細節之處並非理解資訊主次。最初設計稿追求絕對的均分，導致資訊較散，沒有“組”的緊湊感。
頁面元素中的左右間隔往往也會被忽視，如(左圖)中帳號頭像與頁面的左邊距=帳號名稱之間間隔，使得頁面中間區域的資訊散於頁面邊界。具有平面設計意識的排版不僅是設計軟體中的文字框絕對居中對齊，需要對資訊分組與主次深入思考，避免機械的均分對齊。
UI設計中對平面基礎能力的檢驗
UI設計(User Interface介面設計)的設計原則：簡易性、一致性、使用者習慣、人性化等。遵循UI設計的設計原則，提高平面設計能力，可使得介面更為優雅。
1. 精簡與一致性
在手Q公眾號圖文訊息優化中，我們發現線上舊的圖文訊息邊距較為肥厚，在大圖+1小圖的.情況下由於程式碼的模組化拼接，始終無法達到完美的畫素間距。在考慮多種純文字、單圖、多圖文模版拼接後，儘量減少間距規則和字號種類，達到拼接模版的統一規則。保證一致性為前提，也提供靈活拼接的多樣性。
大圖+1的情況下，定義1條小圖的上下間距相等等於一個單位，而不是單個模組中小圖距離上方的1/2單位，在+n小圖的時候使得兩個小圖之間的間距相加後等於一個單位(見下圖)。這個小小的視覺細節在和技術同學耐心聯調後是可以完美實現的。
2. 操作的輕量化
在某電臺app概念設計中，討論後優化框架(右圖)，預設拉取專輯封面圖，支援上傳圖片入口置於右上角，預設歌詞展示在封面圖上可點選編輯，整個頁面可視化了最終分享出去的樣式，所見即所得。設計優化後，讓整個操作有了重點。可以直接在分享預覽圖上操作，縮短了分享路徑，最重要帶給使用者輕量化的操作感受。
平面設計靈感注入UI設計
好的UI設計可以讓軟體變得有個性和品位，同時操作上是簡單舒適的。平面設計的靈感，往往可以使得介面設計跳出線框與控制元件的束縛，充分體現軟體的定位和特點，使用過程中變得更有趣味。
1. 更具吸引力的點選
關注一個賬號、小站的通常app的做法是：頭像加關注按鈕。在 V 的頻道介面中，點選頭像即關注，按下後頭像成為星形遮罩，表示已關注，點選操作反饋超乎預期又在情理之中。
2. 更優雅的操作
在手機app上後期處理一張照片時，通常是操作區域和照片分開。Black 的處理照片主介面的操作有趣而直觀，再調整曲線或加暗角操作都在圖片層上，整個介面的導航也突破了傳統控制元件模組，使得整個app在直觀又易操作的基礎上，彰顯獨特的態度和個性。
