編輯導語：規(guī)范的制定對頁面的設計尤其重要，好的頁面設計，能夠吸引更多的用戶。那在頁面設計中，為什么需要制定規(guī)范呢？本文從原因、制定過程、推進三個部分詳細地為大家介紹規(guī)范的制定。一起來看看吧。

無規(guī)矩不能方圓，在頁面設計中亦是如此，規(guī)范的制定尤為重要，大到一個app的整體視覺，小到一個banner，卡片。都可以通過規(guī)范的制定形成統(tǒng)一的設計標準。

一、為什么需要制定規(guī)范

1. 設計規(guī)范有助于團隊內部協(xié)作，提升工作效率

有了清晰明確的設計規(guī)范，設計師可以通過設計組件進行快速搭建，大大提高設計師的工作效。

提升設計師之間的內部協(xié)作，同時也便于與產品及開發(fā)之間的溝通。

2. 設計規(guī)范有助于視覺統(tǒng)一

在日常工作中，同一個項目需求可能會由多個設計師負責維護，如果沒有統(tǒng)一的規(guī)范，每個設計師都進行自由發(fā)揮，會導致頁面風格多種多樣，難以保持統(tǒng)一。

通過規(guī)范的制定，可以使整個頁面的視覺統(tǒng)一，提升用戶體驗，增強品牌感。

二、規(guī)范的制定過程

在頁面中，有很多位置都需要設計師制定相應的設計規(guī)范。

例如到家app首頁feed流里需要增加運營位卡片，以提升轉化。

卡片內容涉及日常保潔、維修清洗、保姆月嫂等多個業(yè)務范圍。為了后續(xù)的維護以及視覺的統(tǒng)一性，對此我們制定了相應的設計規(guī)范。

整個卡片由主標題、標簽、副標題、活動內容、背景色、裝飾元素組成。

在卡片設計時不能僅局限于單個卡片中，同時也要將卡片放在整體頁面去中看，保證卡片與整體頁面的統(tǒng)一性。

在卡片標題上，因為卡片的內容不固定，所以在設計的時候需要考慮主副標題的最長字段限制。

給出最長限制字段，并與需求方及時進行溝通，避免字段展示不下的情況。

在卡片內容上，要考慮多種活動內容形式，并做出相應的樣式展示，保證視覺的一致性。

在卡片背景上，背景色采用了到家app定義的色彩規(guī)范，使卡片的顏色與整個app進行統(tǒng)一，并通過裝飾元素豐富卡片細節(jié)。

共產出四個背景色，可根據(jù)卡片內容選擇相應的卡片模版進行設計輸出。

通過最終的設計結果，制定相應的設計規(guī)范，并與相關同學達成一致。

輸出規(guī)范文檔并及時進行同步，推動落地與實施。

以上是我在項目中的一些思考過程。

希望在日后的不斷迭代中可以做的更好，思考更全面。

三、關于規(guī)范的推進

規(guī)范文檔相當于設計使用說明書，光有說明書還不夠，還需要建立相應的審核機制。

經設計師內部審核過后，推動最終上線。

規(guī)范是否合理，通過對規(guī)范的應用可及時獲取反饋，我們還需要不斷進行打磨和沉淀，做出相對應的更新及調整。規(guī)范修改優(yōu)化后要及時更新規(guī)范文檔，并同步給相關設計人員。

有了規(guī)范我們就必須百分百按照規(guī)范來做嗎？

隨著業(yè)務的不斷發(fā)展，會有更多業(yè)務訴求。

一定會有當前規(guī)范無法滿足需求的時候，后續(xù)也會作出相應的優(yōu)化調整。

作者： 環(huán)鐵藝術家，微信公眾號：58UXD

本文由 @58UXD 原創(chuàng)發(fā)布于人人都是產品經理，未經許可，禁止轉載。

題圖來自 Pexels，基于CC0協(xié)議。