<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • B端后臺設計規范—OA系統為例

          2022-4-20    純純

          綜合監管平臺是對自然資源管控的一個OA系統。主要功能是對國土資源相關業務的監測、評估和統計,將各專項規劃實現“多規融合”,從而優化城市自然資源配置,做好國土空間規劃統籌。


          為什么要有設計規范

          1、多個設計師同步設計

          我們部門有2名UI設計師,所以在我們同時畫同一個項目界面時,為了保持整個設計的統一,就需要我們設定設計規范。


          2、設計與前端之間的溝通

          與設計同理,開發人員參照統一的設計規范寫頁面,可避免同一系統中出現設計控件混亂的情況,從而提高開發效率、減少溝通成本、減少返工率。


          3、在公司內部復用

          在公司內部,設計規范可運用在多個項目中,從而減少開發的工作量、提高開發效率。


          建立設計規范前的工作

          從產品經理手中接到原型圖,首先是與產品經理的溝通,包括客戶需求、設計風格的確定、頁面內容的布局等等,關于設計尺寸,因為我們客戶用的是1920*1080分辨率的電腦,所以設計就基于1920*1080尺寸來做;但有時會基于1440*900的尺寸來設計,然后上下適配1920*1080和1366*768。所以設計尺寸要根據具體情況而定。


          頁面框架

          a、主體框架分為四個區域:頂欄、左側欄、頁簽、主體內容

          b、主體內容上、左邊距為10px,默認顯示一屏高度,超出的內容加上下滾動條

          c、頁面中的各個組件根據不同屏幕分辨率采用自適應


          如何建立設計規范

          1、顏色規范

          后臺系統主色調大多運用藍色,這是因為藍色往往圍繞著科技、安全、信任等等,很符合業務場景,比如智慧城市、智慧醫療、智慧交通等。但是藍色用多了也會讓人感覺沒有新意、審美疲勞,所以在色調這塊,后臺系統可以采取皮膚功能的擴展,做兩套配色好的皮膚供客戶選擇,這樣避免了因客戶的不滿而一次次的修改,從而提高工作效率。

          2、文字規范

          因為我們面向的客戶多為政府工作人員,且年紀稍長,所以字號要比平常的網頁設計要稍大一些;常用字體,中文:微軟雅黑,英文或阿拉伯數字:Arial;行間距=字體+8px。

          undefined

          3、按鈕規范

          按鈕是用戶與系統間交互的一個重要觸點,用于特定觸發事件的發生。按鈕類型可分為線性按鈕、面型按鈕、文字按鈕、圖標按鈕、圖標+文字按鈕,按鈕狀態分為常規、懸停、按下、禁用。按鈕的寬、高、曲率、文字離邊框的間距需要在規范中寫明。

          4、表單規范

          在后臺系統中,表單多用于登錄注冊、搜索框、選擇器、信息錄入等。表單類型可分為輸入框、下拉框、時間選擇框、單選框、多選框等等,表單狀態分為默認、輸入/選中、填寫完成/已選擇、不可填寫/不可選、錯誤提示。對于必填表單,需在標簽前后或輸入框后增加“紅色*號”。輸入框的高度、曲率需要在規范中寫明。

          5、表格

          此圖為可進行單選或批量選擇、排序、表頭分組和帶有凍結列的復合型表格:

          a、固定列表格:對于屏幕無法展示完全的內容,可以采用凍結重要列的方式,然后橫向加滾動條左右滑動

          b、可對數據進行排序:升序和降序

          c、文字類字數限制:重要字段全部顯示,其他文字信息超出寬度以“...”代替,鼠標懸停時顯示全部內容

          d、對齊方式:文字信息左對齊,因為人的閱讀習慣是由左到右、由上到下的,此外在主從型列表中,采用左對齊錯開文字,可使用戶一目了然,降低視覺噪音;數據信息右對齊,因為數字單位個十百千萬...是由右向左,方便比較數據大小


          文章來源:站酷    作者:Alice冰冰
          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計m.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務



          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://m.sdgs6788.com

          存檔

          久久99久久99小草精品免视看| 久久久久亚洲?V成人无码| 人妻无码精品久久亚瑟影视 | 亚洲国产精品综合久久网络| 模特私拍国产精品久久| 亚洲人成伊人成综合网久久久| 狠狠色婷婷久久一区二区三区| 91麻豆精品国产91久久久久久| 亚洲v国产v天堂a无码久久| 99久久精品免费看国产一区二区三区| 久久99国产综合精品免费| 国产精品欧美久久久久天天影视| 欧美日韩久久中文字幕| 久久久九九有精品国产| 亚洲欧美国产精品专区久久 | 国产精品免费久久久久久久久| 亚洲精品美女久久久久99小说 | 久久亚洲精品成人无码网站| 俺来也俺去啦久久综合网| 伊人久久无码精品中文字幕| 国产一级持黄大片99久久| 亚洲国产欧洲综合997久久| 久久99精品免费一区二区| 精品无码久久久久久尤物| 久久久亚洲AV波多野结衣| 久久久久亚洲AV成人网人人网站| 狠狠色丁香婷综合久久| 亚洲va久久久噜噜噜久久狠狠| 人人狠狠综合久久亚洲高清| 国产精品成人无码久久久久久 | 欧美亚洲另类久久综合婷婷| 狠狠色丁香婷婷久久综合不卡| 久久久久国产精品熟女影院| 久久精品卫校国产小美女| 亚洲日韩欧美一区久久久久我| 久久99精品国产麻豆不卡| 国内精品久久久久久久coent| 狠狠色丁香久久综合婷婷| 日韩欧美亚洲综合久久影院d3| 久久无码人妻一区二区三区 | 青青草原综合久久大伊人精品|