基于品牌提升的APP界面設計原則

肖文婷

摘 要：移動互聯網高速發展的環境下，基于品牌APP的界面設計通過視覺、聽覺和觸覺等能給用戶帶來更直觀的互動體驗。文章結合優秀的APP界面設計案例進行分析，提出APP界面設計與品牌特色相結合，并提升品牌的設計原則。

關鍵詞：品牌提升；APP界面設計；設計原則

檢 索：www.artdesign.org.cn

中圖分類號：TB472 文獻標志碼：A 文章編號：1008-2832（2016）09-0104-03

Principles of APP Interface Design Based on the Brand Promotion

XIAO Wen-ting（Sunde Polytechnic， Foshan 528333， China）

Abstract ：The rapid development of mobile Internet environment. Interface design brand APP can give users more intuitive interaction based on experience through visual， auditory and tactile etc. This paper basing on the analysis of the excellent APP interface design case， putting forward the combination of APP interface design and brand characteristics， enhancing the design principles of the brand.

Key words ：brand promotion； APP interface design； design principles

Internet ：www.artdesign.org.cn

隨著4G網絡的成熟以及移動終端硬件技術的快速更新，移動終端設備的界面設計隨之也高速發展，并形成自己一套獨立的設計語言。據調查數據顯示，80%的智能手機用戶均下載過品牌APP，其中23.2%的用戶下載過數十個以上的品牌APP。各大品牌逐漸意識到APP的開發與運用能幫助企業品牌獲得較好的影響力，快速接觸目標消費者，甚至成為銷售產品不可缺失的營銷手段。在我國，基于品牌的APP設計還是相對新鮮的事物，其產生與發展只有幾年的時間，并未有全面針對品牌APP的VI系統設計規范，只是被歸屬到傳統企業VI系統應用中的一部分。面對APP界面設計嚴重的同質化和低競爭力等問題，基于品牌提升的APP開發與設計，將APP的界面設計與品牌的提升密切結合，即界面設計服務于品牌，并有效地強化品牌形象、增強品牌友好度、擴大品牌影響力、深入洞察與了解目標用戶等。因此，如何將APP界面的設計與品牌特色相結合，并提升品牌的設計原則包括以下四點：

一、一致性原則

APP界面設計的一致性即通過視覺結構、視覺層次、視覺元素等達到設計的統一整體，減少用戶認知成本，加深對品牌認識。設計師要自如地把控好品牌APP在眾多移動終端中的視覺效果，需要對同一設計策略從線下到線上做宏觀的統籌，處理好各個系統之間的差異，利用和發揮各平臺的優勢，讓品牌APP能在不同的終端呈現最佳效果，并形成品牌形象的完整與延續。

（一） 與系統設計指南一致

專家們在關于界面設計的書籍與著作中都強調了界面設計的一致性。因為只有統一一致的界面準則才能降低用戶的學習成本，減少學習風險，同時還能避免多樣復雜的視覺元素干擾消費者對品牌的理解。每個操作系統都會有自己官方的設計指南，設計師在進行APP應用設計與開發時，要確保設計符合操作系統的一致性。① 例如，在IOS系統人機交互指南中指出所有的IOS系統版本中默認字體是Helvetica Neue。雖說從IOS 7系統開始可以使用很多可選的字體，但繼續沿用和遵循此設計原則才不會給用戶帶來不適感。遵循用戶的使用習慣，才有利于品牌信息的推送。

（二） 視覺結構一致

Jeff Johnson在其著作《認知與設計——理解UI設計準則》中指出，信息呈現方式越是精煉和結構化，人們就越能更快和更容易地掃描到并理解它。構建清晰的視覺層次界面，能幫助和引導用戶專注于信息本身。②通常APP視覺結構主要包括狀態欄、導航欄、主菜單、內容區域等四個部分，每個部分再細分出更多的元素。在品牌APP界面設計時要注意如何合理有效地整合眾多的元素，為傳遞品牌信息服務。例如通常APP界面的主菜單習慣出現在界面頂部，因此就要遵循此原則，將其置于頂部，其他各頁面的布局不變，協調好各個控件的比例關系，避免造成視覺結構的混淆，讓用戶能在較短時間內適應APP的界面布局，捕捉品牌信息。

（三）視覺元素一致

1.品牌圖標

