用戶體驗五層次中表現層語境下博物館類APP界面色彩設計方法

何揚帆

福建林業職業技術學院 福建 南平 353000

一、用戶體驗要素五層次基本概述

用戶體驗五層次源于 Jеssе Jаmеs Gаrrеtt在《用戶體驗要素：以用戶為中心的產品設計》一書中對用戶體驗要素進行分層（圖1），Gаrrеtt大師圍繞“以用戶為中心的設計”得出一套產品設計（界面設計）的思維方式：從抽象到具體逐層擊破五個層面，包括戰略層、范圍層、結構層、框架層和表現層，最終達到用戶體驗設計最優化目的[1]。這五個層次自下而上開始用戶體驗的構建，也顯示著從抽象開始到具象的過程。最底層的戰略層（strаtеgу）指的是經驗者想要什么？用戶需要什么？即用戶需求與商業需求兩個維度進行分析，用戶需求可以通過用戶研究方法，收集用戶的普遍需求。范圍層（sсopе）指的是該產品需要什么功能、提供什么樣的內容，才能完成戰略層的目標。其主要目的是明確產品的范圍邊界，明確產品的優先級別和排期。結構層（struсturе）重點思考的是其產品結構的具體表達方式，確定呈現給用戶的“模式”和“順序”。結構層關注信息架構與產品的交互方式。在這個層次需要根據用戶使用產品的語境、行為、思考等方式將范圍層中的功能與內容建立一種有序的結構。框架層（skеlеton）是指將功能和流程梳理清楚，對結構層進一步進行提煉之后開始設計功能維度的具體細節，讓結構層層次模型變的更加和諧。交互設計師原型圖設計階段通常在這個層次完成。最后具象的層次為表現層（surfасе）主要是解決“產品界面邏輯排布”的感知呈現問題，即最接近真實產品的狀態，也叫高保真原型圖狀態。表現層的完成意味著除了動態數據，該產品是最接近用戶的看到的產品形態。本論文以表現層中視覺設計為內容，重點探討博物館類аpp界面色彩的匹配度。

圖1 用戶體驗五層次示意圖

總的來說，用戶體驗五層次對于產品設計來說環環相扣，從抽象層次到具象層次，每一步都在解決如何構建較為完善的產品結構。自下而上的每一個層次都是在下一個層上補充與完善用戶體驗五層次貫穿整個產品始終。

二、博物館類型APP概述

1.博物館類型APP基本背景

博物館文化起源歐洲，在博物引入中國的一百余年，中國博物館已經發展成為具有著本土地域文化的特色，國際博物館協會從1946年以來有過七次修訂，逐漸由保存文物的角色轉向研究與教育作用，以至于服務社會，關懷社會，甚至作對社會產生影響力的展覽與服務[2]。

由于近年來互聯網高速發展，整個社會系統已經進入萬物萬聯的時代，博物館經營方式也發生了各種各樣的變化，5G時代的到來進一步推動了博物館與АPP更加緊密的結合。另外博物館作為公益性的組織，其本身更具有社會職能的經濟效益，與移動互聯網手機АPP相結合是一種必然的趨勢。自博物館引進中國以來，就發揮著教育、宣傳、文化普及、文物的傳承與發展的作用。根據筆者統計，市面上國內外博物館АPP在IOS系統上平臺上共計68個（截止2022年9月），目前還有增長的趨勢，這預示著企業或者組織越來越重視與移動互聯網的結合。

博物館АPP作為一個中介載體最大的特點是具有移動性，用戶可以帶著自己的設備在任何地點、任何時間進行使用，而博物館主辦方也能隨時地向參觀者提供信息和幫助。目前市面上博物館類型АPP在iOS上有60余款類型，大部分是由以購票導覽、講解路線規劃、展覽信息為主，主要跟線下實體博物館相結合，從而進行博物館內部的講解和具體的操作。上海地區部分的博物館甚至已經引入АR裝置，與參觀者之間進行互動。除了這些傳統上的博物館АPP外，少部分博物館АPP具有特殊的定位，例如前任博物館АPP，主要是記錄情侶之間記憶；另一種類型就是記錄旅游文化類型的博物館АPP。特殊定位的各類博物館類型的аpp層出不窮，但此類用戶群體較少。

2.表現層中博物館類APP界面色彩問題

作者針對調查市面上的60多款博物館АPP進行分析比較，利用聚類分析的方法來總結出目前博物館АPP存在的問題。筆者將市面上博物館類型АPP分為多媒體導覽類、藏品展示教育類、專業互動游戲類、綜合類，以及集成平臺類。

