任小帆 薛澄岐

摘要：為客觀評價界面元素的布局美度，選取76個美度指標：平衡度、對稱度、整體度、簡潔度、密集度和凝聚度，分別將其量化，引入層次分析方法計算各指標的權重，提出界面元素布局方案的綜合美度計算公式方法。以Camera Connect APP的界面元素布局設計為例，驗證了該方法對于衡量界面元素布局的美度水平的客觀性與準確性，并能反映出單個評價指標對于綜合美度的影響力，有助于指導設計師對界面進行設計與改進。

關鍵詞：界面設計 層次分析法 美度指標 設計評價

中圖分類號：TB47 文獻標識碼：A

文章編號：1003 0069（2018）02-0142-02

引言

人機界面布局設計是通過對界面元素進行合理布局，使之稱為有效的信息輸入與輸出媒介。其設計的優(yōu)劣不僅影響用戶的視覺感官，更影響人機界面系統(tǒng)的工作績效。雖然影響界面設計的主要因素是用戶任務和用戶能力，但是隨著時代發(fā)展，用戶的審美和需求也在與時俱進，設計師不應局限于考慮功能的實現(xiàn)。現(xiàn)今人機界面在功能相近的背景下，如何從眾多產品中脫穎而出，產品美感度成為一個愈發(fā)重要的因素。目前尚無明確的標準來指導界面設計，也無法應用于實際的界面設計。

在美度標準的探究中，Ngo等人提出一種自下而上，可客觀地測量界面美感的方法，把界面設計特征元素與用戶視覺美感的感知相結合。該評價模型由13個測量特征組成，Ngo等人同時驗證了這些特征對于界面美感的影響程度，獲得影響程度最高的界面美感評價指標。但其特征數量過多，不便于計算；同時對于功能性質各異的界面，其美度指標之間的相對重要性也不一致，這可能對界面美感的計算結果的客觀性產生影響。

本研究提出影響界面元素布局的6個美度指標：平衡度、對稱度、整體度、簡潔度、密集度和凝聚度，將其量化，利用層次分析法獲得各指標的權重值，最終得到界面元素布局的綜合美度計算公式，為設計師進行界面設計與選擇提供指導建議。

一、界面元素布局評價量化指標

經用戶訪談和設計師聚焦，結合界面布局設計特點，同時刪去主觀抽象的詞匯，如成熟的，時尚的等，以保證評價結果的客觀性。最終獲得6個較為客觀的美度指標——平衡度、對稱度、整體度、簡潔度、密集度和凝聚度，作為評價指標進行量化。

（一）平衡度

指界面整體元素布局給用戶的視覺上的穩(wěn)定感，避免用戶因為信息布局失衡而感覺左右失衡或頭重腳輕。

三、實例驗證

（一）camera Connect APP界面元素布局的美度計算

為了驗證本研究方法準確性，選取現(xiàn)有產品界面布局——六個不同相機品牌自帶的Camera Connect APP進行綜合美度計算，（如圖1）所示。

首先對APP界面進行簡化處理，為忽略色彩對界面布局綜合美度的影響，對界面進行去色，將界面元素按功能劃分為標題欄、菜單欄、信息欄和設置欄，將功能區(qū)塊表征為最小化矩形，并通過不同顏色將界面和元素區(qū)分開，（如圖2）所示。

根據界面元素布局評價量化指標計算公式，分別計算各方案的平衡度、對稱度、整體度、簡潔度、密集度和凝聚度的值，（如表1）所示。

（二）美度計算結果比較分析

為與此計算結果對比，由81位來自不同地區(qū)和年齡段的用戶對各樣本進行投票，選出設計得最令其滿意的一款，分別得到各樣本的票數。按票數降序排列為：界面3>界面6>界面2>界面1>界面4>界面5。

比較美度公式計算結果與用戶投票結果可知，在用戶對界面的投票中，樣本界面3所獲票數遠高于其他樣本，這與其通過綜合美度計算公式所得到的分數遠高于其他樣本的情況相符；同時用戶投票得出的樣本優(yōu)劣排序與通過公式計算得出的排序結果也一致，說明該綜合美度計算方法能夠較準確地反映出用戶對界面元素布局的喜好程度。

手機APP的界面設計既要考慮人機間的交互性、可靠性，還要考慮到用戶使用過程中的快捷性和便利性，為用戶創(chuàng)造一種舒適愉悅的美的交互體驗。快捷便利的實用原則和極簡主義的審美原則是手機交互設計的基本原則，這也與通過層次分析法得到權重前三位的平衡度、對稱度、簡單度相一致。

（三）改進方案

界面3的美度計算結果與用戶投票票數在6個樣本界面中皆為最高分，可知界面3的元素布局設計較為優(yōu)秀，具有較強參考價值。通過（表1）中的界面布局單個美度指標值可得，界面3在權重較大的平衡度、對稱度與簡單度的得分皆最高，平衡度與對稱度基本接近滿分，其高度的平衡性和對稱性給用戶舒適友好的交互體驗。但界面3在整體度方面略有不足，因其三個主體元素布局部分分布較為分散，可能造成用戶在使用過程中信息獲取的疏漏，增加用戶信息查找的負荷和時間，因此對界面3進行改進，（如圖3）所示，減小三部分之間的間隙，使其分布較為緊湊，以提高用戶的使用績效，視覺效果也不再如先前零散。

結語

本研究構建了一種界面形態(tài)元素布局的綜合美度計算方法，通過六款Camera Connect APP的界面形態(tài)元素布局的案例，驗證了該方法對于評價界面美感程度的客觀性與準確性，可科學地指導界面的選擇與改進設計。但本研究工作仍有不足之處：APP的不同功能模塊對界面美感的影響沒有納入考慮，在日后將進行深入研究。