前言

低代碼設(shè)計器，旨在讓用戶舒心。其優(yōu)質(zhì)體驗源于兩大要點：操作簡易，響應(yīng)迅速。

低代碼設(shè)計器常用的模塊

物料區(qū)

物料區(qū)不宜過窄，也不能太寬，不能超過屏幕的三分之一。建議放屏幕左邊，從左往右拖拉是大部分用戶的使用習(xí)慣。次選放上邊，和下邊都可，不分伯仲。

設(shè)計區(qū)

設(shè)計區(qū)可以放中間居中，建議面積二分之一或以上。也可以放右邊整個沾滿。

組件屬性設(shè)置區(qū)

若設(shè)計區(qū)居中則可以使屬性設(shè)置區(qū)放最后邊，若設(shè)計器占滿右邊，則屬性設(shè)區(qū)也可以放左邊。但要注意與物料區(qū)之間的重疊，可采用選項卡的形式。

常用的設(shè)計器例子

如圖1所示，第一種設(shè)計，簡潔。

優(yōu)點：

l 簡潔

缺點：

l 不好擴展

圖1

如圖2所示，若有多個設(shè)計區(qū)，上下均分。

優(yōu)點：

l 簡潔

l 可以同時進行設(shè)計

缺點：

l 設(shè)計區(qū)狹小

l 擴展上限有限

圖2

如圖3所示，若有多個設(shè)計區(qū)，左右均分。

優(yōu)點：

l 簡潔

l 可以同時進行設(shè)計

缺點：

l 設(shè)計區(qū)狹小

l 擴展上限有限

圖3

如圖4所示，若有多個設(shè)計區(qū)，還可以通過頂部tab選項進行切換設(shè)計。

優(yōu)點：

l 頂部切換能全面切換設(shè)計器，可以是兩種不同的設(shè)計頁面，比如流程設(shè)計器，模型設(shè)計器等，可以獨立的有自己的物料區(qū)和屬性設(shè)置區(qū)。

l 擴展性強

缺點：

l 對相同物料的設(shè)計器不好處理

圖4

如圖5所示，若有多個設(shè)計區(qū)，把屬性欄也放到左邊進行tab切換。

優(yōu)點：

l 可以使是設(shè)計區(qū)更大。

l 可以使物料區(qū)更大。

l 極大的擴展性。

缺點：

l 屬性設(shè)置和物料拖拽不能同時進行

l 設(shè)計區(qū)內(nèi)容無法同時設(shè)計

圖5

總結(jié)

在進行設(shè)計時，請結(jié)合業(yè)務(wù)復(fù)雜度的實際情況進行規(guī)劃，避免盲目追求過度的擴展性。對于業(yè)務(wù)模塊，建議進行細致拆分，以便在特定階段能夠迅速調(diào)整布局，提升響應(yīng)速度和靈活性。同時，確保設(shè)計區(qū)和擴展代碼區(qū)的空間充足，以便更好地滿足開發(fā)需求。

在界面設(shè)計上，要盡量減少操作的距離，提高用戶的使用效率和舒適度。開發(fā)者在面臨性能與功能之間的權(quán)衡時，需做出明智的取舍；而產(chǎn)品設(shè)計師在追求個性與創(chuàng)新時，也需考慮用戶體驗和實際需求。