欧美本精品男人aⅴ天堂_亚洲精品久久久蜜桃_国产精品资源网_亚洲精品在线观看网站

一、UI 設計規(guī)范有什么用？

UI 設計規(guī)范的作用，概括來說有三點：提升效率、保障質(zhì)量、統(tǒng)一體驗。

交互設計師和產(chǎn)品經(jīng)理，能根據(jù)這套規(guī)范快速搭建頁面；

視覺設計師，能根據(jù)這套規(guī)范產(chǎn)出視覺風格統(tǒng)一、細節(jié)精良的頁面；

前端工程師，能根據(jù)這套規(guī)范快速推進開發(fā)，遇到通用組件不清晰的地方，直接可以查；

運營，在某些時候，也能根據(jù)這套規(guī)范，自己搭建簡單的頁面；

用戶，根據(jù)這套規(guī)范指導下設計的產(chǎn)品，使用起來，在視覺、交互方面有統(tǒng)一的體驗。

國內(nèi)一些大廠做得優(yōu)秀的設計規(guī)范案例，比如螞蟻金服的 Ant Design，餓了么的 Element，已經(jīng)實現(xiàn)了端到端的體驗一致，而且它們組件的豐富程度足夠滿足大部分使用場景。

二、大廠設計規(guī)范參考

想要提升自己對規(guī)范的理解和建立規(guī)范的能力，多向成熟的大廠規(guī)范學習，是很有必要的。

推薦你關注即時設計的資源廣場，持續(xù)分享國內(nèi)外大廠的設計規(guī)范，而且這些資源都可以免費獲取。目前已有大廠資源，包括蘋果、谷歌、字節(jié)跳動、螞蟻金服、餓了么、百度......

· iOS 15 設計規(guī)范和組件庫

· ArcoDesign 全套設計資源（字節(jié)跳動內(nèi)部團隊打造的企業(yè)級設計系統(tǒng)）

· Ant Design 全套設計資源（螞蟻金服團隊打造的服務于企業(yè)級產(chǎn)品的設計體系）

· WeUI 設計規(guī)范（微信官方出品為微信內(nèi)網(wǎng)頁和微信小程序設計）

· Element 餓了么 設計規(guī)范

· Material Design 設計規(guī)范

· Harmony OS 設計規(guī)范

· 百度智能小程序全套設計資源

三、設計規(guī)范的制作方法

這里推薦一個原子設計理論，從這個理論的操作方法中，可以一窺設計規(guī)范的制作原理，而且使用起來也比較簡單，適合那些處在開發(fā)初期，而且規(guī)模比較小的團隊。

原子設計就是由原子、分子、組織、模板和頁面共同協(xié)作，創(chuàng)造出用戶界面系統(tǒng)的一種設計方法論。

原子設計的五?個階段分別是：

1.原子。構(gòu)成頁面的基本元素。例如標簽、輸入，或是一個按鈕，也可以為抽象的概念，例如字體、色調(diào)等。

2.分子。由原子構(gòu)成的簡單 UI 組件。例如，一個表單標簽，搜索框和按鈕共同打造了一個搜索表單分子。

3.組織。由原子及分子組成的相對復雜的 UI 構(gòu)成物 。

4.模版。將以上元素進行排版，顯示設計的底層內(nèi)容結(jié)構(gòu)。

5.頁面。將實際內(nèi)容（圖片、文章等）套件在特定模板，頁面是模板的具體實例。

原子設計理論的優(yōu)點是一致、清晰、高效，使用的時候要根據(jù)實際情況靈活運用，不求全面，但求實用。

「即時設計」官網(wǎng)地址：https://js.design