後台系統互動心得

2022-02-17 19:36:16 字數 3313 閱讀 5593

後台系統採用一整套ui,為什麼會形式各異?能統一並帶來更好的體驗嗎?基於互動設計師自己的內心疑問,我們迫切的產出一套設計規範用於統一後台作業系統,利於使用者使用習慣的培養和延續,降低學習成本,提高使用效率,有效提高開發效率,方便功能的優化擴充套件。

基於現有的系統,我們抽絲剝繭,才有了如今的階段性成果。

使用者是誰?需求是什麼?互動設計師對於乙個專案最基本的了解就是源於這兩個問題。我們做這次規範也是如此。。。。。。

你知,或者不知

規範就在那裡

不悲不喜

使用者是誰?我們的系統是給誰用的?

初期是給我們的小二,後期系統會開放,外部商家或是委託方也會來使用我們的系統。那麼我們第一次做系統規範的由於商家或委託方的資訊掌握不到,可以主要針對我們的小二。

我們的小二有什麼特點呢?他們目前是什麼方法在錄入資訊的呢?

小二這個角色在我們的部分可以細分為:認證小二,物流小二,行業運營小二(行業運營小二裡面還分:買手,買手助理,店鋪運營小二,**運營小二……)每種角色來這個系統的目的都是不同的,行業運營小二,進來主要是錄入資訊,跟蹤訂單。

物流小二主要是檢視審核行業小二的申請,跟蹤訂單,檢視報表。認證小二主要是審核行業小二或商家的申請,跟蹤認證情況,分析資料。

需求是什麼?

由於當初系統發展情況參差不齊互動資源不夠,前端控制項沒做,導致使用者極難使用。系統開放過程中,頻繁的更換互動、視覺還有前端,導致現在單個系統互動方式有差異,多個系統呈現給同乙個使用者時,雖然基本框架沒問題,但是在操作過程中效率低。

解決方案:使用者急需乙個好用的後台系統來提高他們的效率。

我們這次要做規範的目的是統一現有三個系統的視覺+互動規範,然後交付前段,前端來規定他們的**規範。讓我們一起走上提高我們小二的工作效率的第一步。

你念,或者不念

規範就在那裡

不來不去

從哪個緯度展開規範設計?

1. 控制項

在計算機程式設計當中,控制項(或部件,widget或control)是一種圖形使用者介面元素。是一種基本的可視構件塊,包含在應用程式中,控制著該程式處理的所有資料以及關於這些資料的互動操作。

在parc研究中心對施樂的alto電腦(xerox alto)使用者介面的研究基礎上,如今已逐漸產生一組包含常規資訊的可重用控制項。常規控制項的不同組合通常打包在部件工具箱中,程式設計師可以構建圖形使用者介面(guis)。 大多作業系統包括一套用於程式設計的控制項,程式設計師只需將它們加入應用程式,指定它們的行為。

組合控制項

描述:為實現產品中某一特定功能而獨立出來的模組,其特點在於功能相對單一,在結構層和行為層應具備很強的可復用性,在表現層應保持一致性,方便使用者識別。從單一控制項可以衍生出多種組合控制項以適應不同功能操作,如:

上傳組合控制項,列表組合控制項。

定義維度:控制項描述、控制項示意及尺寸、是否使用者反饋、設計理念、控制項應用。

你愛,或者不愛

規範就在那裡

有增無減

2. 框架規範

在第一步完成了控制項基礎後,第二步的問題就是如何運用該控制項?讓控制項在場景中發揮作用,竄連出整個操作流程。這種目的之下,我們所要做的就是制定結構和規則,就如同用這些控制項做成建築物一般,這就是框架規範的作用。

在設定框架時,我們要考慮到以下幾點問題:

2.1不同的流程與場景

由於業務場景不同,流程也不一樣,那麼如何定義頁面,和頁面基礎內容塊?

這裡不妨假設流程中遇到的4種基本場景——>建立,查詢,編輯,詳情,回饋

這四類頁面,運用的基礎控制項型別也不一樣,通過這4類我們可以竄連基本的業務流程。

a. 建立編輯

建立和編輯都是對基礎資料的輸入和修改,這個介面用到最多的就是imput,表單,還有鏈結。從螢幕上劃分為三列式。含有大量的操作驗證和操作提示塊。

b. 查詢

查詢頁面主要使用的是條件輸入操作和檢視表單的功能,需要介面操作區和反饋區清晰明確,因此在框架上為兩大區域,保證他穩定使用的習慣。 另外考慮各種匯出和檢視的鏈結。

c. 彈出頁面