圖標是指帶有含義的計算機圖形，是可視化界面系統中具有交互功能的符號化視覺表現方式。品牌圖標作為提升品牌APP界面中重要的組成部分，主要包括兩種，一種是品牌APP的開啟圖標，如同PC端的軟件快捷方式；另一種是品牌APP中的界面圖標，如導航圖標、工具欄圖標、按鈕等。品牌圖標的設計是APP界面中重要的輔助和指示圖形，其視覺語言務必善用或延用企業品牌VI系統的設計規范，滿足各平臺的一致使用規范，增強用戶對品牌認知延續，提高品牌與用戶的互動效率。

首先，品牌開啟圖標。外觀上始終保持與品牌的界面設計風格一致，大多以品牌LOGO作為圖標的基礎圖形元素，以減少用戶對品牌認知的負擔，在有限的界面布局中強化品牌形象，引起用戶的注意力。其次，界面內部的功能性圖標。其視覺特征也要與品牌既有的識別系統保持一致，例如圖標線條的長短粗細、圓角弧度、視覺風格、留白空間等都應思慮周全。品牌圖標整體統一的視覺特征不僅形成APP界面設計的整體美觀效果，也反映出品牌的嚴謹性與專業性，在品牌推廣過程中可加強用戶對品牌的識別性。

2.品牌色

色彩是用戶最容易辨識的品牌元素，成功的品牌會很巧妙地運用它獨特的品牌色。不少互聯網產品品牌都有著讓人印象深刻的品牌色，如騰訊藍、雅虎紫、淘寶橘、京東紅等。無論在官方網站、移動端APP設計、相關線下衍生品都應和諧統一的運用。

基于品牌提升的APP界面設計在品牌色的運用時首先要使品牌的主色、輔助色與其他平臺的運用一致，但允許適當地根據移動端平臺的特點做細微調整。其次，各終端尺寸不同，品牌APP界面設計在品牌色的比例要達到視覺一致，顏色搭配以純的品牌色為主，三個之內的配色為輔進行搭配。簡潔干練的用色，才能在保證品牌統一性的同時，使用戶更容易地感受到品牌所營造的氛圍。

3.品牌圖與文字（案）

圖片的編排方式能無意識地讓用戶感知品牌產品，傳遞品牌意識，而文字卻是用戶獲取理性信息的重要媒介。移動端APP界面設計受限于屏幕的大小，為吸引用戶的眼球，提升品牌檔次，通常采用大尺寸配圖或整圖做背景，配合精簡的文字（案）輔助的方式。以圖片社交分享APP Pinterest的界面設計為例（圖1）。該應用最大的特點就是采用瀑布流的形式展示圖片內容，在有限的畫面中采取大尺寸的圖片為內容展示。它獨特的圖文編排方式吸引用戶不斷地發現新的內容，參與到產品的互動交流中，并且在各平臺上都能很好地體現出該品牌產品的特色。此外，APP界面設計欲為品牌提升加分，文字（案）應遵循精簡原則，必須清晰可讀，大小合適，顏色與背景色有較為明顯的對比等設計原則。

二、溝通原則

美國認知心理學家唐納德·諾曼在《情感化設計》一書中，將設計的層次劃分為三個等級，即“本能層、行為層和反思層”。本能層關注視覺外觀設計，行為層關注互動操作設計，反思層則更重視用戶體驗。③溝通原則主要指基于品牌APP的界面互動操作設計。

（一）簡化操作的過程

移動端品牌APP的操作界面設計，要考慮效率與時間的因素。滿足用戶碎片化的溝通時間，用簡潔、便利的功能操作，提高互動效率。以任務管理類APP Clear的界面操作設計為例（圖2）。無按鈕的界面設計將“簡潔”的設計理念實現得淋漓盡致，通過不同手勢幾乎完成了所有的操作命令。從圖中可以看出該APP界面的圖形設計沒有復雜的按鍵，漸變醒目的色條排列任務，區分優先級，用戶可以根據自己的喜好自由調節。簡潔的操作過程，讓用戶減少了記憶的負擔，對各界面部分自由控制，提高了APP的使用效率，實現了視覺、交互、程序與硬件的完美結合。獨特的界面設計與操作流程設計讓用戶記住了該產品，贏得了品牌的好感度。

（二）優化操作狀態的反饋

