在設計師的角度講系統開發

仲介交易 SEO診斷 淘寶客 雲主機 技術大廳

公司開發某系統已經有一段時間了，功能已經得到一些客戶的肯定，但介面不好看一直是個大問題，所以前兩三周專門做這方面的改善。 面對著N個介面的設計，N++個雜、碎、亂的頁面整理，著實是件頭疼的事情。 還好這一切已經完成，為那兩三周的忙碌總結幾點吧。

先簡單概述一下系統介面美化的工作流程

1、準備階段：熟悉，看系統相關的文檔，對系統有個大概把握，不至於設計時鑽牛角尖;估量，大概總結需要改善細化的頁面問題;估時，計畫工作時間;定人，明確參與修改的人員，設計師和程式開發人員。

2、設施階段：設計，設計系統需要美化重點介面;規範，制定頁面配置展示結構，規範CSS;修改，參與和指導程式開發人員嚴格按照制定好的結構、規範修改頁面，這個過程相當繁瑣。

3、複查階段：細查，如圖示的透明背景、彈出框大小等等;補救，手動對每個介面簡單操作一下，總結補救遺留問題;提交。

其實，很多程式師注重產品功能開發卻忽略了介面易用性和美觀，導致開發的產品糙，難看。 他們忘記了系統開發是給人用的，操作的不便、難看，同樣不會讓使用者中意。 但如果每次開發都是讓介面設計師去彌補，對設計師、對程式師都挺累的。 與其這樣還不如將展現層早日納入開發日程。

站在設計師的角度為系統開發提供幾點建議

一、設計師須參與系統設計。

設計師的作用不應該只是對單一介面的美化，反過來說，如果他對開發的系統不理解，他的視角會很低，無法站在系統的高度有整體設計思路，一個介面炫只能解決表面問題，是解決不了較深問題的。 Mars想這大概也是美工與設計師的區別所在吧。

最近在看Jesse James Garrett的《使用者體驗的要素》，其中講了使用者體驗的五個層面(如圖)：戰略層、範圍層、結構層、框架層、表現層。 Mars看來，在前兩個層面設計師 必須充分理解，Mars在上這個系統開發時就忽略這兩點，所以導致後期的彌補工作，後三個層面設計師必須直接參與，出界面、定規范等。 這樣的話系統設計、 開發將按」一」道路順利進行，不至於走」Z」形道路。

二、設計系統重點頁面的效果圖

Mars覺得出效果圖必須是在充分理解系統的前提下，這樣設計出來的介面才能在頁面上詮釋系統，而不單單講究某個按鈕的水晶效果什麼的。 在這個環節 設計師就需要與系統開發相關負責人、測試人員(這裡扮演」使用者」角色)充分交流溝通，從日後擴展、易用、美觀等各個角度思考設計。 相比較程式開發來講，出 圖還是小成本的事情，為了不走」Z」形道路，這些介面一定要好好斟酌。

三、設計師協助程式開發負責人設計開發規範。

其中設計師協助的可能包括，系統目錄架構，方便日後樣式更換;展示頁面，頁面配置的程式結構;名稱規範，佈局結構標籤、CSS樣式、圖片相關名稱規範等。

以上工作及相關規範的提出，給日後程式開發提供了方便，樣式這一塊，只需套用通用的結構就行了。

四、系統開發的人員組織

要求系統開發人員嚴格按著設計圖和規範來走，不要只關注自己開發的那點功能，代碼結構不清晰，樣式在頁面頭、標籤上到處定義的都是，考慮一下日後改 版怎麼辦，不能將上千個頁面再重寫吧。 系統開發不太可能一兩個人搞定，多人協作沒有一個規範作參考，各自在自己的思路寫程式最終出來的系統可能糙、亂。

以上四點是Mars在設計師的角度對系統開發提出的部分建議，如果您想要把系統做得精細，建議參考一下。