頁面整體布局采用上面頂部菜單、左側(cè)操作欄、中右為內(nèi)容三部分。采用iframe布局框架,頁面整體為自適應,右側(cè)可以無限拉伸。 左側(cè)數(shù)據(jù)目錄使用ztree開發(fā),通過對數(shù)據(jù)的綁定,實現(xiàn)數(shù)據(jù)的動態(tài)化。 右側(cè)內(nèi)容區(qū)域使用Tab切換,疊加數(shù)據(jù)采用滑動的方式更改頁面的參數(shù),并且可以調(diào)整數(shù)據(jù)的優(yōu)先級。

數(shù)慧時空(全稱:北京數(shù)慧時空信息技術有限公司)是以空間信息技術為核心、國內(nèi)領先的國土資源行業(yè)解決方案提供商,具有業(yè)務咨詢、自主軟件研發(fā)、數(shù)據(jù)加工和信息服務的全業(yè)務綜合服務能力,是國土資源部最重要的信息化合作單位之一。藍藍設計多次為數(shù)慧時空設計軟件界面設計,逐漸優(yōu)化國土產(chǎn)品線、項目線的UEUI。
頁面整體布局采用上面頂部菜單、左側(cè)操作欄、中右為內(nèi)容三部分。采用iframe布局框架,頁面整體為自適應,右側(cè)可以無限拉伸。 左側(cè)數(shù)據(jù)目錄使用ztree開發(fā),通過對數(shù)據(jù)的綁定,實現(xiàn)數(shù)據(jù)的動態(tài)化。 右側(cè)內(nèi)容區(qū)域使用Tab切換,疊加數(shù)據(jù)采用滑動的方式更改頁面的參數(shù),并且可以調(diào)整數(shù)據(jù)的優(yōu)先級。
根據(jù)甲方提供的原型圖,自己結(jié)合自己的理解將主要信息,次要信息圖形可視化等對系統(tǒng)頁面從四個方面進行重設計(布局、色調(diào)、交互方式、圖標設計)。 使頁面看起來有重點并且不會單調(diào)乏味操作流程上減少用戶操作步驟,做到為用戶提前想一步、讓用戶少操作一次。 中間熱門云標簽基于echarts開發(fā),數(shù)據(jù)的可視化,使用戶在處理數(shù)據(jù)的過程中更加直觀、便捷、快速和 。并且有著很好的交互性,在使用過程中更容易被用戶接受(相對于讀表的時代)。
數(shù)據(jù)資源頁面采用了當下最流行的卡片風格,增強點擊感,不會造成視覺混亂而發(fā)生錯誤點擊的情況。使頁面更加有條例,它更直觀的給用戶知道這一塊卡片里的內(nèi)容是代表一個整體,一個模塊的信息。方便后期維護與延展。 當鼠標移入卡片會出現(xiàn)過度的反轉(zhuǎn)效果,具體介紹每個欄目的具體信息。
本項目設計四十頁左右,其它頁面詳情略