基于情感需求的醫(yī)療界面圖標(biāo)設(shè)計

摘要：界面圖標(biāo)作為設(shè)計系統(tǒng)的重要組成部分，在視覺規(guī)范性、美觀性、創(chuàng)新性上不斷受到設(shè)計師和用戶的關(guān)注。為了更好地設(shè)計醫(yī)療界面圖標(biāo)，文章從情感設(shè)計的角度出發(fā)，基于情感需求理論，通過實(shí)例論證和分析醫(yī)療界面圖標(biāo)設(shè)計存在的問題，提出了醫(yī)療界面圖標(biāo)的可識別性、統(tǒng)一性、差異性、平衡性、共情性的情感設(shè)計原則，并從圖標(biāo)風(fēng)格、圖標(biāo)色彩、圖標(biāo)功能等方面研究了情感化醫(yī)療界面圖標(biāo)設(shè)計，從而使醫(yī)療界面圖標(biāo)設(shè)計更加符合情感需求以及具備情感吸引力和美學(xué)特征。

關(guān)鍵詞：情感化設(shè)計;圖標(biāo)設(shè)計;醫(yī)療服務(wù)

中圖法分類號：TP391文獻(xiàn)標(biāo)識碼：A

Medical interface icon design based on emotional needs

LI Siyuan

（School of Computer and Information Technology，Liaoning Normal University，Dalian，Liaoning 116000，China）

Abstract：As an important part of the design system， interface icons are constantly being paid attention to by designers and users in terms of visual specification，aesthetics and innovation. In order to better design medical interface icons，from the perspective of emotional design， based on the theory of emotional needs， this paper demonstrates and analyzes the problems existing in medical interface icon design through examples， and proposes the recognizability， unity and difference of medical interface icons. Emotional design principles of balance and empathy， and researched the design of emotional medical interface icons from the aspects of icon style， icon color， icon function， etc.， so as to make medical interface icon design more in line with emotional needs， emotional appeal and aesthetics feature.

Key words： emotional design， icon design， medical service

1背景

1.1圖標(biāo)設(shè)計現(xiàn)狀

為提升醫(yī)療界面圖標(biāo)的實(shí)用性，設(shè)計人員不僅要重視功能完善、應(yīng)用方便、布局合理、雅觀大方等，還要從用戶的情感需求和使用價值角度出發(fā)，整合、優(yōu)化情感元素，使醫(yī)療界面圖標(biāo)有利于用戶在就醫(yī)或接受醫(yī)療服務(wù)時緩和焦慮情緒、減少不適感[1]。

1.2目的及意義

醫(yī)療界面圖標(biāo)有優(yōu)化和改進(jìn)的空間，須簡化界面元素及應(yīng)用流程。在醫(yī)療界面圖標(biāo)設(shè)計中需要融入情感元素，減輕用戶的認(rèn)知負(fù)擔(dān)，同時幫助老年人便捷獲取醫(yī)療信息，降低排斥感。

2情感需求

情感需求是指人們對事物在感情上的滿足和心理上的認(rèn)同。隨著經(jīng)濟(jì)蓬勃發(fā)展，人們的消費(fèi)觀念和消費(fèi)水平也在逐步變化和提高。在心理上得到滿足感及愉快感，也逐步成為人們選購產(chǎn)品的主要緣由[2]。

心理學(xué)家唐納德·諾曼（ Donald Norman）提道美和情感對設(shè)計的作用時，闡述了作為情感需求的本能、行為和反思的三個層次。我們可以將其應(yīng)用到醫(yī)療界面圖標(biāo)設(shè)計中：本能需求是生來即有的，如對安全、食品等最基礎(chǔ)的需求與渴望等。設(shè)計人員在醫(yī)療界面圖標(biāo)設(shè)計中應(yīng)該優(yōu)化用戶的視覺體驗(yàn)，注重美觀性，提高用戶注意力，使其產(chǎn)生點(diǎn)擊欲;行為需求需要后天的經(jīng)驗(yàn)積累，設(shè)計人員在設(shè)計醫(yī)療界面圖標(biāo)時應(yīng)注重布局，了解用戶的真實(shí)或隱藏需求，通過圖標(biāo)的共情性使用戶與產(chǎn)品之間產(chǎn)生情感聯(lián)系;反思需求是指用戶在使用產(chǎn)品時理性多于感性，適當(dāng)增添交互功能，讓用戶得以實(shí)踐、判辨、反思。

3圖標(biāo)設(shè)計