彈出頁面的大小只佔整個頁面大小的三分之一,這樣資訊流不會太大,構造結構也不複雜。

d. 資訊反饋

在完成乙個頁面操作後及時反饋操作結果,這裡的元素主要是:操作結果+語氣詞+建議動作。以及相關鏈結。所以對文字架構和展示有個限定,並配合一定的資訊的icon.

2.2 操作

不同於大框架,這個彈出頁面所承載的作用是保持當頁資訊比對下進行彈出操作,因此,操作會簡單直接,運算元量保持3,到4次操作內。然後在回到主頁持續操作其它。

a. 詳情頁面

詳情頁面是所有操作情況的明細。是流程的結果,所以它模組分類會比較清楚,主要是文字和數字構成,資訊層次基本是2-3級。分類也控制在4-5類內,資訊過多,會有收起展開的功能,來控制資訊量過多對傳到和尋找造成的麻煩。

b. 不同的顯示器解析度

考慮最常用的1028,和最基礎的1024。把最常用的量歸結為一螢幕三個控制項加上判斷和驗證和控制項組合,考慮特殊運用。場景中最可能出現的資料和控制項發生結果在操作頁面時,使用者最關心資料,所以要考慮在介面中如何理順他們的層次。

如何對當頁反饋的資訊占用的位置和變化進行規範。比方說查詢和攜帶搜尋過來的資料展示,還有上傳 ,在當頁顯示資料的展示分類。這些排版規則,既要考慮到資訊傳達的清晰,也要考慮到資訊量的大小。

2.3 數位化柵格化整個體系,易於著地

柵格化體系之所以在web端這麼適用,也是因為資訊和版塊過多時,在前端的環節易於分塊進行分割,保持頁面的舒暢和整齊。以5,或者10為單位,基本適用於任何的排列和切割,無論場景,控制項,資料元素多麼複雜,都能用一定的單位計算其尺度大小,順利排列得下。形成一定的穩定架構。

你跟,或者不跟

規範就在你我手裡

不捨不棄

3.視覺規範

圖示:是具有指導,標識性質的圖形,它具有高度濃縮並快捷傳達、便於記憶的特性。好的圖示,能完善視覺,提公升體驗,更好的與使用者進行溝通,在必要的時候能給使用者以明確提示,指導使用者去順利的完成操作。

設計時需注意:

1.確保圖形對映唯一性,可識別性;

2.設計盡量簡潔,易懂,避免多餘元素的出現;

3.風格趨於統一;

4.尊重習慣,多用常見圖形,避免誤導;

美學角度需注意:

1.造型上由一到三個圖形組合,且最多不超過3個;

2.質感細膩,豐富;

使用規範:優先使用已有圖示;如已有圖示無法滿足需求,則嚴格按需求提交流程申請新圖示

4.前端開發介入

前端開發是我們的親密夥伴,所以盡快拉他們入夥,一方面仰仗於他們的技術支援及開發建議;另一方面他們也是受益人,一整套控制項庫開發出來也便於他們的呼叫及管理。

5.規範產出

眾志成城,規範的產出仰仗於全體互動設計師工作之餘的見縫插針及齊心協力,反覆溝通**,整合統一。

v1.0只是個開始,接下來我們還會不斷完善、調整這套規範,不斷打磨使其更趨完善。

後台管理系統功能需求

中易廣告聯盟後台管理系統 功能需求 2013年11月14日 目錄1 登入介面設計 1 2 頁頭設計 1 2.1 後台首頁 1 2.1.1 控制面板 2 2.1.2 版本資訊 3 2.1.3 版權所有 3 2.1.4 伺服器負載 3 2.2 聯盟首頁 4 2.3 財務管理 4 2.3.1 結算管理 4...

電子商務後台管理系統

同時,訂單規模如果上公升,配送成本也會大幅降低。一般來說,日均單量穩定在2000單以上,就可以在倉庫所在地的周邊地區或包裹量集中的幾個城市,採用幹線物流 點到門的配送方式,配送成本可降低30 如果日均5000單以上,就可在訂單密集地區設立分倉,如果每個分倉日出庫量能達到2000單以上,配送成本就會降...

IRS互動反饋系統的使用心得

在以這種方式上這幾節課之前,我從來沒有接觸過甚至是見過irs互動反饋系統。出於好奇,搜尋了一下有關此系統的內容。irs互動反饋系統是通過電子工具,讓課堂中全班學生可以即時反饋資訊給老師的一種教學應用系統,是近幾年來改善課堂教學品質最重要的資訊應用裝置之一 為師生們建立了乙個自如 平等 實時交流的平台...