當下的APP界面操作置于觸摸屏之上，用戶沒有了按鍵的觸感，只能通過視覺和聽覺得到操作狀態的反饋。如果用戶沒有很好地被引導以及得到及時的信息反饋，將會導致用戶在與界面的交互過程中迷失方向，進而產生挫敗感。④因此基于品牌提升的APP在界面中以品牌形象大圖或產品大圖為背景，操作按鈕設有點擊前后的不同狀態，用戶能清晰地從界面上看到必須要的信息，被引導進行操作與交互。按鈕設計為當下流行的幽靈按鈕，整體視覺風格醒目簡潔。沒有復雜的色彩、樣式及紋理，線框示意輪廓，文字示意功能，具有強烈的視覺沖擊力，讓用戶能沉浸于品牌APP的交互與體驗中，優化品牌信息的傳播（圖3）。

三、用戶個性體驗原則

在產品同質化嚴重的今天，保持品牌的與眾不同才能從眾多產品中脫穎而出，展示自身特色，提升市場競爭力，體現品牌價值。移動互聯網環境下，新的傳播媒介為品牌提供了重要的媒介手段供用戶參與到APP界面體驗中。而產品交互系統中可參與性表示用戶體驗品質高低，可參與性好的系統，會使人難以忘懷，物有所值，并從中感受到使用的樂趣。⑤基于品牌提升的APP界面設計，以用戶為中心，需更深入尋求用戶的個性體驗，滿足目標用戶個性化的精神參與感、情感需求。例如，日本著名的生活品牌——MUJI（無印良品），它致力提倡和實踐著“No Brand”的品牌精神，并提倡簡約、自然的現代生活哲學理念，受到追求簡單、自然、樸實的年輕消費者喜愛。該品牌在進軍移動端APP的開發與設計時，精準定位品牌特色與應用市場類型，尋求獨特的品牌推廣方式。選擇應用排行熱門的工具類進行開發，并完美地與品牌產品特征、消費目標用戶直接關聯。例如MUJI to Relax 是無印良品的一款音樂睡眠APP（圖4）。它不同于一般的音樂APP，可以通過攝像頭檢測用戶的心跳定制專屬的白噪音功能，具有極強的互動性和趣味性。雖然是移動端的應用工具，但其創意不僅具有定制音樂的功能，還能結合MUJI品牌本身經營領域來進行產品拓展與延伸，如配合MUJI品牌的香薰燈、靠枕等使用。MUJI to Relax APP的界面采用與品牌定位一致的扁平化、簡單的設計風格，用數字化工具深入洞察了品牌受眾的消費心理。心跳制定音樂的功能，營造了情感化的使用氛圍，提升了品牌的好感度。差異化的產品體驗，切合了目標用戶個性化的情感需求，擴大了品牌領域的影響力。

四、 環境原則

品牌APP界面設計的環境原則包括兩種，一種是APP運行的系統應用環境，如ISO操作系統、Android操作系統、Windows操作系統等。另一種是用戶操作APP的場景、情景等。本文中的環境原則主要指第二種。品牌要維護與消費者之間良好的關系，給用戶帶來更好的體驗，就要注重APP與用戶對話的方式和使用的場景。用戶可能會在走路、開會、乘車、與人交談等多種情景中使用品牌APP，靈活運用移動設備硬件功能，如重力感應器、GPS、攝像頭等，提高用戶與APP參與度。良好的交互設計配合直觀達意的視覺設計，不僅較好地傳遞品牌信息，還能更好地讓用戶在體驗中提升品牌好感度。

環境原則并非每款品牌APP必須嚴格遵循的原則，但如在開發與界面設計時充分考慮到，能塑造良好的品牌特色，提升品牌競爭力。

當下的移動互聯網時代，品牌APP的開發與設計是現階段提升品牌最具競爭力和可塑性的方式。基于品牌提升的APP界面設計通過本文提出的一致性、溝通、用戶個性體驗、環境等設計原則能將APP界面設計與品牌特色相結合，并從品牌內容展示、品牌信息傳遞、目標用戶了解、品牌影響力擴大等方面提升品牌。

注釋：

① 徐曼鷺，王峰，吳棟.“淺談Ipad應用的視覺設計原則”[J].藝術與設計（理論），2015（3）：54-56.

②（美）Jeff Johnson.認知與設計—理解UI設計準則[M].張一寧 譯. 北京：人民郵電出版社，2011：36.

③ 李四達.交互設計概論[M].北京：清華大學出版社，2009：21.

④ 劉春強.視覺選擇性注意在網頁交互界面設計中的應用研究[D].無錫：江南大學，2014（21）.

⑤李世國.交互系統設計—產品設計的新視角[J].裝飾，2007（2）：12-13.