圖標(biāo)可以把冗繁的信息變成直白明晰的圖像，使用戶一目了然[3]。在界面中，用戶可以通過辨別圖像完成交互操作。從各種軟硬件的操作界面到實(shí)景場地的指示牌，可以說生活中處處有圖標(biāo)。在各種操作系統(tǒng)中，界面圖標(biāo)具有導(dǎo)航功能，用戶的使用感受關(guān)乎其對界面圖標(biāo)的最初印象。人們識別圖像較識別文字更加敏銳、視覺印象更加強(qiáng)烈，因此為提高產(chǎn)品使用效率，好的界面圖標(biāo)設(shè)計不可或缺（圖1）。

4情感需求設(shè)計原則

4.1可識別性

可識別性是圖標(biāo)設(shè)計的基本原則，它所象征的含義可以被確切地表達(dá)出來，便于用戶迅速了解其所表達(dá)的含義。識別信息、傳遞信息是圖標(biāo)設(shè)計的靈魂[4]。例如，界面圖標(biāo)從最初的黑色、白色及灰色到 Macintosh 公司設(shè)計出應(yīng)用在 iOS 系統(tǒng)中的第一款多色圖標(biāo)。后來，從蘋果筆記本電腦到蘋果手機(jī)，設(shè)備不斷更新和發(fā)展，由其引領(lǐng)的擬物化圖標(biāo)（圖2）成為發(fā)展歷程中的一個里程碑。它的風(fēng)格和顏色愈加豐富，但是人們發(fā)現(xiàn)，過于豐富的圖標(biāo)樣式會對用戶的辨識產(chǎn)生干擾效應(yīng)（即“視覺噪聲”），妨礙用戶對圖標(biāo)信息的獲取，從而影響識別。因此，圖標(biāo)在力求美觀的前提下，更應(yīng)在功能性、應(yīng)用性上提高可識別性。提高醫(yī)療界面圖標(biāo)的可識別性可以方便用戶理解其功能，減少誤操作，從而有效減緩用戶的焦慮情緒，緩和醫(yī)患關(guān)系。

4.2統(tǒng)一性

統(tǒng)一性指的是圖標(biāo)大小、風(fēng)格、規(guī)范特征等統(tǒng)一，以使其外觀整體協(xié)調(diào)一致。調(diào)整造型規(guī)范、圓角尺寸、線框厚度、色彩式樣等細(xì)節(jié)，使圖標(biāo)外觀協(xié)調(diào)。首先，圖標(biāo)尺寸須協(xié)調(diào)，在 iOS 系統(tǒng)上最合適點(diǎn)擊的對象面積為44×44pt，其中功能圖標(biāo)的尺寸為48px 擴(kuò)大或縮減4的倍數(shù)。Android 系統(tǒng)的功能圖標(biāo)的尺寸為48px 擴(kuò)大或縮減8的倍數(shù)。其次，風(fēng)格包括面性、線性、線面性相結(jié)合、單雙形剪影、文字性、符號性、彩色漸變、擬物化等（圖3）。為保持風(fēng)格統(tǒng)一，可適當(dāng)搭配兩種及以上風(fēng)格，若過度使用則使得用戶視覺體驗(yàn)不佳。此外，圖標(biāo)規(guī)范要統(tǒng)一。例如，圓角規(guī)范中“外圓角半徑-直線高度=內(nèi)圓角半徑”，設(shè)計時需要遵循圓角規(guī)范，有利于保持圖標(biāo)的統(tǒng)一性。當(dāng)醫(yī)療界面圖標(biāo)統(tǒng)一時，可以使用戶獲得舒適的體驗(yàn)，并留下深刻的印象。

4.3差異性

圖標(biāo)須突出其所代表的核心功能，同時圖形的外輪廓、形狀、色彩等元素應(yīng)表現(xiàn)出差異化，使用戶易于分辨且留下深刻的印象。我們應(yīng)分辨統(tǒng)一性與差異性，統(tǒng)一在于圖標(biāo)風(fēng)格、樣式、形式的統(tǒng)一，差異在于圖標(biāo)與圖標(biāo)之間含義的差異。在統(tǒng)一的圖標(biāo)下，我們應(yīng)聚焦圖標(biāo)之間的差異性（圖4），以降低圖標(biāo)之間的相似性。醫(yī)療界面圖標(biāo)的種類多、細(xì)分內(nèi)容較多，設(shè)計者應(yīng)發(fā)揮相關(guān)優(yōu)勢，提高其辯識度。

4.4平衡性

