設(shè)計(jì)語(yǔ)言系統(tǒng)的應(yīng)用實(shí)踐要點(diǎn)
本文為我們盤(pán)點(diǎn)了設(shè)計(jì)語(yǔ)言系統(tǒng)的價(jià)值與意義,并進(jìn)一步梳理了初次構(gòu)建設(shè)計(jì)語(yǔ)言系統(tǒng)的注意事項(xiàng)。
從工業(yè)設(shè)計(jì)到平面設(shè)計(jì),再到近些年的數(shù)字產(chǎn)品設(shè)計(jì),設(shè)計(jì)語(yǔ)言一直是一個(gè)熱點(diǎn)話題,已經(jīng)有很多資料對(duì)設(shè)計(jì)語(yǔ)言做過(guò)介紹說(shuō)明,這篇文章是我在工作中對(duì)「設(shè)計(jì)語(yǔ)言系統(tǒng)」落地應(yīng)用時(shí)的一些思考總結(jié)。
簡(jiǎn)單來(lái)說(shuō),設(shè)計(jì)語(yǔ)言系統(tǒng)(design language system)可以理解為由品牌基因+設(shè)計(jì)規(guī)范+多場(chǎng)景應(yīng)用三大要素組成的一套設(shè)計(jì)應(yīng)用規(guī)范系統(tǒng)。如同開(kāi)一家餐廳,從店面裝修到價(jià)格定位再到就餐環(huán)節(jié)的各個(gè)流程,都應(yīng)該保持統(tǒng)一的服務(wù)目標(biāo),從而打造具有特色服務(wù)體驗(yàn),不斷提升顧客的滿意度。
「西貝莜面村」的品牌視覺(jué)符號(hào)植入場(chǎng)景-紅格桌布
設(shè)計(jì)語(yǔ)言系統(tǒng)的應(yīng)用
設(shè)計(jì)語(yǔ)言是一種規(guī)則,保證了產(chǎn)品在不同場(chǎng)景/終端下的一致性,是產(chǎn)品設(shè)計(jì)的公共 設(shè)施,這套系統(tǒng)對(duì)參與產(chǎn)品業(yè)務(wù)的不同角色都有約束力。
對(duì)設(shè)計(jì)師來(lái)說(shuō),鮮明的品牌定義和統(tǒng)一完善的色彩及組件樣式庫(kù)的應(yīng)用,可以讓產(chǎn)品在多種應(yīng)用場(chǎng)景下依然保持相同的風(fēng)格,傳統(tǒng)出同一種調(diào)性。
同時(shí),產(chǎn)品設(shè)計(jì)語(yǔ)言傳達(dá)的風(fēng)格意識(shí)也無(wú)時(shí)不刻的影響著產(chǎn)品經(jīng)理對(duì)于功能場(chǎng)景的判斷,甚至可以在設(shè)計(jì)師不在場(chǎng)的情況下,快速轉(zhuǎn)化尚未成型的產(chǎn)品功能設(shè)計(jì)進(jìn)行嘗試,從而提高創(chuàng)新的可能性。
對(duì)于開(kāi)發(fā)來(lái)說(shuō),設(shè)計(jì)語(yǔ)言系統(tǒng)提供的組件庫(kù)樣式可以幫助開(kāi)發(fā)更好的規(guī)劃代碼,理解當(dāng)前功能樣式的來(lái)源依據(jù),是否具有可復(fù)用性等等,同時(shí)在處理一些緊急情況,比如臨時(shí)增加彈窗提示等流程時(shí)也有所參考。
初創(chuàng)產(chǎn)品有必要構(gòu)建設(shè)計(jì)語(yǔ)言系統(tǒng)嗎?
當(dāng)我們?nèi)ゲ檎以O(shè)計(jì)語(yǔ)言相關(guān)資料的時(shí)候,通常會(huì)找到一些專(zhuān)業(yè)性極高、功能龐大又完備的示例,很容易認(rèn)為制定設(shè)計(jì)語(yǔ)言系統(tǒng)耗時(shí)耗力,又無(wú)法直接體現(xiàn)收益,從而產(chǎn)生疑問(wèn),對(duì)于初創(chuàng)產(chǎn)品來(lái)說(shuō),功能迭代頻繁快速,有必要拿出時(shí)間來(lái)制定專(zhuān)業(yè)的設(shè)計(jì)語(yǔ)言嗎?
任何一個(gè)產(chǎn)品的應(yīng)用形式,主要是由用戶和使用場(chǎng)景決定的,設(shè)計(jì)語(yǔ)言也不例外。相對(duì)早期的產(chǎn)品自然可以制作初級(jí)的設(shè)計(jì)語(yǔ)言系統(tǒng),讓它和產(chǎn)品一起成長(zhǎng)迭代,當(dāng)你享受到了設(shè)計(jì)語(yǔ)言系統(tǒng)在產(chǎn)品開(kāi)發(fā)階段帶來(lái)的效率提升后,自然會(huì)越來(lái)越注意維護(hù)它,沒(méi)有一個(gè)產(chǎn)品在0.1版本階段就非常偉大。有一個(gè)相對(duì)明確的指標(biāo)作為參考,在產(chǎn)品用戶量達(dá)到10萬(wàn)左右時(shí)就可以開(kāi)始著手整理了。
初次構(gòu)建設(shè)計(jì)語(yǔ)言系統(tǒng)的注意事項(xiàng)
毫無(wú)疑問(wèn)這是一項(xiàng)由設(shè)計(jì)師主導(dǎo)的工作,需要和pmrd的參與和支持,發(fā)布后也需要不斷的完善和迭代。具體的制作過(guò)程中有幾點(diǎn)需要注意:
1. 確?;静牧系慕y(tǒng)一
找到一個(gè)合適的時(shí)機(jī),通常是在完成一個(gè)大的功能迭代之后,投入專(zhuān)注的時(shí)間來(lái)整理文件。整理產(chǎn)品的主功能,以及部分優(yōu)先級(jí)較高、復(fù)用頻率高的頁(yè)面設(shè)計(jì)文件,排布在一起,確保不要遺漏關(guān)鍵流程步驟。
整理完成之后,就會(huì)很容易看到部分元素設(shè)計(jì)不一致的情況,在這個(gè)階段只需要設(shè)計(jì)文件進(jìn)行視覺(jué)統(tǒng)一,而最終的產(chǎn)品呈現(xiàn)層面,后續(xù)在相關(guān)功能迭代時(shí)加入優(yōu)化需求逐步完成即可。
統(tǒng)一視覺(jué)樣式的過(guò)程記得整理出待修改清單,讓后續(xù)的優(yōu)化工作有跡可循。
2. 保證元素和組件邏輯清晰
像搭積木一樣,把同一層級(jí)的元素歸納羅列,以顆粒度從高到低的邏輯依次整理,可以搜索「原子設(shè)計(jì)」概念輔助理解,這一步操作瑣碎又重要,一定要有足夠的耐心。
lego 機(jī)器人零件手冊(cè)
Airbnb dls -規(guī)范提煉
邏輯分明的結(jié)構(gòu)和組件庫(kù),在交互設(shè)計(jì)階段可以快速呈現(xiàn)高保真原型,提升方案溝通效率,也是方案決策背后的邏輯支撐,讓設(shè)計(jì)更加有理有據(jù)。
3. 充分溝通,多方合作
設(shè)計(jì)師通常喜歡專(zhuān)注工作,更愿意單獨(dú)工作,但是制作整理設(shè)計(jì)語(yǔ)言系統(tǒng)的過(guò)程需要與團(tuán)隊(duì)中的各個(gè)角色及時(shí)溝通,保持信息同步,同時(shí)在籌備階段的參與感會(huì)使得系統(tǒng)后期推廣應(yīng)用更加順暢。
設(shè)計(jì)語(yǔ)言的構(gòu)建不是從0到1,通常情況是面對(duì)已有的信息進(jìn)行整理提煉,站在更高層級(jí)更抽象的理解曾經(jīng)的設(shè)計(jì)決策,修正和優(yōu)化出一套更加穩(wěn)固和適合產(chǎn)品的規(guī)范系統(tǒng),和不同角色的合作有助于設(shè)計(jì)師更全面和準(zhǔn)確的理解產(chǎn)品狀態(tài)。
4. 制作多種的表達(dá)形式
設(shè)計(jì)語(yǔ)言系統(tǒng)不僅應(yīng)用在具體的工作流中,也是產(chǎn)品品牌信號(hào)傳達(dá)的一部分,可以讓不同的角色對(duì)產(chǎn)品定位保持更多的共識(shí)。針對(duì)設(shè)計(jì)師、開(kāi)發(fā)、運(yùn)營(yíng)推廣三類(lèi)使用角色,我建議整理三種格式的文件:設(shè)計(jì)組件庫(kù)、 線上協(xié)同版、 pdf版本。
這三種格式文件不是同一份文件導(dǎo)出不同格式,而是針對(duì)不同應(yīng)用人群進(jìn)行內(nèi)容定制的版本。
設(shè)計(jì)組件庫(kù) 用于具體的工作中,解決實(shí)際需求。
線上協(xié)同版 主要應(yīng)對(duì)與開(kāi)發(fā)/產(chǎn)品之間的對(duì)接溝通。
pdf 版本可以側(cè)重匯總運(yùn)營(yíng)推廣常用的元素信息應(yīng)用標(biāo)準(zhǔn),方便運(yùn)營(yíng)在不同場(chǎng)景下自行選擇合適的品牌信息。
最后,設(shè)計(jì)語(yǔ)言系統(tǒng)的制定和運(yùn)用都需要持續(xù)優(yōu)化升級(jí),伴隨品牌特性和產(chǎn)品功能傾向而不斷調(diào)整,而構(gòu)建基礎(chǔ)系統(tǒng)更是修復(fù)過(guò)往問(wèn)題的過(guò)程,從開(kāi)始整理文件的初期就已經(jīng)發(fā)揮作用,有效的設(shè)計(jì)語(yǔ)言系統(tǒng)提升產(chǎn)品設(shè)計(jì)工作效率,更可以推動(dòng)設(shè)計(jì)師發(fā)揮更多的創(chuàng)造力。
如果你是設(shè)計(jì)師、個(gè)人創(chuàng)作者、或者產(chǎn)品設(shè)計(jì)參與者,如果你的產(chǎn)品還沒(méi)有一套專(zhuān)屬的規(guī)范系統(tǒng),不妨現(xiàn)在就嘗試一下,從最基礎(chǔ)的整理工作動(dòng)手吧。
參考資料
1. 2016年 Airbnb第一版設(shè)計(jì)語(yǔ)言系統(tǒng)構(gòu)建過(guò)程
https://airbnb.design/building-a-visual-language/
2. Airbnb’s 設(shè)計(jì)總監(jiān)如何定義產(chǎn)品設(shè)計(jì)
https://firstround.com/review/defining-product-design-a-dispatch-from-airbnbs-design-chief/
3. 聊聊數(shù)字化產(chǎn)品的「設(shè)計(jì)語(yǔ)言」
https://mp.weixin.qq.com/s/JxIpKfvs5F9Pyjv_7UOuPQ
作者:bubblegun;公眾號(hào):@泡槍指北
本文由 @bubblegun 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
設(shè)計(jì)語(yǔ)言規(guī)范的在線協(xié)同,有什么好的系統(tǒng)或工具推薦嗎?