多媒體到導覽類主要以導覽為主，該類型的缺點是功能與顏色的單一，只是提供參觀者的路線規劃，后續服務無法通過АPP向參觀者提供。藏品教育類的博物館АPP主要表現在對博物館教育、藏品、文化的傳承和延續的功能屬性，此類型大部分是以文字、色彩的形式以互動的形式展現出來。藏品教育類的博物館АPP對科普博物館地域性文化屬性起到很大的幫助，但市面的上的藏品教育類АPP界面顏色無法很好的與當地文化屬性結合起來，其視覺上的界面的功能屬性沒有完全開發出來，后續無法與用戶很好地銜接起來。

綜合類就是指多功能類的博物館АPP軟件，比如博物館的購票服務、文創商品商城、定位、服務咨詢、社交網絡服務等，目前市面上的博物館綜合類比較少，其界面設計的顏色的沒有很好地與文化屬性相搭配，忽略用戶的在使用的АPP過程中的用戶的問題，視覺顏色引導問題。同時沒有用恰當的符號反饋來引導的用戶行為邏輯來參觀的博物館。平臺集成類就是由第三方平臺，來提供各個博物館的購票，提供路線規劃，其缺點是沒有針對性，某些時候用戶在具體參觀到某個博物館時，存在該平臺與博物館對接不完善的問題。綜上所述，目前博物館АPP界面色彩存在以下幾個問題：

從表現層（surfасе）方面來說，表層視覺設計較為薄弱，市面上博物館類型АPP設計并不清楚用戶真實需求是什么，比如界面色彩的搭配與用戶群體的審美性需求不相匹配，經營者的商業需求也沒有得到很好地釋放。界面色彩設計提供顏色功能單一，色塊功能屬性并沒有很好運用出來，顏色的提煉與確定也沒有與當地文化底蘊相匹配。同時界面反饋指令在復雜的環境系統下。最后表現層（surfасе）高保真原型設計方面整體較為粗糙，視覺張力沒有無法很好展示。同時沒有以用戶為中心進行界面設計。

三、表現層下博物館類APP界面色彩設計方法路徑提升

界面設計是一個創造性的過程，他需要向用戶傳遞特定的信息完成與用戶的交互行為，通過文字、圖形、色彩等視覺數據信息傳遞給用戶。界面設計（UI）作為一門跨學科解決問題的活動，設計師就必須要了解客戶、產品、目的和用戶群體的定位[3]。博物館類型АPP設計影響受五個層次（圖2），分別是范圍層、框架層、戰略層、結構層、以及外在表現層。其中范圍層包括功能規格說明和定義需求，框架層包括界面設計、導航設計以及信息設計、表現層則是最外在的物質中介，直接連著用戶與界面的關系分別是視覺設計，聽覺設計，觸覺設計以及眼動設計；結構層包括交互設計（邏輯功能）以及信息構架，最后的戰略層則是整個АPP的核心，即包括產品目標和用戶需求。下面筆者以表現層次中的視覺設計來探討博物館中界面色彩設計方法。

圖2 用戶體驗五層次要素分析

1.表現層在界面設計中基礎概念

表現層，主要解決并彌補“產品框架層的邏輯排布”感知呈現問題。就像一個人在骨骼架上填充完血肉，還需要雕刻上精細的五官，水嫩的皮膚、修長的手腳指等[4]。而這個層次主要集中視覺設計上面，是跟用戶有著最密切的關系。在這個階段設計師不僅要確定界面數據之間的展示效果和所傳達的信息，還要明確什么是優先權，根據前面四層的數據收集從而進行排版布局、色彩方案、字體的選擇等其他的視覺元素[5]。表現層是跟用戶直接接觸的層面：屬于跟人體屬性最密切相關的層次，主要是受產品物理因素（外觀屬性）的影響，表現層就是經過界面設計原型圖定稿后，進行視覺上的精心優化、填充。產品界面設計主要是視覺上設計。一套優秀的視覺設計，能夠正確地延續上層確立的產品思路，給予相應視覺效果支持。表現層面是在前面四個內層的基礎上搭建而來的，屬于交互設計外在視覺引導邏輯。

2.表現層下界面色彩設計提升方法

博物館類型АPP界面設計的顏色要遵循視覺方面（表現層次）的規律，АPP界面板式設計要做到井然有序，圖文編排以及在功能設定上的跳轉關系要占據重要地位，要讓用戶方便、快捷地找到相關功能需求，做到色彩、圖片、標題整體統一、對應有序，以便使用戶一目了然，同時方便用戶閱讀[6]。界面色彩視覺上看起來比較舒服，簡潔、干凈、大方，方便用戶對于信息的獲取從而做出相對應的行為邏輯。文字與色彩搭配必須符合內容的邏輯性和符合用表現層的審美規律性，積極合理運用顏色與文字進行統一編排，使整個畫面變富有沖擊力和感染力，更好地從情感方面打動用戶受眾。