圖標(biāo)設(shè)計的平衡性包括圖標(biāo)大小及圖標(biāo)疏密。為了保持圖標(biāo)大小的平衡，不同形狀的圖標(biāo)有不同的視覺感知區(qū)域。設(shè)計時應(yīng)留有一定的面積，以進(jìn)行光學(xué)平衡調(diào)節(jié)。人眼感知并不十分精確，其看到的物體尺寸、比例和真實(shí)像素分布并不是完全相同的。圓形、菱形、三角形、非正方形等都需要增加寬度和高度，以保證其在視覺上的均衡性。實(shí)際上，正方形圖標(biāo)看上去比圓形圖標(biāo)小，即當(dāng)相同尺寸的圓形圖標(biāo)與方形圖標(biāo)并列時，正方形圖標(biāo)在眼球所識別的區(qū)域比真實(shí)面積大（圖5）。如果圖標(biāo)是不規(guī)則的，則為了保持平衡性，必須把它設(shè)計得更寬或者更高（圖6）。例如，“搜索文本框”與“發(fā)送按鈕”并列時，應(yīng)增加后者的半徑，調(diào)節(jié)光學(xué)重量，達(dá)到視覺平衡。疏密影響平衡性是指當(dāng)圖標(biāo)中內(nèi)部細(xì)節(jié)反差較大時，其重量感不均衡、視覺不和諧。因此，圖標(biāo)具有平衡性才能使用戶獲得更佳的舒適感。

4.5共情性

圖標(biāo)具有共情性，設(shè)計師在設(shè)計圖標(biāo)時需要秉持“以人為本”的設(shè)計理念，摒棄“見物不見人”的設(shè)計思想。圖標(biāo)設(shè)計始終圍繞尊重人、理解人、關(guān)心人來展開，一切以人的需求為出發(fā)點(diǎn)。例如，在醫(yī)療界面圖標(biāo)中，“發(fā)燒”圖標(biāo)可設(shè)計為生活中“熱敷毛巾”的形象，通過熱敷毛巾可了解其代表的功能（圖7）。此外，圖標(biāo)設(shè)計可用比喻形式代表其功能的含義。例如，界面亮度調(diào)節(jié)功能可比喻為小太陽，進(jìn)而設(shè)計圖標(biāo)形象。采用此方式對圖標(biāo)進(jìn)行設(shè)計具有生活氣息，使圖標(biāo)更具共情性、趣味性。為使圖標(biāo)具有共情性，設(shè)計師需站在用戶的角度觀察、感知和使用圖標(biāo)，并通過觀察法、訪談法、沉浸體驗(yàn)以及調(diào)查問卷等方式了解用戶的情感需求。

5設(shè)計應(yīng)用

5.1圖標(biāo)風(fēng)格設(shè)計

圖標(biāo)的風(fēng)格多種多樣，其在設(shè)計結(jié)構(gòu)上分為抽象性圖標(biāo)、具象性圖標(biāo)以及抽象與具象相結(jié)合的圖標(biāo)。抽象性圖標(biāo)突破了實(shí)物三維造型范疇，通過點(diǎn)、線、面元素進(jìn)行創(chuàng)意設(shè)計，圖標(biāo)形式多樣、空間感充足，可通過二維進(jìn)行圖標(biāo)設(shè)計，使視覺沖擊力增強(qiáng);具象性圖標(biāo)以實(shí)物為依據(jù)，用戶易于理解且留有深刻印象，如擬物性圖標(biāo)。與具象性圖標(biāo)相比，抽象性圖標(biāo)的局限性更小。

根據(jù)情感化需求原則，“時藥”APP 的圖標(biāo)以線性風(fēng)格為主，以面性風(fēng)格為輔助。線性圖標(biāo)纖細(xì)的線框圖形突顯出簡潔輕快的氣質(zhì)、干凈明快的風(fēng)格。使用輕量線條勾勒的圖標(biāo)的直線硬朗、曲線柔美，整體趨于精美、細(xì)膩和輕量化，帶有圓角的特點(diǎn)，飽滿柔軟且豐潤。例如，發(fā)燒、咳嗽、腸胃等圖標(biāo)采用弧線設(shè)計，使圖標(biāo)有細(xì)節(jié)而不失活力（圖8）。

5.2圖標(biāo)色彩設(shè)計

