Material Design發(fā)布的“設(shè)計(jì)體系現(xiàn)狀:2020”報(bào)告
編輯導(dǎo)讀:不管是大型平臺(tái)型設(shè)計(jì)體系還是公司內(nèi)部用的設(shè)計(jì)體系,它們有的建設(shè)多年,有的才剛萌芽。但現(xiàn)在很多文章往往都是定性的分析,難以提供一些趨勢(shì)的辨別和數(shù)據(jù)驗(yàn)證。本篇文章內(nèi)容來(lái)自Material Design的研究者Abla Hamilton發(fā)布的:《設(shè)計(jì)體系現(xiàn)狀:2020》,從九個(gè)方面展開(kāi)介紹,與你分享。
之前的設(shè)計(jì)體系文章一直缺乏一些具體的調(diào)查數(shù)據(jù)。今天這篇文章,我來(lái)分享一下Material Design的研究者在2020年末,發(fā)布的針對(duì)于設(shè)計(jì)體系使用者社區(qū)的調(diào)查。
不管是大型平臺(tái)型設(shè)計(jì)體系還是公司內(nèi)部用的設(shè)計(jì)體系,它們有的建設(shè)多年,有的才剛萌芽。但現(xiàn)在很多文章往往都是定性的分析,難以提供一些趨勢(shì)的辨別和數(shù)據(jù)驗(yàn)證。
本篇文章內(nèi)容來(lái)自Material Design的研究者Abla Hamilton發(fā)布的:《設(shè)計(jì)體系現(xiàn)狀:2020》(The State of Design Systems: 2020,2020-12)
作者在文中分享了他們團(tuán)隊(duì)對(duì)設(shè)計(jì)體系社區(qū)中的500~1000余名成員的調(diào)查報(bào)告,并與他他們的2019年報(bào)告(去年的報(bào)告可以看這個(gè):State of Design Systems 2019)進(jìn)行對(duì)比分析,并分享了以下數(shù)據(jù):
- 使用的設(shè)計(jì)體系的包含內(nèi)容
- 選擇創(chuàng)建設(shè)計(jì)體系的原因分布
- 使用的設(shè)計(jì)體系分布
- 目前用來(lái)設(shè)計(jì)數(shù)字產(chǎn)品的工具分布
- 目前用來(lái)將設(shè)計(jì)文檔化和交接的工具分布
- 用于管理設(shè)計(jì)體系的的工具分布
- 支持設(shè)計(jì)體系的組織活動(dòng)情況
- 設(shè)計(jì)體系增長(zhǎng)趨勢(shì)
*需要注意的是由于調(diào)查者背景是MaterialDesign,可能會(huì)存在部分?jǐn)?shù)據(jù)的偏頗,稍微注意一下即可。以下是其核心內(nèi)容:
前言:
我們使用的設(shè)計(jì)體系一直在持續(xù)發(fā)展。在今年的“設(shè)計(jì)體系現(xiàn)狀(State of Design Systems)”調(diào)查中,我們了解了設(shè)計(jì)體系如何變得成熟、包含哪些內(nèi)容,以及如何由人員、工具和流程管理。
這是Material Design與“Clarity”會(huì)議(https://www.clarityconf.com/2020-archive)合作的第二年,著眼于設(shè)計(jì)體系的當(dāng)前狀態(tài)。
我們以幾種方式更新了2020年的調(diào)查。首先,Clarity 2020會(huì)議已轉(zhuǎn)變?yōu)樵诰€形式。通過(guò)這一更改,受訪者預(yù)計(jì)使用或創(chuàng)建設(shè)計(jì)體系的的經(jīng)驗(yàn)可能會(huì)發(fā)生變化。我們還通過(guò)Material Design的社交媒體和通訊帳戶(https://twitter.com/materialdesign)添加了分銷渠道,以擴(kuò)大今年未參會(huì)人員的影響力。
我們還計(jì)劃在兩篇文章中解釋這些結(jié)果。在本文中,我們將對(duì)調(diào)查結(jié)果進(jìn)行概述,并與去年的調(diào)查進(jìn)行比較。在2021年初,我們將進(jìn)一步深入研究設(shè)計(jì)體系的發(fā)展(譯者注,新文章還沒(méi)發(fā)布)。
關(guān)于受訪者:
今年,我們聽(tīng)到了很大一部分專注于設(shè)計(jì)工作的人的聲音(53%)。與去年的調(diào)查相比,專注于開(kāi)發(fā)的人員從11%上升到16%,同時(shí)從事設(shè)計(jì)和開(kāi)發(fā)的人員從16%上升到22%。
我們還發(fā)現(xiàn)受訪者的相關(guān)經(jīng)驗(yàn)發(fā)生了變化。去年,大多數(shù)人稱(57%),他們?cè)诟髯越巧械墓ぷ鹘?jīng)驗(yàn)不足4年。
今年的受訪者工作經(jīng)驗(yàn)結(jié)果是:
- 37%的人擁有不到4年的經(jīng)驗(yàn)
- 32%具有4-9年的經(jīng)驗(yàn)
- 31%具有9年以上的經(jīng)驗(yàn)
現(xiàn)在的分布更均勻,使我們有更廣泛的經(jīng)驗(yàn)可以從中學(xué)習(xí)。
在考慮參與創(chuàng)建或使用設(shè)計(jì)體系的人員時(shí),讓我們使用Nikolas Klein在其文章《設(shè)計(jì)體系的成熟度》(https://www.designsystems.com/the-spectrum-of-maturity-for-design-systems/)中的定義。他將創(chuàng)造者(Creator)定義為“發(fā)明新模式或記錄現(xiàn)有模式以供他人使用的人”,而將消費(fèi)者(Consumer)定義為“使用先前定義的模式的人”。
使用這些定義,可以將76%的受訪者確定為“創(chuàng)造者”,既可以作為組織設(shè)計(jì)體系團(tuán)隊(duì)的一部分,也可以作為對(duì)設(shè)計(jì)體系做出貢獻(xiàn)的產(chǎn)品團(tuán)隊(duì)的成員。因此,我們中有大多數(shù)具有動(dòng)手經(jīng)驗(yàn)的人通過(guò)本次調(diào)查分享了這些經(jīng)驗(yàn)。
一、設(shè)計(jì)體系包含什么內(nèi)容?
在去年的調(diào)查中,我們?cè)噲D了解構(gòu)成組織設(shè)計(jì)體系的內(nèi)容。去年設(shè)計(jì)體系中最流行的工具包括組件庫(kù)(component libraries)、樣式指南(styleguides)、設(shè)計(jì)指南(design guidelines)、和內(nèi)容指南(content guidelines)。
今年,我們將問(wèn)題擴(kuò)展到包括9個(gè)選項(xiàng),添加了諸如設(shè)計(jì)令牌(design tokens),圖標(biāo)庫(kù)(icon libraries)和可訪問(wèn)性準(zhǔn)則(accessibility guidelines)之類的內(nèi)容。
設(shè)計(jì)體系包含的前三名工具包是:
- 圖標(biāo)庫(kù)(84%)
- UI套件(83%)
- 樣式指南(75%)
大多數(shù)受訪者(74%)還報(bào)告說(shuō)他們的設(shè)計(jì)體系具有組件代碼庫(kù)。
圖1.在公司內(nèi)使用的設(shè)計(jì)體系包含的具體內(nèi)容(465樣本)
這里有兩個(gè)要考慮的關(guān)鍵事實(shí)。
首先,有75%的受訪者專注于產(chǎn)品級(jí)別或設(shè)計(jì)體系級(jí)別的設(shè)計(jì)工作。
其次,記錄組織的視覺(jué)語(yǔ)言是設(shè)計(jì)體系開(kāi)發(fā)的第一步。組織的視覺(jué)語(yǔ)言在樣式指南和圖標(biāo)中表示,并嵌入到產(chǎn)品設(shè)計(jì)階段使用的UI Kit中。視覺(jué)內(nèi)容(例如樣式指南和圖標(biāo))的比例很高,與早期的設(shè)計(jì)體系演進(jìn)階段保持一致。
二、推動(dòng)內(nèi)部設(shè)計(jì)體系建設(shè)的原因是什么?
在2019年,我們問(wèn)了:“您嘗試或使用過(guò)哪些設(shè)計(jì)體系或組件庫(kù)?” 在該調(diào)查中,有58%的受訪者選擇了“內(nèi)部設(shè)計(jì)體系”作為他們?cè)?jīng)使用或嘗試過(guò)的體系,該選項(xiàng)僅次于Google的Material Design。
在2020年的調(diào)查中,我們想了解有關(guān)內(nèi)部設(shè)計(jì)體系的更多信息,因此我們添加了以下兩個(gè)新問(wèn)題:
“貴公司是否在內(nèi)部建立了自己的設(shè)計(jì)體系?” ,進(jìn)一步有以下問(wèn)題,“您的公司為什么選擇內(nèi)部構(gòu)建設(shè)計(jì)體系而不是重新使用開(kāi)源設(shè)計(jì)體系?”
居然有大多數(shù)受訪者(80%)報(bào)告說(shuō),他們的公司在內(nèi)部構(gòu)建了自己的設(shè)計(jì)體系。
公司創(chuàng)建其內(nèi)部設(shè)計(jì)體系的前三個(gè)原因是:
- 最能代表他們公司的品牌(27%)
- 解決其產(chǎn)品的特定用例(22%)
- 框架或技術(shù)堆棧(tech stack)限制(14%)
圖2.創(chuàng)建內(nèi)部設(shè)計(jì)體系的原因(350樣本)
三、您使用了哪些設(shè)計(jì)體系?
在去年的調(diào)查中,當(dāng)我們問(wèn)到“您使用了哪些設(shè)計(jì)體系?” 選擇的前三大設(shè)計(jì)體系是:Google的Material Design(28%),內(nèi)部構(gòu)建的設(shè)計(jì)體系(21%)和Apple的Human-InterfaceGuidelines(15%)。
今年,當(dāng)我們問(wèn)到“過(guò)去兩年中您使用了哪些設(shè)計(jì)體系”時(shí),我們通過(guò)其他設(shè)計(jì)體系和工具包(例如Bootstrap和Fluent Design System)擴(kuò)展了選項(xiàng)列表。這有助于我們了解受訪者使用的設(shè)計(jì)體系的范圍以及如何使用這些設(shè)計(jì)體系。
在過(guò)去兩年中,我們的受訪者使用的前三大設(shè)計(jì)體系是:
- Google的 質(zhì)感設(shè)計(jì)體系(Material Design System)
- Apple的人機(jī)交互指南( Human-Interface Guidelines ,HIG)
- Bootstrap
圖3.過(guò)去兩年中使用或嘗試過(guò)的設(shè)計(jì)體系(1259樣本)
在今年的結(jié)果中,Bootstrap是新秀選擇之一,在我們的清單中排在Google的MDS和Apple的HIG之后的第三位。
當(dāng)我們考慮到絕大多數(shù)(80%)的報(bào)告稱其組織已經(jīng)創(chuàng)建了自己的內(nèi)部設(shè)計(jì)體系并查看了僅那些受訪者使用的不同設(shè)計(jì)體系時(shí),我們可以得出結(jié)論,大多數(shù)人將這些設(shè)計(jì)體系用來(lái)作為參考,幫助建設(shè)在內(nèi)部設(shè)計(jì)體系。
這進(jìn)一步證實(shí)了去年調(diào)查中記錄的一項(xiàng)發(fā)現(xiàn):“ …公司越來(lái)越希望開(kāi)發(fā)自己的設(shè)計(jì)體系,但將使用現(xiàn)成的設(shè)計(jì)體系作為參考和影響?!?/p>
四、用來(lái)設(shè)計(jì)數(shù)字產(chǎn)品的工具是什么?
今年,我們?yōu)樵O(shè)計(jì)體系創(chuàng)造者和消費(fèi)者增加了有關(guān)工具的幾個(gè)問(wèn)題。我們?cè)儐?wèn)了專注于設(shè)計(jì)工作的受訪者,他們使用哪些工具來(lái)創(chuàng)建設(shè)計(jì)。
受訪者選擇的前3種工具是:
- Figma(23%)
- Sketch(19%)
- Illustrator(11%)
圖4.受選的設(shè)計(jì)工具百分比(497樣本)
當(dāng)我們將工具偏好與公司規(guī)模進(jìn)行比較時(shí)(詳見(jiàn)圖5),F(xiàn)igma往往是擁有500名以下員工的公司的偏好選擇,而Sketch是擁有10,000名及以上員工的大型跨國(guó)公司的首選。
圖5.不同受訪者規(guī)模選擇特定設(shè)計(jì)工具的百分比(453樣本)
五、用來(lái)將設(shè)計(jì)文檔化和交接的工具是什么?
設(shè)計(jì)與工程之間的交接是產(chǎn)品設(shè)計(jì)與開(kāi)發(fā)過(guò)程中協(xié)作與溝通的關(guān)鍵時(shí)刻。
在去年的調(diào)查中,這種移交被確定為設(shè)計(jì)領(lǐng)導(dǎo)希望通過(guò)使用設(shè)計(jì)體系來(lái)緩解的痛點(diǎn)。今年,我們?cè)黾恿艘粋€(gè)新問(wèn)題,并向所有受訪者詢問(wèn)用于移交UX文檔的工具,以了解有關(guān)此設(shè)計(jì)體系接觸點(diǎn)的更多信息。
受訪者選擇的前3種工具是:
- Figma (26%)
- InVision (18%)
- Zeplin (13%)
圖6.用來(lái)遞交UX文檔的工具使用情況(451樣本)
當(dāng)我們比較用于將UX文檔使用情況的工具與公司規(guī)模進(jìn)行比較時(shí),幾乎所有公司規(guī)模都選擇了Figma,但大型公司除外,大型公司更頻繁地使用InVision。
圖7.不同受訪者公司規(guī)模下特定設(shè)計(jì)工具使用的百分比(451樣本)
六、用于管理設(shè)計(jì)體系的工具是什么?
隨著越來(lái)越多的組織創(chuàng)建設(shè)計(jì)體系,用于組織和管理設(shè)計(jì)體系內(nèi)容和文檔的工具越來(lái)越多。
在2019年,當(dāng)我們?cè)儐?wèn)管理設(shè)計(jì)體系的工具時(shí),選擇的頭部工具是Sketch。但是,今年的頭把交椅是Figma(25%),其次是Sketch(21%)和Storybook(17%)。
圖8.使用的設(shè)計(jì)體系管理工具的選擇百分比(452樣本)
同樣,當(dāng)我們按公司規(guī)模查看設(shè)計(jì)體系管理工具的使用情況時(shí),除大型公司外,幾乎所有公司都選擇了Figma,大型公司則使用了Sketch。
圖9.按受訪者公司規(guī)模劃分的設(shè)計(jì)體系管理工具的百分比(452樣本)
七、您如何支持設(shè)計(jì)體系?
隨著組織內(nèi)部的設(shè)計(jì)體系的發(fā)展,需要更積極的支持來(lái)幫助他們發(fā)展和成功。今年的調(diào)查增加了一個(gè)有關(guān)團(tuán)隊(duì)為支持其設(shè)計(jì)體系演變而進(jìn)行的特定活動(dòng)的問(wèn)題。
主要支持設(shè)計(jì)體系建設(shè)的活動(dòng)包括:
- 定制及重復(fù)設(shè)計(jì)的審查(16%)
- 入門(mén)介紹如何使用組織的設(shè)計(jì)體系(14%)
- 能夠針對(duì)體系提交錯(cuò)誤(13%)
圖10.設(shè)計(jì)體系支持活動(dòng)的百分比(371樣本)
設(shè)計(jì)體系啟動(dòng)后,邁向成功的下一步是產(chǎn)品團(tuán)隊(duì)采用設(shè)計(jì)體系。提供入職培訓(xùn)以展示如何使用設(shè)計(jì)體系并演示體系的價(jià)值可以幫助提高知名度和采用率。
另外,使用設(shè)計(jì)體系的既定目標(biāo)是保持產(chǎn)品的一致性。讓設(shè)計(jì)體系團(tuán)隊(duì)成員在產(chǎn)品設(shè)計(jì)審查期間提供反饋,或者使產(chǎn)品團(tuán)隊(duì)能夠針對(duì)設(shè)計(jì)體系本身提交錯(cuò)誤,提供機(jī)制和機(jī)會(huì)來(lái)保持設(shè)計(jì)體系及其相關(guān)產(chǎn)品的一致性和同步性。
八、設(shè)計(jì)體系當(dāng)前的增長(zhǎng)趨勢(shì)是什么?
除了了解有關(guān)內(nèi)部設(shè)計(jì)體系增長(zhǎng)趨勢(shì)的更多信息外,我們還了解了受訪者的設(shè)計(jì)體系在組織中已經(jīng)使用了多長(zhǎng)時(shí)間。大約25%的受訪者表示他們的設(shè)計(jì)體系已經(jīng)使用了1-2年,非常新。
圖11.目前的設(shè)計(jì)體系的使用時(shí)長(zhǎng)(533樣本)
將這些使用時(shí)長(zhǎng)數(shù)據(jù)聚合為兩個(gè)集群(0-2年和 2-4+年)并按公司規(guī)模進(jìn)行分析(請(qǐng)參見(jiàn)圖12),該數(shù)據(jù)表明,規(guī)模較小的區(qū)域性公司(最多5,000名員工)正在比更大型跨國(guó)公司(擁有5,000多名員工)創(chuàng)建更多的設(shè)計(jì)體系。
越來(lái)越多的中型公司(50至1500名員工)越來(lái)越多地使用設(shè)計(jì)體系來(lái)改善其產(chǎn)品的設(shè)計(jì)和開(kāi)發(fā)團(tuán)隊(duì)流程,提升產(chǎn)品一致性和質(zhì)量。
圖12.按受訪者規(guī)模X設(shè)計(jì)體系使用時(shí)長(zhǎng)(389樣本)
九、下一步是什么?
無(wú)論是在團(tuán)隊(duì)級(jí)別、組織級(jí)別還是在更廣泛的設(shè)計(jì)體系社區(qū)中,設(shè)計(jì)體系總是在不斷發(fā)展。當(dāng)我們將這些系統(tǒng)應(yīng)用到我們的工作中時(shí),重要的是要了解有關(guān)體系如何形成、如何得到支持以及如何演化的問(wèn)題。這樣,新的團(tuán)隊(duì)可以根據(jù)這些社區(qū)中的挑戰(zhàn)和成功基礎(chǔ)上繼續(xù)學(xué)習(xí)。
文章暫告結(jié)束,等他們新報(bào)告發(fā)布了,我再和大家分享一波。
另外,下面的內(nèi)容是近期我撰寫(xiě)的關(guān)于設(shè)計(jì)體系的相關(guān)文章,感興趣的朋友可以看看:
相關(guān)閱讀
設(shè)計(jì)體系丨設(shè)計(jì)體系的涌現(xiàn):適應(yīng)組織的需要(一)
設(shè)計(jì)體系丨什么才是設(shè)計(jì)體系?結(jié)構(gòu)、原則與認(rèn)知誤區(qū)(二)
設(shè)計(jì)體系丨設(shè)計(jì)體系有什么用??jī)r(jià)值與缺陷(三)
設(shè)計(jì)體系丨如何創(chuàng)建設(shè)計(jì)體系?(四)
設(shè)計(jì)體系丨根據(jù)六大設(shè)計(jì)體系總結(jié)出的資產(chǎn)清查清單(五)
參考內(nèi)容
[1].? ??原文,AblaHamilton(Material Design),The State of Design Systems: 2020,2020-12-16,https://material.io/blog/research-state-of-design-systems-2020;
[2].????Jude Yew,State of Design Systems 2019 ,2019-12-23,https://medium.com/google-design/state-of-design-systems-2019-ff5f26ada71;
[3].????Clarity設(shè)計(jì)體系會(huì)議,https://www.clarityconf.com/2020-archive;
[4].????NikolasKlein,The spectrum ofmaturity for design systems,https://www.designsystems.com/the-spectrum-of-maturity-for-design-systems/;
作者:龍哩個(gè)龍 。公眾號(hào):LONG說(shuō)設(shè)計(jì)
本文由 @龍哩個(gè)龍 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
- 目前還沒(méi)評(píng)論,等你發(fā)揮!