在快速發(fā)展的數(shù)字化產(chǎn)品領(lǐng)域，組件庫(kù)的更新迭代是提升產(chǎn)品競(jìng)爭(zhēng)力的關(guān)鍵步驟。然而，這個(gè)過(guò)程并不簡(jiǎn)單，它涉及到資源協(xié)調(diào)、分類(lèi)優(yōu)化和使用規(guī)范等多個(gè)方面。本文將深入探討組件庫(kù)更新的三個(gè)注意事項(xiàng)，幫助設(shè)計(jì)團(tuán)隊(duì)高效迭代，同時(shí)確保產(chǎn)品質(zhì)量和團(tuán)隊(duì)協(xié)作的流暢性。

關(guān)于組件的更新迭代，很多同學(xué)都遇到過(guò)類(lèi)似的問(wèn)題：

• 組件庫(kù)的更新和迭代有哪些注意事項(xiàng)呢？
• 做了更新迭代后，之前已經(jīng)畫(huà)好的設(shè)計(jì)稿應(yīng)該怎樣處理？所有的稿子都需要重新優(yōu)化一遍么？
• 已經(jīng)上線(xiàn)的產(chǎn)品頁(yè)面在組件更新后，該怎么進(jìn)行維護(hù)呢？本文就來(lái)給大家分享些經(jīng)驗(yàn)和注意事項(xiàng)——

PART 1 更新組件的三個(gè)注意事項(xiàng)

在更新組件的同時(shí)，你需要做好三件事：

1. 判斷上下游團(tuán)隊(duì)資源的可用性。

要知道設(shè)計(jì)組件的更新不僅僅只是設(shè)計(jì)部門(mén)的事情，也涉及到上下游的協(xié)作部門(mén)，并需要他們給予有力的支持：如果上游的業(yè)務(wù)方和產(chǎn)品方?jīng)]有給組件的更新迭代留出充足的時(shí)間，那對(duì)于下游的設(shè)計(jì)和開(kāi)發(fā)團(tuán)隊(duì)來(lái)說(shuō)，將會(huì)面臨“又做業(yè)務(wù)、又搞基建”的混亂且繁忙的局面，這種情況下的工作質(zhì)量自然也很難保證，很有可能導(dǎo)致最后上線(xiàn)的產(chǎn)品一塌糊涂：

所以設(shè)計(jì)師在進(jìn)行比較大范圍的組件更新迭代之前，一定要先跟上下游做好同步，了解大家的工作意愿和排期；當(dāng)然也可以先發(fā)制人，梳理出組件更新的必要性和價(jià)值點(diǎn)，直接向業(yè)務(wù)和開(kāi)發(fā)索要資源支持。?

2. 給需要做調(diào)整的組件進(jìn)行分類(lèi)。更新組件的工作量并不小，尤其是當(dāng)組件的數(shù)量很多時(shí)，你可以將組件進(jìn)行分類(lèi)，分批次、分方法地完成優(yōu)化。

如下圖，我們可以將內(nèi)容按照“是否緊急需要”和“組件更新的難易程度”進(jìn)行劃分和歸類(lèi)，整理出一張組件統(tǒng)計(jì)表，再交給業(yè)務(wù)和開(kāi)發(fā)一起評(píng)估工作量和可行性：

所謂的“緊急需要”的組件，你可以理解為：

• 決定頁(yè)面大框架和結(jié)構(gòu)的組件（比如表單、表格等）；
• 能夠體現(xiàn)主視覺(jué)和品牌性的組件（比如導(dǎo)航欄、卡片、圖標(biāo)等）；
• 頁(yè)面中出現(xiàn)的頻率和次數(shù)高的組件（比如輸入框、按鈕等）；
• 功能相對(duì)基礎(chǔ)和底層的組件等等（比如標(biāo)題字體、按鈕等）。

以上這類(lèi)組件可以先做迭代，而一些不緊急使用的、難更改的小組件就可以慢慢修復(fù)，可以跟著產(chǎn)品自己的節(jié)奏，在正常的產(chǎn)品需求迭代時(shí)修復(fù)即可。?

3. 在組件的使用流程上做好規(guī)范

組件更新后最好也采用分批次小步迭代的方式進(jìn)行發(fā)布，能夠幫助組件的使用者慢慢養(yǎng)成正確的使用習(xí)慣，最大程度地減少組件更新后帶來(lái)的認(rèn)知壓力和學(xué)習(xí)成本。

PART 2已有的設(shè)計(jì)稿如何更新？

組件更新后，對(duì)于已有的設(shè)計(jì)稿頁(yè)面可以分成三種情況來(lái)進(jìn)行處理：

1. 已開(kāi)發(fā)上線(xiàn)的頁(yè)面

對(duì)于大量的已上線(xiàn)的頁(yè)面，如果你的團(tuán)隊(duì)已經(jīng)使用了 Design Token 做組件的設(shè)計(jì)和研發(fā)，那么這類(lèi)頁(yè)面從開(kāi)發(fā)側(cè)對(duì)線(xiàn)上產(chǎn)品做迭代和修改會(huì)更加快捷。

而對(duì)于設(shè)計(jì)稿，可以暫時(shí)先不花費(fèi)時(shí)間和精力更新這部分頁(yè)面中的組件，等到產(chǎn)品需求中有局部功能涉及到這部分頁(yè)面、需要做更新調(diào)整和優(yōu)化時(shí)，再進(jìn)行頁(yè)面的維度和調(diào)整。

這樣做更為省時(shí)高效，能夠最大限度地避免無(wú)效勞作。但也需要設(shè)計(jì)師做好每一輪設(shè)計(jì)稿優(yōu)化后的內(nèi)容紀(jì)要，也即用表格或者文檔記錄變更的內(nèi)容，附在設(shè)計(jì)稿旁邊。一般由以下內(nèi)容組成：

• 內(nèi)容修改的具體時(shí)間（年月日） ；
• 具體功能 / 頁(yè)面的名稱(chēng) ；
• 修改 / 優(yōu)化的組件名稱(chēng) ；
• 負(fù)責(zé)的設(shè)計(jì)師姓名等信息。

以便于團(tuán)隊(duì)日后對(duì)設(shè)計(jì)稿頁(yè)面和組件的使用情況進(jìn)行管理。

2. 正在設(shè)計(jì) / 開(kāi)發(fā)中的頁(yè)面

這部分設(shè)計(jì)稿需要根據(jù)以下幾點(diǎn)來(lái)做判斷，看看是否需要立即更新組件：

• 業(yè)務(wù)的進(jìn)展情況（盡量不要影響業(yè)務(wù)需求的原有進(jìn)度）；
• 組件的應(yīng)用頻率（經(jīng)常出現(xiàn)的、大面積使用的組件盡快更新）；
• 組件的重要程度（影響產(chǎn)品整體風(fēng)格、品牌感受的組件立即更新）。

如果確定要更新設(shè)計(jì)稿中的組件，設(shè)計(jì)師需要確保所有相關(guān)研發(fā)人員的信息保持同步，避免出現(xiàn)組件使用參差不齊的情況。

3. 未來(lái)需要設(shè)計(jì)的頁(yè)面

對(duì)于未來(lái)的新功能的設(shè)計(jì)稿，則應(yīng)該強(qiáng)制設(shè)計(jì)師必須使用新組件。

你可以將這些將以上這三種情況的應(yīng)對(duì)措施變成組件使用規(guī)范的一部分，供組件的使用者閱讀和學(xué)習(xí)。