【怪物開發團隊】介面與視覺設計師 篇

【怪物開發團隊】介面與視覺設計師 篇

一般系統開發公司都會有個職位叫做『美工』,只要你會PS、FLASH之類的繪畫軟體,基本上就可以做這個工作。以『美工』來稱呼這份工作,事實上沒有什麼挑戰性,除了畫圖、做一些簡單的HTML設計,他們很難找到一個能讓他們成長的目標。

在一個系統開發團隊裡,需要有人負責系統的『視覺』設計,我不以『美工』來稱呼這份工作,是因為『美工』的定義太狹窄了。『視覺』包含你在使用這個系統看得到的種種,例如系統外觀、版面配置、顏色搭配、介面操作等,這不單只是畫幾張圖那麼簡單,要學的不僅只有美工軟體,還必須學習人機介面、視覺藝術等領域。因此,在我夢想中的團隊裡,這個職位有一個更專業的稱呼 ─『介面與視覺設計師』。

在團隊裡,『視覺設計師』必須要和『程式設計師』互相配合,『視覺設計師』負責架構整個系統外觀,而『程式設計師』則負責將系統靈魂注入到『視覺設計師』設計的驅殼裡。因此,這個職位有幾個必要的條件:

1.對HTML與CSS的熟悉

每一個WEB頁面都是由HTML所組成,徹底瞭解HTML是最基本的條件,至少W3C的HTML規範要全部看過。常用的TAG特性要熟悉,不常用的TAG,至少也要知道有它們的存在,只有徹底瞭解HTML各種特性,你才有辦法活用它們。

其次,要懂得使用CSS,對CSS的每個屬性都必須徹底瞭解,最基本的padding跟margin有什麼不同要弄懂,至少要會用DIV加CSS架構整個LAYOUT,而不是只會用TABLE。

要會用CSS設計WEB樣式,但不是單靠DW這類的軟體自動產生,一般『美工』利用DW產生的STYLE都很亂,很難維護。比較好的方式是讓STYLE與HTML完全分離,讓『程式設計師』能直接套用,這樣的好處在於將來若需要修改樣式,只需動到STYLE檔即可。

此外,對於不同瀏覽器的支援度要非常熟悉,套用任何STYLE前,都要考慮到各瀏覽器相容性的問題,盡量降低各瀏覽器瀏覽時的差異;不論使用者用的是寬螢幕還是標準螢幕、設定多少解析度、網頁放大多少比例,整個畫面都不能破裂或跑掉。

2.對介面設計的直覺

一個好的系統介面能讓使用者留下好的使用經驗,提升使用者對系統的忠誠度,但要設計出好的介面並不簡單,必須具備基本的藝術概念,以及長久對系統的操作經驗。直覺上,操作介面常和程式設計連想在一起,所以介面設計通常是『程式設計師』的工作,但『程式設計師』在美術方面通常比較弱,設計出來的介面不僅陽春,又很難與『美工』搭配樣式,因此,介面必須和視覺一起設計。

『介面與視覺設計師』必須要有介面設計的直覺,這通常必須透過經驗的累積和吸收知識來培養,因此,經驗和上進心是非常重要的。要勝任這份工作,就必須有能力設計一個讓使用者覺得便利、看起來舒適的操作環境。

3.對技術的鑽研

為了應付案子的各種需求,充實自己的能力是必須的,過去達不到的效果,隨著開發軟體與技術的進步,已經慢慢的能突破限制。過去WEB的操作介面就那幾個HTML元件,但隨著RIA概念被提出,許多技術像Silverlight,也都朝著RIA方向前進,如果你不會這些技術,你的系統永遠只侷限在舊有模式裡。1年前你用PS加DW設計WEB樣式,1年後你還是只會用PS加DW設計WEB樣式,很抱歉,你無法勝任這個工作。

4.知識管理

開發系統不但講求品質,也講求速度,許多設計其實可以互相套用,彼此互補,在程式設計裡稱為『模組化』。視覺設計也可以『模組化』,今天我需要一個三行的LAYOUT,你馬上就能把三行LAYOUT的STYLE檔給我,我只要套上去即可;今天我需要頁籤,你馬上列出幾種頁籤樣式供我選擇;我需要可愛風格,隨即就有一系列此風格的版面給我參考。

知識就是靠著不斷的累積和管理,最後成為一個團隊的資產,使這個團隊越來越壯大。