關注功夫體驗設計與十萬讀者見證成長的力量
作者| 劉濤
經常有同學問我如何定義設計規範,網上很多文章看完後還是雲裡霧裡的,不知道如何下手做,即使看懂了一些,但真正當自己做的時候,就不知道怎麼開始。
今天我們主要來說說定義設計規範的基本思路流程,以及如何從原有產品中全局梳理出組件,重新進行優化定義。
01
設計規範的意義

02
如何定義一個產品設計規範
設計規範的定義方法很多,不同的視角切入也會有不同的流程,今天我們分享主要以通用類型的思路,大家看完後這套底層的方法掌握,可以遷移到其他產品設計規範定義中。

NOKIA的設計規範

蘋果設計原則
再來說個例子,比如列表,定義方法一樣的,把單行列表,雙行列表,三行列表,各種分類整理,規則統一,比如行高都是基於8dp的倍數。


比如上圖,這些POPUP的場景圖形,同樣也是需要定義其位置和風格樣式,這些都是在規則裡面統一定義。
第五步:全局所有的組件,需要考慮命名規則。比如常用簡單命名方式,Btn_Ghost_Normal,這裡需要注意Btn是Buttons的縮寫,命名時候儘量可以使用縮寫單詞,其他組件也是同樣的思路。

當然命名方式很多種,可以根據自己業務和公司團隊協作方式來定。
第六步:到這一步基本上前面的定義完整了,這裡可以整理成UIKT和library輸出給團隊使用。
奧迪UIKT
03
設計規範優化和發展
設計規範並不是一層不變的,而是需要不斷使用,發現問題,然後優化調整到最好的狀態。
任何好的設計規範都是在不斷使用中,不斷滿足產品不同功能不同場景的使用需求。當然規範的發展壯大,並不是定義規則人的事情,需要整個團隊在使用過程中,發現問題後,即時提出來,交給規範小組去優化。
沒有什麼完美的規範,任何規範都很難去覆蓋到全場景,這就需要設計師個性化定製不同場景規則。
推薦閱讀
>>點擊圖片,閱讀往日推送>>
