DesignWing

那些年，我們一起用的手機介面 

by DesignWing

圖片來源：getty image

不知道各位讀者人生的第一支手機是什麼型號，筆者依稀記得自己第一支購入的是MOTOROLA的單色螢幕手機，它在整個手機的歷史洪流裡絕對不是什麼劃時代或是超強功能的有名型號，但對於當時的筆者而言卻是進入現今這個數位瘋狂進化時代的重要里程碑。 

在手機剛開始因成本降低而開始大量進攻人類生活的那個年代裡(好像真的是好久以前的事了啊，茶~)，大家對於手機的要求著重在收訊強不強悍、外型好不好看、鈴聲優不優美，至於對手機介面的要求除了當時NOKIA強調的"科技始終來自於人性"的訴求以外，其實並沒有太大的討論，手機嘛~可以不用一直要拿到窗戶旁邊拜天公求收訊佳才是人生最大的幸福吧! 

但曾幾何時，除了外型材質依然是大家注目的焦點之外，在手機螢幕無論是大小或畫質的不斷進化下，手機收訊品質的重要性慢慢被螢幕裡的介面美醜與操作性給比了下去。因為隨著螢幕解析度與尺寸不斷的提升，使得介面裡圖示可以表演的舞台也跟著變大，於是大家開始在意起手機裡的圖示可不可愛、精不精巧、有沒有一些酷炫的過場動畫...等等問題。當然，介面操作的簡單與直覺性更是日後介面發展的重點主戰場。 

手機介面的石器時代

圖片來源：Google search

在螢幕還是黑白點陣的那個年代裡，選單的內容基本上都是以文字訊息的呈現為主。一來是因為當時手機的系統效能還不足以處理太複雜的圖像示介面，二來是螢幕的解析度和色彩也不足以顯示各種精美的圖示，所以選單幾乎清一色是條列式的文字選項。隨著單色面板解析度的提升，以及晶片效能的進步，介面裡開始出現了一些單純線條構成的黑白圖示(icon)，讓畫面多了一些活潑的氣氛。

那個文藝復興的年代

圖片來源：Google search

緊接著，STN彩色面板誕生了，這在當時的手機界裡可說是跟阿姆斯壯登陸月球一樣的讓人感到興奮與驚奇。因為一支可以拿在手裡放在包裡隨身攜帶的小玩意兒，當初只是個單色純樸到不行的素顏面板，現在居然像是抹上濃妝、戴上角膜放大片般的變成了一個無敵正妹，實在是太讓人感到大心了。相對於現在動不動色彩及解析度就達到視網膜等級的螢幕而言，那時的STN彩色螢幕還是有其捉襟見肘的缺陷，也就是色階還是不夠豐富到呈現完整的色彩。於是各家手機廠牌無不極盡所能的讓介面裡的圖示及底圖用艷麗到極限的方式，在螢幕的舞台裡演出彩色戲碼，為的就是讓使用者可以明確且扎實的感受到：哇!我用的是劃時代的彩色螢幕手機耶! 

而手機裡的處理晶片當然也隨著螢幕一起進化了，以往只能處理簡單文字訊息的情況也已經非昔日的吳下阿蒙，開始演出各種動態選取效果的大戲。筆者在亂買添購手機的歷史過程中也經歷了彩色面板剛上市時的那段日子，除了看見彩色選單讓眼睛覺得很充實之外，那時感受到的介面對於現在回頭來看其實好像有點太過了，因為當時的各家手機為了展現介面的新技術，無所不用其極的展現各種技巧，例如每個選單裡的選項被選取時，為了凸顯效果選取效果所以每個被選取的圖示都一定要有一段動畫，要說是為了呈現選取效果所以加強過場動畫應該也是無可厚非，但筆者曾經用過某廠牌手機"設定"的選項動態效果，是用一支板手不斷的插入手機圖示的螢幕，想要表達的是"設定"這件事的涵義，但是那個板手插螢幕的表現方式實在是有點過了頭，讓人疑惑有需要炫技到這種程度嗎? 因為整個畫面一直有物件在動，使用起來並不怎麼舒適。 

手機介面的太空時代來臨了

