最近一年來一直都在做云計(jì)算領(lǐng)域的web端控制臺(tái)設(shè)計(jì),在相對(duì)完善的團(tuán)隊(duì)設(shè)計(jì)規(guī)范下,自身愈發(fā)陷入到套規(guī)范狞谱,然后將控件搭建成表單,列表禁漓、卡片拼裝成典型頁(yè)面的套路中跟衅。作為一個(gè)交互設(shè)計(jì)師每天將工作重點(diǎn)放在了與產(chǎn)品經(jīng)理對(duì)需求及討論業(yè)務(wù)邏輯上,而忽視了本身產(chǎn)品的交互細(xì)節(jié)打磨上播歼。在控制臺(tái)視覺相對(duì)克制的情況下伶跷,將所有的方案做到了千篇一律,沒有任何亮點(diǎn)。同事從身邊了解到許多中后臺(tái)交互設(shè)計(jì)師都是在用ant design等一些組件庫(kù)拼裝典型頁(yè)面叭莫,而缺少對(duì)于頁(yè)面場(chǎng)景磷支,甚至控件級(jí)別的用戶場(chǎng)景思考。
在接下來的一段時(shí)間內(nèi)我會(huì)從常用控件入手食寡,再到典型頁(yè)面雾狈,可能最終包括文案規(guī)范、詞條建議抵皱、典型場(chǎng)景善榛、設(shè)計(jì)框架,整理出一些讓平成牖可能被大家忽視的web交互細(xì)節(jié)與大家分享移盆,也作為自身今后中后臺(tái)設(shè)計(jì)的一些輸入,給它取名為web ui plus計(jì)劃伤为。
后續(xù)整理參考的范圍大致有4種來源:
1咒循、知名的B2B企業(yè)設(shè)計(jì)系統(tǒng),如Salesforce绞愚、IBM叙甸、VMware等
2、知名的設(shè)計(jì)腳手架位衩,如ant design裆蒸、elment、Semantic等
3糖驴、大廠的設(shè)計(jì)系統(tǒng)僚祷,如Google、Microsoft等
4贮缕、個(gè)人覺得有意思的設(shè)計(jì)系統(tǒng)辙谜,如Trello(SaaS類)、United States government(政府web規(guī)范)
設(shè)計(jì)系統(tǒng)直達(dá):
阿里螞蟻團(tuán)隊(duì)?Ant Design —— 服務(wù)于企業(yè)級(jí)產(chǎn)品的設(shè)計(jì)體系
阿里Fusion Design Fusion Design —— 協(xié)助企業(yè)設(shè)計(jì)師與前端構(gòu)建并使用設(shè)計(jì)系統(tǒng)
餓了么?Element ——?一套為開發(fā)者感昼、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于 Vue 2.0 的桌面端組件庫(kù)
有贊 ZanUI —— 再造一個(gè)有贊微商城也不在話下
VMware?Clarity Design System
Salesforce Lightning Design System ——?Create the world’s best enterprise app experiences
MongoDB?MongoDB Design ——?Design for mission-critical applications
Stackoverflow?Stacks
Trello?Nachos
Cloudflare?cf-design
United States government??U.S. Web Design System ——?A design system for the federal government
Semantic UI?Semantic UI ——?Design Beautiful Websites Quickly
Google Material Design for Web
Microsoft?Fluent Design System
IBM?Carbon Design System ——?IBM’s open-source design system for products and experiences
參考資料:
1装哆、設(shè)計(jì)系統(tǒng)集合平臺(tái):The Design Systems Platform