幽靈按鈕在網頁交互設計中的應用

摘 要：隨著科技信息時代的快速到來，為了提升用戶在網頁交互設計中的服務體驗，快速傳遞網頁中的有效信息，對幽靈按鈕及網頁交互設計進行了詳細分析，得到幽靈按鈕能夠使網頁交互中的信息層次分明、用戶沉浸式體驗、增加網頁視覺體驗整體性的結論。同時，在使用網頁時減輕了用戶對信息的記憶與思考壓力，快速增強用戶在網頁交互中的優越性。

關鍵詞：幽靈按鈕;網頁交互;交互設計

1 幽靈按鈕概念

網頁中的幽靈按鈕是指僅有輪廓，無填充裝飾效果，邊界清楚的扁平狀透明式按鈕，一般是白色或者黑色。按鈕所指引的內容，要表達的文字具有纖細簡潔的視覺感，使視覺效果清晰明了。這種扁平狀的透明按鈕要比傳統的可點擊的按鈕稍大，一般放在網頁界面當中突出的位置，在網頁界面中，應用的背景主要取決于周圍的對比度和環境本身，因而得名幽靈按鈕。[1]幽靈按鈕除了具備傳統按鈕的指示性作用，等待用戶發出指令，進行事件行為以及按下觸發事件，處理用戶指令行為等之外，還強調了網頁的視覺更具界面美感和交互體驗。

2 網頁交互設計

近年來，隨著計算機技術的發展和廣泛使用，“交互”一詞頻繁出現在生活的方方面面。從游戲軟件、應用程序、網頁瀏覽等與科技有關的事件中，都存在交互行為和發現它們的影子。可視化BASIC（基礎）語言之父Alan Cooper（艾倫·古柏）認為：“……交互設計首先旨在規劃和描述事物的行為方式，然后描述傳達這種行為的最有效形式。”從中我們能夠得到，交互設計的本質就是促進人與人、人與物之間的互動。而在網頁界面交互設計當中，網頁界面交互設計是人機互動，致力于提高用戶的體驗。網頁中的交互設計，不僅僅要求界面具有畫面美感，傳遞的信息清晰明了，更重要的是讓用戶有沉浸式的體驗。一個成功的網頁界面交互設計不僅能夠美化界面，還能優化其產品和服務的交互行為。而網頁界面交互設計就是要在兼顧傳遞信息和視覺體驗的同時讓信息和用戶完美地進行交流。[2]

2.1 傳遞信息

首先設計師對自己要傳遞的信息有準確定位，信息層次分明，適用于哪類網頁設計或是多類網頁設計風格。例如，在一些網站中，主要傳遞的信息是財產安全、用戶使用時理性與謹慎，因此市面上的網頁界面大都以藍色調為主，無過多干擾信息，按鈕的信息層次明了。從中在網頁設計中，按照所需傳遞的信息確定網頁設計風格，使之有明確的定位，才能夠根據要求完成交互設計，從而縮短用戶取得信息的中間路徑，提高了傳遞信息的效率。

2.2 視覺體驗

人類對于感官的依賴是人的本能，我們潛移默化地利用和開發這一本能，達到一種享受的愉悅，產生行為沖動。在網頁交互中，用戶通過鼠標點擊所得到的網頁虛擬環境的變化在這一過程引發的感官反應是真實存在的。優秀的視覺體驗是對文字的使用、色彩的應用以及界面的排版進行設計，讓用戶及時清楚操作流程。同時，減少網頁交互過程中出現的模糊信息能夠讓用戶輕松體驗交互過程，拉近用戶與網頁虛擬環境的良好關系，產生更愉悅的視覺體驗。[3]

2.3 用戶體驗

用戶體驗是指體驗人群對被實驗產品的看法與感受。[4]用戶體驗的滿意度決定著網頁交互設計是否成功。在網頁中，用戶體驗最直接的方式是通過網頁中的指引導航進行交互。在互聯網高速發展的現在，用戶的耐性有限，為了在短時間內讓用戶得到需要的信息，網頁設計要減少繁雜且干擾視覺的元素，增加簡單的具有目的性和指引性的設計元素，進而提升用戶的滿意度。

3 幽靈按鈕應用網頁交互的優越性

在網頁瀏覽中，幽靈按鈕比傳統按鈕在輔助視覺體驗整體性，引導信息層次分明，用戶沉浸式體驗方面具有較明顯的優越性。

3.1 信息層次分明

網頁中的文字與圖像屬于信息輸出層，識別后需要觸發事件和處理用戶指令時間，幽靈按鈕所具有的功能性，引導用戶視覺焦點，將圖片轉移到按鈕上，思維落點由輸出層進入反饋層，增強了網頁交互中的信息層次。網頁設計中要盡量避免理性、冷色調，而幽靈按鈕的加入使頁面層級信息更加分明。

3.2 沉浸式用戶體驗

幽靈按鈕不僅能夠用于背景圖像，在網頁中的動畫和視頻交互時也可以應用。懸浮式的布局使用戶更容易獲取動態信息，還能成為銜接視頻的元素，讓用戶沉浸在同一層級的信息環境中，保持交互的穩定性。

3.3 視覺體驗整體性

與裝飾化風格按鈕進行對比，幽靈按鈕的半透明風格，纖細字體，更能融于以大圖片為背景的網頁界面，在視覺上產生統一感與整體性。而這種整體的視覺體驗使用戶在訪問網站時不會因為繁雜的界面元素造成視覺焦點模糊和混亂。

4 結語

幽靈按鈕在網頁中的頻繁使用已成為一種流行的趨勢，被用戶所認知和接受，也是網頁交互設計中按鈕的延續和探索。本文以網頁交互設計中的幽靈按鈕為研究對象，總結幽靈按鈕在網頁交互中的優越性，不僅僅是按鈕表面上在網頁交互設計中的指引標志，更深層次使用戶與頁面直接產生交互行為。

參考文獻：

[1] 顧佳鳳，何燦群，許丹妮.交易型信息亭用戶界面中的幽靈按鈕設計[J].包裝工程，2016，37（24）：63-67.

[2] 伊卓君.以用戶體驗為中心的網頁交互設計理論探索[J].現代裝飾（理論），2011（08）：48.

[3] 宋玲.網頁交互設計的視覺體驗[D].西安美術學院，2010.

[4] 吳旭敏，王敏.基于用戶體驗的網頁交互設計研究[J].藝術教育，2017（Z7）：125-126.

作者簡介：龔俊韜（1996—），女，湖南永州人，湖南師范大學美術學院設計學專業2018級研究生在讀，研究方向：數字媒體藝術設計。