圖片來源：Google search

時至今日，自從iPhone上市之後，帶動了各種觸控螢幕的大量應用，此時的彩色螢幕不只是解析度已經超過以往的電腦螢幕，而達到視網膜螢幕的等級，色彩也已經進化到如Super AMOLED這種具有自發光性、廣視角、高對比規格的時代。而介面的圖示也因為各種顯示限制幾乎已經不存在，細緻的程度幾乎跟精美的印刷品無異了。 

從黑白螢幕到視網膜螢幕的顯示一路走來，介面選單的表現方式也因著這樣的改變而有所不同。在與黑白手機同時存在的Windows或Mac系統已經非常成熟的那個年代裡，也真辛苦了要在解析度這麼小且單色的畫面裡顯示這麼多供人操作的選項。但正所謂山不轉路轉，既然螢幕及處理晶片不夠力，一開始的手機選單就用最直接了當的文字敘述方式呈現，雖說這樣的畫面呈現一點也稱不上美觀，但至少想表達給使用者的操作提示也算是中規中矩的"寫給你看"了。而緊接著文字選單後出現的單色圖示，開始跟大家在電腦系統裡的圖形使用者介面經驗產生更直接的聯結，但也因為單色象素無法完整呈現物件質感的限制，當時的圖示設計為了讓使用者能一眼就辨識出功能，必須要挑戰如何用最簡單的線條，以類似中國古代象形文的方式來描繪代表此功能的物件，這種讓圖形直接"畫給你看"的方式也讓介面選單的操作變得更加直覺。利用話筒、信封、音符的簡單輪廓線來代表其真正的功能，雖然礙於單色螢幕能展現的圖像資訊有限，所以只能用類似物體剪影的方式呈現圖示的形體，但這對於行動裝置的介面可說是已經向前邁出了一大步。 

而彩色螢幕登場之後，雖說筆者到現在還是覺得當初買的那支手機裡的選單不斷的動來動去實在很惱人，但其實這也是那個時空背景下的非戰之罪。畢竟每當有了新技術，廠商為了凸顯自己產品的價值多少都會灑點狗血來引起消費者的注意。既然中央處理器可以讓圖形呈現動畫效果，那就讓選到的項目不斷的扭動來吸引注意吧！既然這是劃時代的彩色螢幕，那就讓顏色鮮豔到破表吧！這應該就是那時廠商的心理狀態我想。

但觸控螢幕普遍之後，因為觸控的操作方式與以往靠五向鍵(上下左右、直壓)來移動畫面裡的反光棒不同，選取效果也不再像上述提到早期的動來動去晃來晃去那般，而是習慣用淡淡的光暈或微微的變亮效果來呈現觸碰效果，而且為了加強使用者在滑動畫面時的回饋感，使整個畫面產生一些如翻頁、翻轉、平移等效果，讓使用者在沒有實體按鍵可以實際感覺的情況下用視覺彌補觸覺回饋的不足。

反璞歸真的介面

圖片來源：Google search

最近微軟的芒果系統炒的正火熱，稍微有接觸的讀者不難發現，芒果系統的介面似乎又回到以往單色手機的表現方式，使用大量的文字選單與單色的圖示。而Android 4.0的冰淇淋系統也將GUI的部份改的更隱性，讓資訊本身的重要性更加的凸顯。其實就是這麼一回事，當你不熟悉一件事，就需要用各種強烈的方式來加強印象，當你駕輕就熟了之後，靠最虛無的直覺也可以輕易的控制一件事。我想手機介面的發展也是這麼一回事，從純文字選單，到灑狗血的動態選單，延展到靜態且圖示精緻的觸控式選單，接著又回到色彩純粹且搭配純文字化的觸控選單，說明了手機介面已經扎扎實實的走了這麼一輪，也讓筆者相當期待下個世代的手機介面會用什麼方式呈現，說不定會有更身歷其境且大腦免運作的操作喔。

每星期我們都會發表新文章，若各位讀者覺得可以與這些文章產生共鳴，可透過下面FB及Blog的圖示分享喔。也可以加入我們的FB粉絲團，當有新文章的時候便能透過FB收到最新訊息了!