色彩在圖標(biāo)中的作用主要體現(xiàn)在方便用戶辨識操作、豐富用戶藝術(shù)審美、滿足用戶的情感需求等方面。色彩不僅豐富了圖標(biāo)的視覺效果，同時加強(qiáng)美感，有助于吸引用戶下載使用。將色彩心理學(xué)應(yīng)用于圖標(biāo)設(shè)計，基于用戶心理設(shè)計圖標(biāo)，色彩的自然表現(xiàn)力、情感特征得以在圖標(biāo)中反映出來。

5.3圖標(biāo)功能設(shè)計

基于心理學(xué)家唐納德·諾曼的“情感需求三層次”理論，對老年人醫(yī)療界面圖標(biāo)進(jìn)行設(shè)計實(shí)踐。

本能需求：選擇“醫(yī)療作為設(shè)計主題，以淺藍(lán)色和深藍(lán)色為主色，用淡粉紅點(diǎn)綴圖標(biāo)。圖標(biāo)通過線條律動，將直線與曲線相結(jié)合，使運(yùn)動、柔和、飄逸與安靜、剛強(qiáng)、質(zhì)樸相輔相成。視覺上吸引用戶注意，緩解用戶就醫(yī)時的心理焦慮。

行為需求：其圖標(biāo)是根據(jù)生命現(xiàn)象中人體所反映的狀態(tài)、行為和運(yùn)動特征而設(shè)計的。例如，“創(chuàng)傷”意味著皮膚損傷。它是根據(jù)常見的手指皮膚刮擦現(xiàn)象設(shè)計的，并增加了情感設(shè)計，血滴形象變大，在刺激視覺時，使用藍(lán)色線性圖標(biāo)來削弱紅色血滴帶來的張力。同時，其線性輕盈可以緩解焦慮;“咳嗽意為嗓子痛、感冒導(dǎo)致的癥狀，圖標(biāo)設(shè)計以嘴巴張合為基礎(chǔ)，線性半圓為非封閉圖形且留有空隙，具有呼吸感，色彩選用黃色應(yīng)用于半圓上，藍(lán)色與黃色作為對比色配合使用，以提高圖標(biāo)的辨識度，使其醒目，且直觀表達(dá)圖標(biāo)的含義。在健康的圖標(biāo)設(shè)計中，“體重圖標(biāo)以體重秤為形象，線性填充黑色，體現(xiàn)出圖標(biāo)的設(shè)計理念，裝飾點(diǎn)選用黃色，醒目且有動感，有隨指針的左右擺動趨勢，宛如貼身體重秤隨時記錄，小巧可愛不失精致，符合大眾的認(rèn)知習(xí)慣，易于理解且具有生活氣息，緊密貼合用戶日常習(xí)慣，同時提高共情性，有利于降低老年用戶的認(rèn)知難度。此外，本設(shè)計中的“發(fā)燒”“感冒”“頭暈”“食道”“泌尿”等圖標(biāo)也均按此思路進(jìn)行了情感化設(shè)計。

反思需求：兼顧不同用戶群體的使用習(xí)慣、認(rèn)知難度、審美情趣進(jìn)行設(shè)計，在交互操作上通過點(diǎn)擊可填充灰色圖標(biāo)，具有操作的成就感與樂趣感，吸引用戶積極使用（圖9）。

6結(jié)語

圖標(biāo)承載了用戶的第一印象，優(yōu)秀的圖標(biāo)設(shè)計有助于增強(qiáng)產(chǎn)品的吸引力。設(shè)計師根據(jù)情感需求在醫(yī)療界面圖標(biāo)設(shè)計中遵循差異性、統(tǒng)一性、平衡性、共情性原則，以提升用戶體驗(yàn)滿意度與信任度。同時，通過顏色的合理搭配，可以加深用戶對界面圖標(biāo)的印象，進(jìn)一步拉近產(chǎn)品與用戶的距離。

參考文獻(xiàn)：

[1]余姝姝.基于老年人認(rèn)知的應(yīng)用程序界面圖標(biāo)設(shè)計研究[D].杭州：浙江理工大，2018.

[2]趙陽.基于情感需求的 UI 界面中圖標(biāo)設(shè)計研究[ J].工業(yè)設(shè)計，2020（7）：77?78.

[3]倪帥.手機(jī)應(yīng)用軟件 icon 圖標(biāo)設(shè)計研究[ J].中國文藝家，2019（11）：103?104.

[4]鄧朝暉.用戶界面（ UI ）圖標(biāo)設(shè)計研究[ J].辦公自動化，2020，25（3）：63?64.

作者簡介：

李思遠(yuǎn)（2000—），本科，研究方向：數(shù)字媒體藝術(shù)。