從創建規范,到精準落地
導語:為什么蘋果的設計如此吸引人?無論是軟件、硬件、品宣、廣告都繼承了其簡約、極致的設計精髓。在多元變化的市場環境下,為何它能一直保持一致的體驗語言,其實這一切源于他們的標準。
如何在產品設計中制定一套有效的規范標準,建立自己的產品設計語言?一般可以分為三個階段,探尋期、輸出期、落地期,這次就來分享一下如何創建一套完整的設計規范。
01 探尋期
1. 為產品尋找調性
調性是產品給用戶的整體感受,通過印象標簽讓用戶產生聯想并記住產品。包括顏色、字體、質地、布局等元素共同構成,形成統一氣質。
結合主要的用戶群體思考。拿字體來說:一般情況下小孩與老人字號大而醒目,青年群體適中且個性;所以,面對不同的用戶群體,需要設定易于該用戶群體閱讀的字體與字號。
從產品品牌去思考。挖掘當前的圖標語言趨勢,借鑒其表達方法融合在自己產品里,讓品牌基因與產品緊密關聯。
分析目前的視覺流行趨勢。讓設計方向保持前瞻性,借鑒融合,形成產品獨有的風格。如3D語言、流體視覺、多彩表達都是較為流行的表現手法。
結合對標競品進行思考。通常情況下競品會是最直接的參考資料,從排版、布局、空間,發現對手身上優質的思路,幫助產品更好發力。
02 輸出期
1. 定義顏色、LOGO、質感
通過對產品調性的準確判斷,錨定方向后可開始定義品牌色、LOGO、質感,為界面設計提供最基礎的設計單元。
顏色,由品牌色、輔助色、點綴色、字體色四種組成。主色根據產品關鍵詞推導;輔助色是主色相鄰色或對比色;點綴色常用于產品特殊和提醒狀態;而字體色一般與主色調和,讓整體視覺更加協調。
LOGO是一個產品的形象和符號,體現產品的底蘊和品味。一般產品LOGO、輔助形、品牌字體三個部分相互組合使用,從而達到一致的傳播效果。
質感要與產品定位相吻合。在純扁平的潮流之下,誕生了磨砂玻璃、新擬態、深度扁平等風格;在圖標、按鈕、頁面背景中都可以融入質感語言,幫產品提升設計品質。
2. 有效設計關鍵頁面
在設計關鍵頁時可以用刪格系統去規劃信息元素,讓布局更有規律。PC端一般為12列、平板為8列、移動端為4列;槽一般固定為4PX的倍數,如16px、24px、32PX等,列越多信息布局越靈活。
優先考慮輸出核心頁面。在產品輸出期都是爭分奪秒,我們可以先將產品一級核心頁面或關鍵流程頁面進行輸出,如首頁、我的、發現、登錄,兼顧效率與質量的平衡。
在團隊協作時,可將高級設計師放在一級面的設計輸出上,定義設計原則和規范,由其統籌設計方向。參與設計師進行跟進和完善,讓每股勁都使在刀刃上。
當核心頁面輸出后需通過內部評審,將不足反應出來,即時修改。最終大家達成一致的設計方向與思想,更利于并推進后續工作與安排。
03 落地期
1. 在設計中沉淀規范
規范形成不是一蹴而就,而需經過一定時間沉淀和積累;每位設計師需階段性累計規范,主視覺負責定期收集整理和完善,形成一個規范共建的循環。
創建規范時,主視覺需要界定出規范的范圍并分類。一般情況下可以分為界面布局、基礎規范、模態反饋、錄入狀態、信息展示五大類,這五種幾乎可以適應大多數產品。
2. 規范中的具體分類
界面布局是圍繞屏幕尺寸、體驗原則、開發邏輯的展示與規劃。常見的布局方法是通過柵格和百分比,去有規律的容納并管理信息;如宮格式、瀑布流、陳列館、卡片式等都是經典的布局方式,通過合理的布局,可以定義出頁面展示樣式和基本的體驗規則。
規范基礎是產品的基石,所有的頁面基本都是圍繞其去演變;可分為顏色規范、文字規范、圖標規范、按鈕規范、間距規范,同時需根據場景定義不同的尺寸和狀態。
模態反饋是指在整個產品體驗環節中所有觸發事件后呈現的狀態。如進度條、結果態、彈窗、Toast、加載態等,無論是模態還是非模態提示都需考慮其中。
錄入狀態是屬于產品使用中主動或被動的互動行為。如信息輸入、選擇、切換、上傳、留言等,與之互動的一系列操作都屬于用戶錄入。
信息展示是產品中默認的可視化區域,如圖表、廣告、缺省圖、卡片區等。展示區域經常會碰到尺寸適配、特殊狀態、極端情況等,往往需和產品、交互共同討論出相關的展示規則。
以上就是創建產品規范的五種分類方法。在實際項目中,需窮盡每一個類別的內容,盡可能去做到每個功能都有表格記錄,便于查驗,做到不留遺漏。
3. 通過宣導,達成共識
當我們輸出了完整的規范后,可以整理一份宣導文檔;通過內部小會相互交流意見,收集整理現存問題,修改并完善規范的不足,上下統一設計規則讓后期執行更高效。
對外我們也要需要和其他部門達成一致的規則與共識。可以邀約開發、產品、測試進行統一的規范宣導。多個部門形成一致的共識,讓落地更精確。
04 結語
建立了設計規范等同于制定了一套與外界對話標準機制,可以幫助用戶養成習慣,讓設計協作更順暢,部門之間溝通更方便,也讓產品迭代更高效。
擁有規范僅僅解決了產品的基礎問題,若要持續提升體驗,賦予產品更高價值,則需根據場景,不斷優化迭代保持生命力。
希望大家看完這文章之后有所收獲,吸收文章的內容運用在實際項目當中。
作者:WOWdesign,研究設計價值最大化,涉及用戶體驗、品牌體驗、空間體驗。
本文由 @WOWdesign 原創發布于人人都是產品經理。未經許可,禁止轉載。
題圖來自Unsplash,基于 CC0 協議
干貨滿滿,很多環節,都講的很清楚!贊~