南順網絡
UI設計師：規範、方法、一(yī)緻性，真有那麽重要？
(一(yī))
規範，方法，一(yī)緻性，重要的(de)一(yī)面。
1、規範
當我們剛從事UI設計時，自(zì)身對于用戶體驗設計的(de)積澱還不夠厚實的(de)時候，遵循設計規範是最保守但也是最合理(lǐ)的(de)做(zuò)法，因為(wèi)這種解決方案更加成熟和(hé)通用，也有了一(yī)定的(de)用戶認知。同時像公司內(nèi)部的(de)設計規範，有利于版本叠代的(de)開發及設計效率，包括新人入職後更快上手工作，避免出錯。
所以了解ios設計規範，安卓設計規範，或者是公司內(nèi)部的(de)設計規範等等，成為(wèi)設計師必備的(de)技能…
2、方法
這裏說的(de)方法是指設計工作中的(de)方法論。運用方法論，能夠幫助設計師明确如(rú)何一(yī)步步的(de)進行整個項目，更高(gāo)效的(de)推導設計，達成目标。從而說服合作的(de)同學(xué)，而且看起來非常的(de)有理(lǐ)有據。下面是我們常見到的(de)一(yī)些導圖例子(zǐ)：
3、一(yī)緻性
為(wèi)了減少用戶學(xué)習成本，不管從視(shì)覺還是交互層面我們都要遵循一(yī)緻性。
包括同一(yī)個産品不同終端，要保持視(shì)覺統一(yī)性，才能加深用戶對産品品牌的(de)認知，這些也都沒毛病。
下面是鹹魚，頂導航顔色采用黃色，為(wèi)了各端一(yī)緻性。
(二)
但是，我們會看到更多優秀的(de)創新的(de)設計正在一(yī)步步脫離(lí)這些條條框框，從而做(zuò)出讓人眼前一(yī)亮(liàng)的(de)設計。所以我在思考在接下來的(de)設計中，需要做(zuò)的(de)幾點來幫助自(zì)己成長(cháng)：
1. 跳出規範
工作的(de)前一(yī)兩年(nián)，研讀并遵循着平台設計規範，從而幫助我們在工作中做(zuò)出不會出錯的(de)設計，同時提升工作效率和(hé)說服力。但是随着自(zì)身經驗的(de)累積和(hé)成長(cháng)，需要對此産生警惕，如(rú)果我們一(yī)直局限在别人制定的(de)規範裏，不去(qù)思辨，很容易陷入十年(nián)如(rú)一(yī)日的(de)工作狀态中，很難做(zuò)出創新的(de)設計。
同時也可(kě)以看出很多優秀的(de)設計作品，陸續跳出規範，不局限于規範制定的(de)像“最大字号多少px”，“導航條多少px”，“上下間距多少px”等等… 而是設計出符合自(zì)己産品氣質的(de)界面。下面有幾個例子(zǐ)：
下面是蝸牛裝修APP的(de)設計，可(kě)以看出：
頂部區域并沒有明确的(de)模塊區分導航區域，而隻有滑動時，導航的(de)分隔才出現。
字号和(hé)間距的(de)大小，也讓人浏覽起來更加放松。
像VUE的(de)處理(lǐ)，沒有嚴格遵循平台設計規範所謂的(de)列表的(de)的(de)高(gāo)度，而是用紅(hóng)的(de)線條區分模塊，間距來區分列表的(de)內(nèi)容，反而更符合産品本身的(de)氣質。下面是大家所熟知的(de)Airbnb，它大膽的(de)體驗設計被設計師們追崇模仿，這裏想說的(de)是它對底導航和(hé)按鈕大小的(de)處理(lǐ)，也是跳出規範，更符合功能本身的(de)重要層級。
2. 弱化方法
上面有講到設計方法論如(rú)何幫助到我們的(de)設計，使用過程當中，我們知道(dào)每一(yī)步應該怎麽分解和(hé)運用。例如(rú)：市場調研、頭腦風暴、梳理(lǐ)線上流程、研究了信息架構，并且還通過體驗地(dì)圖分析了行為(wèi)路徑……
但是往往最後的(de)設計方案和(hé)前期的(de)調研沒有什麽關系，而且複用到任何産品設計的(de)前期都适用。所以，我認為(wèi)這屬于自(zì)我感動式的(de)設計。感覺自(zì)己做(zuò)了很多，但是真的(de)往深入去(qù)問why why why的(de)時候，很多設計師都會被卡住。
因此一(yī)定程度上我們要弱化已知的(de)設計方法，少一(yī)些套路和(hé)形式主義，多一(yī)些深度解析的(de)方式做(zuò)設計。
3. 不局限統一(yī)
在設計工作中，我們考慮着界面與界面的(de)統一(yī)，端與端的(de)統一(yī)，這樣當然沒錯。但是我發現很多同學(xué)，都會過度的(de)陷入所謂的(de)統一(yī)，生怕做(zuò)任何一(yī)個東西與統一(yī)相違背。
比如(rú)産品裏面是線性的(de)圖标，那麽就絕不允許有面狀的(de)出現;線性的(de)圖标如(rú)果是2px，那麽全局各端都必須是2x;如(rú)果web端功能引導頁面是真實照片的(de)，那麽别的(de)端必須統一(yī)用真實照片等等…
這些問題我也遇到過，但是我發現是自(zì)己太局限裏面了，其實我們應該考慮的(de)是針對不同終端的(de)使用場景，用戶群體，在局部統一(yī)的(de)基礎上，可(kě)以做(zuò)差異化處理(lǐ)，是沒有問題的(de)。包括icon的(de)處理(lǐ)，也可(kě)以根據功能的(de)強弱，出現的(de)時機，做(zuò)差異化處理(lǐ)。而不是固執的(de)堅信隻要不統一(yī)那就是錯的(de)，設計決策并不是非黑即白的(de)。
比如(rú)，google drive的(de)引導頁面，在移動端用的(de)是矢量插畫的(de)處理(lǐ)，在web端更強調的(de)是産品官方形象，用的(de)是真實照片，貼近生活。隻是通過logo主色來延續品牌的(de)DNA。
編輯:--ns868