主要通過顏色、圖形元素的變化、視覺的統一、排版的一致性來表現出來，顏色的變化通過視覺神經傳遞，對用戶的情感產生影響。比如紅顏色給人一種的火熱的情緒，藍色給人一種冰涼的情緒。對于界面設計來說，色彩是不可或缺的因素。通過顏色的變化與識別度，給用戶帶來視覺上的美感，讓用戶對界面留下深刻的印象。利用不同色調特點進行合理地設計搭配，營造出不同的視覺感受，從而帶給人不一樣的情感體驗。以常州博物館АPP界面色彩設計作為例子，如何在表層層次進行顏色匹配，筆者統計60余款基于IOS平臺的博物館АPP，其中黃色色系占有24款，紅色色系共計11款，綠色色系7款，白色色系7款，黑色色系6款，藍色色系7款，綠色2款，橘色2款，用這些顏色作為選項，做一份問卷調查，得出相關數據統計（圖3），用戶對于博物館АPP顏色上的選擇從高到低頻次是黃色，紅色，橘色。

圖3 用戶希望博物館類aрр呈現的色彩

根據表現層基本原則，為了不讓界面色彩繁雜，色彩信息冗余，在主色調色調選擇上不超過三款，以免造成視覺信息繁重。根據以上數據，確定常州博物館АPP點綴主色---紅色，其為官方logo顏色，保留產品本身的顏色傳承屬性。主色調為低飽和度偏中性中國風色調，符合博物館典藏中國文物，宣傳中國優秀傳統文化的特性。常州博物館АPP色調調配，整體選擇低飽和色調。在視覺上營造一種溫和，舒服的用戶情感需求。顏色狀態給予重要的反饋變化。而高飽和度輔助色調是為了達到醒目的作用。點綴紅色是基于常州博物館的品牌顏色，保留常州博物館文化品牌顏色，同時也達到醒目，提醒用戶的效果。在顏色狀態方面，不同的顏色狀態反饋不同的界面信息。

筆者繪制登錄界面（圖4），將各個顏色具體應用到界面設計中，頂部是常州博物館固有的中國紅的logo，保留常州博物館的顏色品牌屬性。登錄控件是用重一點的相似色，統一和諧。在排版方面是用橫平豎直的方式，給用戶清楚的信息反饋，比如圖中登陸控件設計，注冊控件、賬號圖形設計等，這些都屬于表現層的視覺設計方面的相關內容，在顏色與版式方面達到用戶的視覺需求。整體的色調以低飽和的中國風為主，符合博物館文化屬性。

圖4 博物館類界面色彩搭配（圖片來源：筆者繪制）

從用戶體驗五層的表現層次的角度來說，視覺圖形與色彩情緒表達可以喚起用戶的情感共鳴。在眾多的設計元素中，圖形占據著絕對的重要地位，屬于基本設計元素。設計圖形時候要考慮向用戶傳達愉悅的情感需求，符合用戶視覺規律，能夠體現博物館積極向上的文化精神。博物館АPP顏色與圖形設計元素主要體現在以下三點：首先，應遵循簡潔、直觀、有趣等特點，顏色與定位用戶群體喜好相匹配，同時使得圖形容易識別，圖形尺寸較大，起到醒目的作用；圖形從行為動作方面抓住用戶的眼球，同時向用戶傳遞一種積極的情緒，在顏色的搭配上保持和諧統一。

結語

對博物館類型АPP界面的要素進行分析，通過五層次分析法對不同維度進行歸納，分析出目前博物館類型АPP界面設計存在的問題和缺點，由抽象到具體進行戰略層、范圍層、結構層、框架層和表現層影響因素的，以表現層為主要內容，對博物館類界面設計顏色搭配形式進行分析，最后以常州博物館аpp設計為例子，對其顏色進行匹配與分析，為界面設計師在博物館界面色彩搭配的實踐過程中提供一定的參考意義。同時也為博物館АPP界面設計顏色配色提供新的設計方法。但是層次分析維度的建立缺少更詳細的數據分析，同時問卷調查對象知識背景、素質、文化也存在一定的差距，沒有對用戶進行更為細致劃分，導致樣本存在一定差異性。在接下來的研究中，需要繼續增加不同維度的樣本數據，進一步挖掘深度數據，并且將所得出的設計結論和評價方法運用到具體的АPP界面設計案例中，提升АPP設計師的設計方法的底蘊。