雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

后臺管理界面設(shè)計技巧有哪些?設(shè)計用什么工具好

Time: 2019-12-20

后臺管理的設(shè)計,是非常重要的,設(shè)計的好,就吸引顧客,那么,后臺管理界面設(shè)計技巧有哪些?設(shè)計用什么工具好,帶著這些問題,接下來就讓小編來給大家介紹一下這方面的內(nèi)容吧。


界面設(shè)計工具有哪些?


  1.Kendo UI

  Kendo UI是Telerik開發(fā)的基于jQuery HTML5的UI框架,開發(fā)面向桌面、移動設(shè)備的應(yīng)用程序,主要有Kendo UI Web,Kendo UI Mobile 和 Kendo UI DataViz三個版本。它包含了大量UI組件、豐富的數(shù)據(jù)可視化框架、一個自適應(yīng)移動框架,以及HTML5 app開發(fā)所需的所有工具,如數(shù)據(jù)綁定、模板、拖放API等等。


  2.MOQUPS

  這個工具可創(chuàng)建出非常驚人的HTML5 app,具有高保真、獨立分辨率的SVG模型和線框。


  3.Webflow

  Webflow可以讓你直接在瀏覽器上創(chuàng)建交互式布局和像素完美的設(shè)計元素,并且不用編寫一行代碼!


  4.JetStrap

  這是一個完全基于Web的界面設(shè)計工具,JetStrap號稱不僅僅是一個模型工具,它是針對BOOTSTRAP 3中最頂尖的界面開發(fā)工具。

  5.NetAdvantage ICONS

  這個圖標庫是著名界面控件開發(fā)商infragistics提供的,它分類齊全、系統(tǒng),可以為用戶界面添加各種專業(yè)的、充滿藝術(shù)格調(diào)的圖標,使用后為界面外觀增色不少。難得的是這些圖標即插即用,操作非常方便! 


2.png

(圖片來自網(wǎng)絡(luò))


后臺管理界面設(shè)計技巧有哪些?


  1.高級搜索

  當搜索條件超過一定數(shù)量,我們可以將不是首要的的搜索條件隱藏,將頭部寶貴的空間釋放出來展示列表重要搜索內(nèi)容。高級搜索和普通搜索的切換就很好的實現(xiàn)相應(yīng)需求。


  2.批量操作列表中多條信息

  對于表單頁面,原始的excel表單可以做到批量選擇和批量操作。許多后臺對于表單的處理往往過于簡單,只能基本滿足增刪改查。

  后臺也可以用自定義勾選的方式對多個列表內(nèi)容進行批量操作,如圖可勾需多個列表或全選后進行批量刪除、作廢、更改負責人、發(fā)郵件、發(fā)信息、轉(zhuǎn)移等等…


  3.單個表單抬頭字段篩選

  一般的數(shù)字、時間、字母排序單個表單都有隱形的排序框,數(shù)字從小到大、時間從近到遠或者26個字母排序。但是對于其余抬頭篩選就只能做頂部選擇或文字輸入篩選,那樣浪費的區(qū)域會增多。

  而如果直接隱藏在抬頭下面作為一項列表內(nèi)容,自定義篩選的靈活度會大很多,整個頁面也會放出更大的空間展示列表內(nèi)容。


  4.表頭、確定表單頁面和不操作頁面局部固定/自定義篩選字段

  在瀏覽的眾多網(wǎng)站中,由于某一部分內(nèi)容都有高頻的操作或查看,頁面在設(shè)置的時候會有意識將這部分板塊固定,不隨其它內(nèi)容上下和左右滑動。

  在后臺也存在這樣的需求,除了抬頭部分還有特殊字段和對表單頁面的保存、取消、審核等高頻操作都可以設(shè)置為固定板塊存在在頁面中,使頁面的重點更為突出,內(nèi)容查看更有趣味性。


3.jpg

 ?。▓D片來自網(wǎng)絡(luò))


5.消息隱藏

  消息隱藏也是在做一個電商的項目,學習到的一種方法。因為消息分類較多,可操作和不可操作的消息類型疊加,并且消息的重要程度也是層次不齊,以至于消息列表點擊進入查看還需要進行分類。

  但是在首頁,將消息分類的同時,直接鏈接進入相應(yīng)待辦和查看頁面進行操作,用更直觀的方式轉(zhuǎn)達給用戶去查看或操作,也省去頁面跳轉(zhuǎn)間的頻率和時間。


  6.抬頭標題操作切換

  看過線下excel表單的抬頭有幾十個的情況,A4紙打印都得有好幾頁才能展示全面,網(wǎng)頁的寬度最多也只能容納15-20個抬頭(抬頭文字全部展示完的情況下),怎么解決數(shù)據(jù)量太大,抬頭區(qū)域不夠展示的情況呢?只能做隱藏。

  隱藏字段是否展示或者展示優(yōu)先集的權(quán)利都交到用戶手上,給他們一個最自由化的配置,只選擇自己想要查看的字段,選擇過多的字段導致文字省略用戶也會理解而進行合理的分配。

  

7.切換當前內(nèi)容的視圖,突出角色主要內(nèi)容

  在淘寶移動端的商品列表中,我們經(jīng)常根據(jù)自己的喜好來切換展示方式。是單行顯示單個商品,還是單行顯示兩個商品,切換方式能讓用戶更大限度的看到自己想看的商品信息。

  后臺也可以切換視圖使用戶用更習慣的方式,展示列表內(nèi)容。切換視圖有許多表現(xiàn)方式來表現(xiàn),如列表、地圖、剖面圖、折線圖、扇型圖。

  顧名思義,視圖就是更換另一種表現(xiàn)形式。一定要選取與設(shè)計的產(chǎn)品相符合的表現(xiàn)形式,才能更加突出這是一種技巧,如果只為了炫酷的效果,而增加多種視圖,沒有需求人群,那這種轉(zhuǎn)換也是沒有意義的。


  好了,看了小編介紹了這么多,相信大家對后臺管理界面設(shè)計技巧有哪些的相關(guān)內(nèi)容有了更深一步的認識了,大家在設(shè)計時,可以參考一下這些技巧哦。


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開