誰是設計系統?
讓我們談談特定的設計系統。儘管基礎概念幾乎受益於任何網站,但現實卻更加細微。
設計系統目前正在引起巨大的嗡嗡聲。最近,新的設計系統的公開版本促使一系列消息敦促我檢查一下。我的最初反應? “看起來不錯。”但這就像瞥了一眼一輛新車的外觀 - 膚淺的評估。真正的理解需要廣泛的使用,並與其建立多個項目,以真正評估其優勢和劣勢。
這提出了至關重要的問題:該設計系統適合我的項目嗎?誰是有意的觀眾?
無處不在的手風琴
許多(儘管不是全部)設計系統包括手風琴。這不是偶然的;它突出了一個關鍵點。
Bootstrap:熟悉的基準測試
Bootstrap的廣泛採用和理解提供了有價值的比較。它的CSS和HTML組件很容易集成,提供了直接的開發體驗。
Bootstrap嚴格是“設計系統”還是“模式庫”是有爭議的。但是,這些術語的可互換使用強調了現有的混亂。
開發人員選擇Bootstrap的原因有幾個:
- 加速發展。
- 高質量的組件,對HTML/CSS專業知識較低的開發人員有益。
- 強大的可訪問功能。
- [在這裡插入您的原因]
這些好處雖然吸引人,但它已成為任何現代設計系統的標準期望,而不是引導程序所獨有的。
探索引導程序的替代方案
許多開發人員尋求替代引導程序。原因包括:
- 項目要求(例如,React集成)。
- 難以定制引導程序。
- 美學偏好。
- 簡單的無聊。
選擇或拒絕自舉的動機很多。
選擇設計系統:超越手風琴
選擇設計系統需要仔細考慮。許可是關鍵因素。 Salesforce的閃電設計系統(通常被稱為領導者)已獲得開源許可(BSD第3條,具有FONTIBUTION-SNODERIVITINT 4.0用於字體和圖標)。該許可證闡明了其預期用途:主要用於Salesforce及其相關開發團隊。雖然公開可用,但這並不是所有Web開發人員的通用解決方案。
為什麼公開? Salesforce的規模需要內部和外部團隊的可及性。公共可用性有助於協作並擴大其影響。
關於開源設計系統及其特定用例的討論仍在進行中。考慮到設計系統的上下文特定性質,“開源”是適當的術語,還是“可用來源”更準確?
IBM的碳設計系統是另一種開源選項,明確指出了其目標受眾:IBM設計師和開發人員從事IBM產品。儘管其他人可用,但其主要重點仍然是內部的。
公司特定的重點
公司創建的設計系統固有地首先滿足公司的需求。開源許可並不能否定這一主要重點。同樣的原則適用於政府開發的系統,例如美國網站設計系統,該系統優先考慮政府網站。
美國網頁設計系統(主要是公共領域)是一種寶貴的資源,但其設計優先考慮政府需求,而不是個人開發人員。它的開源性質有助於社區貢獻,影響對公共生活至關重要的網站。
可定制性的範圍
設計系統提供不同程度的可定制性:
- 零可定制性:執行嚴格的一致性。
- 預先選擇的變化:提供有限的自定義選項(例如,顏色變化)。
- BYO主題:為廣泛的自定義提供靈活的框架。
與Bootstrap不同,Shopify的Polaris Design系統雖然開源,但優先考慮內部一致性而不是廣泛的定制。
Google的材料設計最初是用於內部使用的,現在正在積極促進外部使用。雖然最初實施Google美學,但它變得越來越可定制,可以集成品牌。像Lyft,Zappos和NPR這樣的公司展示了成功的定制。
圍繞材料設計的消息傳遞突出了開源設計系統的複雜性。對於Google和其他想使用它的人來說,這是同時的,這是Google的資源和品牌知名度所啟用的壯舉。
設計系統不是商品;僅基於美學的選擇是不足的。必須仔細考慮許可,預期的受眾和可定制性。
我對公共設計系統創建者的建議:明確定義了您的目標受眾並允許使用。目標受眾消息傳遞的解釋差異很大,強調了清晰的溝通需求。
以上是誰是設計系統?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

您是否曾經在項目上需要一個倒計時計時器?對於這樣的東西,可以自然訪問插件,但實際上更多

關於Flex佈局中紫色斜線區域的疑問在使用Flex佈局時,你可能會遇到一些令人困惑的現象,比如在開發者工具(d...

在元素個數不固定的情況下如何通過CSS選擇第一個指定類名的子元素在處理HTML結構時,常常會遇到元素個數不�...
