2022-4-5 純純
組件化思維對于一個設(shè)計師來說十分重要,它能夠幫助你更好的去進行產(chǎn)品的設(shè)計,那么組件化思維對于設(shè)計者都起到什么作用呢?
1.符合產(chǎn)品功能邏輯,組件化的設(shè)計理念能幫助設(shè)計符合產(chǎn)品功能邏輯。
2.有助于保持交互一致性,在一個項目里,選擇日期應該是統(tǒng)一的交互方式,在整個產(chǎn)品中就應該只有一種存在形式。所以時間選擇器就是一個組件,一個可以復用的組件,如果你沒有組件化思維,很可能出現(xiàn)好幾個不同的時間選擇器,一會兒是流輪撥盤,一會兒是日歷,一會兒又是下拉列表,這樣的設(shè)計絕對是不能上線的。當然該統(tǒng)一的地方還有很多,比如:錯誤提示的形式,講度條的交互方式,導航欄和按鈕的樣式。表單,下拉菜單等等。
3.減少開發(fā)工程師的工作量,開發(fā)時使用不同的技術(shù),了解不同技術(shù)之間的差異,設(shè)計時按照每個開發(fā)軟件的組件來做設(shè)計極大的減少了開發(fā)的時間.
4.保持視覺風格的統(tǒng)一,在同個項目不同頁面按鈕等組件的樣式上應該保持統(tǒng)一。
5.便于多設(shè)計師協(xié)作組件化設(shè)計是大型設(shè)計項目的必要條件,多人協(xié)作完成項目時,應當保持視覺統(tǒng)一規(guī)范,組件化建立就起到了至關(guān)重要的作用。
6.便于修改設(shè)計,設(shè)計總是需要修改優(yōu)化的,只需要根據(jù)需求調(diào)整需要調(diào)整組件即可。
針對各種組件的開發(fā)軟件做了以下介紹,歡迎在評論區(qū)進行補充與探討!
echarts
幫助各行業(yè)進數(shù)據(jù)處理以及分析,一鍵生成餅圖,柱狀圖,甘特圖,折線圖等多種圖表;簡道云的圖表分析
各種圖示效果樣式案例可供設(shè)計者參考
https://echarts.apache.org/examples/zh/index.html#chart-type-line
Ant Design
ant通過模塊化解決方案,降低冗余的生產(chǎn)成本,讓設(shè)計者專注于更好的用戶體驗,規(guī)范設(shè)計的設(shè)計思維,有豐富的設(shè)計資源與組件,對設(shè)計樣式的表達起到非常好的參考作用
https://ant.design/index-cn
Element
與Ant Design稍加相似,可供設(shè)計者作為輔助參考
https://element.eleme.cn/#/zh-CN/guide/design
另外其它的開發(fā)工具:
React是用于構(gòu)建用戶界面的JavaScript庫,起源于Facebook的內(nèi)部項目
Hook 可以中文譯為“掛鉤”或者“鉤子”,逆向開發(fā)中改變程序運行的一種技術(shù),在逆向開發(fā)中是指改變程序運行流程的技術(shù),通過Hook在別人的程序中。需要了解其Hook原理,這樣就能夠?qū)阂獯a攻擊進行有效的防護
Umi 是一個可插拔的企業(yè)級 react 應用框架。 插件化 umi 的整個生命周期都是插件化的,甚至其內(nèi)部實現(xiàn)就是由大量插件組成
可擴展 Umi 實現(xiàn)了完整的生命周期,并使其插件化,Umi 內(nèi)部功能也全由插件完成。此外還支持插件和插件集,以滿足功能和垂直
Vue 有兩大特點:響應式編程、組件化。其優(yōu)勢為:輕量級框架、簡單易學、雙向數(shù)據(jù)綁定、組件化、數(shù)據(jù)和結(jié)構(gòu)的分離、虛擬DOM、運行速度快。
vue是單頁面應用,使頁面局部刷新,不用每次跳轉(zhuǎn)頁面都要請求所有數(shù)據(jù)和dom,這樣大大加快了訪問速度和提升用戶體驗。它的第三方ui庫很多節(jié)省開發(fā)時間。https://cn.vuejs.org/v2/guide/index.html
注: vue是我們的常用框架,大多數(shù)客戶的選擇。ant?react?hook?umi,中后臺這個也比較多,最近的項web端的基本上是這兩種選型。
其它常設(shè)計有wpf/qt/mfc/開發(fā),在c++或c#下運行的客戶端程序
其它例如:
Bootstrap 是Twitter推出的一個用于前端開發(fā)的開源工具包。是基于 HTML、CSS、JAVASCRIPT 的,它簡潔靈活,使得 Web 開發(fā)更加快捷
https://getbootstrap.com/docs/5.1/examples/
developer與material匯聚了ios、安卓組件框架及人機交互指南,相關(guān)鏈接:
https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/
https://developer.android.google.cn/docs/quality-guidelines/core-app-quality
https://material.io/components?platform=android
藍藍設(shè)計—— 作者:純純
免責聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍藍設(shè)計( www.wnxcall.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
藍藍設(shè)計的小編 http://www.wnxcall.com