跳到主要內容區塊

已轉型的網頁設計流程

已轉型的網頁設計流程

在十幾年前,甚至更早以前,我們只需要一個設計或美工幫我們把網站畫出來,接著用Photoshop切片工具,或是Dreamweaver用table表格來做排列組合,經過三到五天的努力與翻了一堆adobe相關書籍之後,網站就會誕生了,唯一的門檻可能就是買電腦、買軟體還有買那一堆工具書了,畢竟那時候的Google並沒有現在這麼好用,所以要靠Google自學,還是有點難度在的,而這時候的瀏覽器,最新、最好的版本,不用思考,肯定是IE6,這時候的CSS,不但還在第二代,而且連CSS

Resets的概念都沒有。

在過個幾年IE7出現了,但是因為眾多的bug與規劃不完全,IE7的存在非常的短暫,然後IE8就來了,當時網頁設計師最常說的大概就是“萬惡的IE”,眾多高手甚至紛紛希望IE6趕快進入墳場,不要再出現了,而微軟也在無奈與眾多抗議聲中停止維護IE6,但是可惜的是,IE6真正死去的時候,IE9卻早已出現多時。

在IE版本開始混亂後,Firefox、Chrome、Safari等眾多瀏覽器都開始搶食瀏覽器市場,也差不多在這個時期CSS Resets的概念開始出現了。CSS Resets其實是一隻CSS檔案,主要的功能在於將各個瀏覽器對CSS的預設值都做一個統一,這樣在製作網站的過程中才不需要寫一堆奇奇怪怪的CSS或javascript,只為了某些瀏覽器不聽話。這樣的行動我們專注了好幾年,才漸漸開始發現,其實我們該改變的不只是這裡,而是從設計開始。

早期網頁設計非常喜歡擬物化,比方說把網頁設計成一本書或一本雜誌,希望可以有翻閱效果或是網頁會飄雪、飄櫻花等等,覺得將生活中一些看起來很有設計感、很美的意境帶入網站中,但是卻忽略了這樣的設計一點都不實用,常常造成網友在瀏覽網站時覺得障礙十足,正當大家都在納悶這麼有意境的網站怎麼沒人看的時候,我們開始會分析網站,了解網站跳出率,將網站各種行為數據化,漸漸的,我們才意識到連椅子這種每天都要坐到的東西,我們都在講求人體工學,但偏偏網站我們卻忽略了,於是屬於網站的人體工學就開始誕生了,這就是所謂的使用者體驗。

再早個幾年,我們將使用者體驗用在已經完成的網站上,我們會去做數據的量化測試,追蹤網友的動向,甚至邀請網友到現場做測試,而測試內容是透過網友的發聲思考,讓我們親眼證實網友在逛網站時,他們的想法是什麼,透過數位網友的測試、統計,我們就可以得出這個網站的問題點,並透過分析結果去做改善。若是明確的錯誤,就會做立即的改善,但是若是不明確地錯誤,我們就會做所謂的A/B

Test,採用兩版不一樣的畫面,導入差不多的網友數量,在透過分析網友的行為數據獲得最終的結果,就這樣保持了幾年之後,似乎開始覺得好像哪裡有問題?

所以問題在哪裡?我們換個角度來思考好了,假設你是木工,你正要做一張椅子,這張椅子你必須思考人體工學,怎麼坐才會舒適,舒適的椅子才會賣得好,非常的單純對吧?至少可以確定不舒適的椅子銷售一定會比較難,所以當你在開始做椅子的時候,你就會思考椅背的角度、椅腳高低,甚至考慮到坐的人的平均身高,最後的最後當然就是你做出了一張符合人體工學舒適的椅子。所以呢?如果換成做網站為什麼一開始我們就忽略了人體工學?很多人都會覺得我今天要做網站,我也是這個網站的使用者,所以我覺得這個網站應該要如此如此、這般這般,這樣才是對的。但是問題是你真的是這個網站的中心使用者嗎?很多時候都不是,也許你是重度使用者,但是你並不是透過你自身的需要才一直在看這個網站,你只是因為你的職責所在,所以才變成這個網站的重度使用者,但是真正的網站中心使用者需要什麼呢?

1.專案:聆聽客戶需求

2.企劃:架構網站動線與整理網站所需資料

3.設計:透過企劃內容來發想,做出可行的動線設計

4.前端:將靜態設計製作成網頁,可先行體驗網站大概的模樣

5.後端:將前端製作出來的頁面程式化,例如最新消息可以上稿、聯絡我們可以留言送出表單

6.測試上線:通常會是企劃或專案甚至整個團隊的人在做這件事。這在裡我們會找到bug,將bug修復後就可以上線運行

這樣的一個流程是一個普通的網站製作該有的規模,而企劃這個職位在不同的公司會有不同的職稱,甚至可能消失,比方說在行銷公司企劃這個職稱就會變成創意,所以創意就會在網站上加上天馬行空的效果等待著前端執行,但是通常大部分都會被打槍,尤其是創意不懂網站製作的時候,更是會被打槍連連。而設計公司會覺得企劃這個位置可有可無,因為企劃如果不懂網站,那企劃整理出來的資料也沒有什麼實際效用,還不如設計自己整理,效率搞不好還更快,於是設計就開始兼任企劃的工作。如果是公司人數不多的情況下,這也許是件好事,因為使用者體驗是需要被設計的,但是如果設計只顧著畫面好壞而不去思考動線或者網友會獲得怎樣的體驗,那這樣的設計如果還要兼整理資料,相對來說就是降低設計本身的品質,並且無法兼顧使用者體驗,最終設計出來的網站就很可能不符合使用者體驗,導致網站的成效不彰。如果這樣的情況又是專案本身兼職企劃又兼職設計,那可能就會導致令人錯愕的結果,這樣的網站當然就毫無可用的價值。

在了解一般網站的製作流程後,我們回到了解中心使用者需求這件事,我們該如何調整我們的網站製作流程才能讓網站符合中心使用者需求,並且達到正確的效益?答案很簡單,我們把企劃這個職位換成經驗設計師,所謂的經驗設計師除了要了解客戶的需求之外,還要協助客戶找出中心使用者,並且將使用者體驗徹底融入企劃過程,並確保視覺設計師在設計的過程中,有貼近中心使用者的需求,對於以往我們覺得不重要的網站企劃,其實往往才是優質網站建置的關鍵,近年來台灣有許多公司開始在專案流程中納入了經驗設計師這樣的職位,而經驗設計師也可以確保網站從開始到結束都像之前做椅子一樣,從頭到尾符合人體工學,這樣的網站,肯定會比以往製作出來的網站成效更好,讓網站更有意義。

作者:Nowill(張芳瑩) 品禾全端網路工作室策略總監