引言
任月月:據調查,中國人口老齡化程度在全球已處于中上水平。2022 年《政府工作報告》提出:“積極應對人口老齡化,優化城鄉養老服務供給,推動老齡事業和產業高質量發展”。應對人口老齡化已上升為國家戰略。
其實早在 2020 年 11 月國務院辦公廳就印發了《關于切實解決老年人運用智能技術困難的實施方案》。2021 年 4 月工業和信息化部辦公廳發布了《關于進一步抓好互聯網應用適老化及無障礙改造專項行動實施工作的通知》。該通知針對互聯網網站、移動互聯網應用(APP)制定了改造標準規范。
目前很多頭部大廠都已經按照要求完成了應用的適老化改造,并且分享了很多改造經驗。可以說,適老化是今后應用發展的一個大趨勢。筆者最近的工作也涉及到了相關改造設計,所以針對這個主題,做了一些學習探索。看了各類文章,結合 N 家銀行 APP 的適老化設計場景體驗和自己項目實踐的思考,在這里與大家分享。希望可以給到大家一些啟發。
最新的銀發族研究報告:
1. 適老化設計的定義
百度百科上是這么定義的,適老化設計是指在住宅中,或在商場、醫院、學校等公共建筑中充分考慮到老年人的身體機能及行動特點做出相應的設計,包括實現無障礙設計,引入急救系統等,以滿足已經進入老年生活或以后將進入老年生活的人群的生活及出行需求。
互聯網時代,我們的應用在設計的過程中,同樣也需要考慮老年用戶的特征與需求。移動互聯網的發展給我們帶來了巨大的便利,特別是在疫情時期,很多事情實現了線上辦理。但與此同時,也暴露出了很多問題,很多老年人被豐富的互聯網世界拒之門外,比如不會使用健康碼出行受阻、不會線上轉賬仍需跑銀行辦理業務、不會線上掛號只能線下排隊等等。大家可以想想,自己身邊的長輩是不是經常會出現上述類似的問題。我們在“嘲笑”他們落伍的時候,更應當反思,這個社會有沒有為他們考慮。作為設計師,能夠為他們做些什么?
2. 無障礙設計
無障礙設計常與適老化設計一起出現,無障礙設計不止適老化設計,是針對所有人的設計,要包容所有人。可以說是一種通用性、包容性設計。
通用性設計:強調設計所有的系統和產品,使每個人都能使用,無論他們的年齡或能力。
包容性設計:好的設計應該滿足盡可能多的使用者的需求。
例如:蘋果系統的設計,他貼心的考慮到了行動、視力、聽力和認知障礙人士的各類需求,并為其設計,讓他們也能輕松的使用蘋果的產品。
在研究適老化設計的過程中,我發現一些適老化設計的規則和無障礙設計有著互通點。可以說適老化其實是信息無障礙的一部分,而信息無障礙的一些設計手法可以解決適老化中的部分問題。所以在此簡單的聊一聊兩者的關系,以更好的輔助大家對后文的理解。
1. 用戶群體
人口老齡化已成為全球普遍現象,但中國人口老齡化規模大、程度深、速度快。
據局部抽查統計概算,全國 45 歲人口比例已達到 38%,如果按此比例計算,全國 45 歲以上人口數量已達 5.09 億。另外,根據中國互聯網絡信息中心(cnnic)在京發布第 49 次《中國互聯網絡發展狀況統計報告》顯示,截至 2021 年 12 月,我國 60 歲及以上老年網民規模達 1.19 億,互聯網普及率達 43.2%。
個人認為,互聯網的適老化設計除了對 60 歲及以上老年網民友好,對于 50 歲左右的銀發人群也同樣有益。所以在這里,我將用戶群體拓寬到了 50 歲及以上的銀發人群。
小說明:根據觀察身邊的年長用戶,50 出頭其實就已經存在看不清、搞不懂、不敢用、不會用等問題了,而且他們非常喜歡適老版本,也會主動要求幫忙把各類 app 調整成適老版本。所以在這里將用戶群體進行了拓寬。
根據 QuestMobile 數據顯示,2022 年 8 月,銀發用戶月活躍用戶規模達 2.97 億,同比增長 12.5%,月人均使用時長 121.6 小時,同比增長 8.6%,增速明顯高于全網平均水平。
而且,國家在不斷地向老年群體普及互聯網,對于金融產品,銀發人群具有很大的消費潛力,具有“有錢有閑”的市場優勢。
那么面對如此龐大且不斷增長的用戶群體,我們的設計勢必要為其考慮,才能更通用。
2. 人文關懷
老年人等弱勢群體,從生活到日常娛樂,他們對于產品的體驗會和我們存在一定的差異。隨著年齡的增長,老年用戶會出現視力、聽力、觸覺、認知理解等能力的下降。且在心理上會對新鮮事物有一定的恐懼和抗拒,容易出現情緒挫敗。一旦使用受阻,便會感到無助和沮喪,不愿意繼續使用。
另外,互聯網信息的繁雜、經常出現的網絡詐騙案例,也給老年用戶帶來了不安全感。他們會因為擔心,不小心點了不該點擊的鏈接,造成自己的資金損失。在工業和信息化部辦公廳發布的適老化標準中也指出在適老化界面中需要保證產品的安全性,限制廣告插件及誘導類按鍵。
為了給老年用戶帶去更好、更安全的產品體驗,讓他們跟上時代的步伐,我們的設計應當為其考慮。為他們,也是為未來的我們。
3. 不止為老年人
雖說適老化設計,只是無障礙設計的一部分,但是我們的設計,最終有可能所有人都會受益。
在某些特定的情況下,所有人都可能是“老年人”或“殘疾人”
提到“老年人”或“殘疾人”,我們會想到以下幾種場景:
- 視覺障礙:看不清、失明
- 聽覺障礙:聽不清、耳聾
- 行動障礙:坐著輪椅
- 認知障礙:不理解內容的含義
對于以上幾種場景,是只有“老年人”或“殘疾人”才會碰到嗎?當然不是。在某些情況下,我們也會碰到。這里就要提到一個概念:“情境性障礙(Situational Limitation)”,是指我們任何一個人,都會在某個場景下出現臨時性的障礙。
比如在一些銀行服務中,情境性障礙的場景案例有:
- 視覺障礙:在戶外場景,我們使用手機銀行,可能會出現文字看不清的情況;
- 聽覺障礙:在嘈雜環境中,我們會聽不清一些語音播報;
- 行動障礙:手上提著東西,想使用手機銀行進行線下付款,可能會誤點到別的功能上去;
- 認知障礙:銀行新上線了一個功能,我們之前從來沒有碰到過,會出現短暫的認知障礙。
也許我們設計的初衷是為老年人進行無障礙設計,但其實在很多時候,因為外部環境,我們也會出現短暫的情境性障礙,所以為他們設計,也是為我們自己設計。
4. 銀行用戶需求
網上銀行 app 行業近年來收獲了大量的用戶增長,于此同時,也出現了各類聲音,這些聲音反應了用戶的各類需求。據統計網上銀行 APP,41 歲及以上用戶僅占比 12.8%。對于年長網銀 APP 用戶對保險服務的需求更高,同時也更為偏好風險較高的股票交易。雖然現階段他們在銀行金融業的滲透率較低,但是隨著更多的老年用戶接觸互聯網金融,預計活躍滲透率將會進一步提升。
對于這群如此有消費潛力的用戶,現實中,有很大一部分老年用戶對網上銀行服務存在不了解、不敢用、不會用等痛點。
場景小故事:以下案例來自身邊長輩
① 銀行卡辦理與認證
場景:銀行很多業務已實現半自動化,需要手機配合操作完成業務。
問題:辛辛苦苦跑一趟銀行,但因手機使用不熟練,不知道怎么操作,銀行員工又忙沒能詳細指導(代勞),導致業務無法順利辦理,只能第二天再跑一趟。
② 線上轉賬
場景:從柜面轉賬到 ATM 機轉賬,再到現在的手機轉賬,完全不同的轉賬方式,接受起來很慢,操作不熟練,不敢放心使用。
問題:年長用戶,對于網絡陌生,內心保持不信任。寧愿跑銀行也不敢、不會在手機銀行進行轉賬操作,或者就讓子女代勞,完全沒有享受到互聯網帶來的便捷。
根據網易 UEDC 調研,老年群體手機銀行操作體驗痛點和對手機銀行的期望如下:
如何將這群用戶服務好,是當下很多網上銀行 app 需要思考的問題。
另外,在很多行業中,中老年人因為擁有豐富的經驗在崗位上會更具優勢,對于企業銀行用戶來講,處于關鍵角色的用戶例如財務,工作年限長、經驗足是優勢。那么企業銀行面向企業的設計,如何提升中老年用戶的使用體驗也同樣值得考慮。
想要更好地為老年用戶做設計,我們就需要詳細了解老年用戶的特征與需求。從前文的使用現狀中,我們可以將老年用戶的需求分為生理需求和服務需求。
生理需求:看不清、難操作、怕出錯(容易挫敗)、不理解、聽不清
服務需求:不了解、找不到、不會用、不敢用
這兩類需求的來源還要從老年用戶的特征入手去解析。
1. 老年用戶之困——視覺障礙
隨著年齡的增長,老年用戶視覺的敏感度、明暗感覺、空間感、色彩感都會有所下降。而且老年用戶患有眼部疾病的概率會有所增加。60 歲以上的老年人中,視覺器官老化導致視力減退者為 47.9%,其中絕大多數是遠視。
常見的問題有:字小看不清、感覺字的顏色淡看不清、難以識別藍紫色為代表的冷色調顏色、動態視覺感知弱等。
2. 老年用戶之困——聽覺障礙
根據聽力學的研究,男性約從 45 歲以后開始出現聽力衰退,女性稍晚,隨著人類壽命的延長,老齡人口的增多,老年人耳聾的發病率也有所增加。
常見的問題有:聽不到、聽不清、覺得語速過快等。
3. 老年用戶之困——行動障礙
老年人的行動以及各項操作會隨著年齡的增長而變得緩慢、不協調。而且老年人的手指會偏大,細胞水分減少,皮膚皺紋加深,會使得觸屏靈敏度大大降低。動作精準度的下降使得老年人無法準確的完成手勢操作。
常見的問題有:不會復雜的手勢操作、容易誤觸、點擊困難、無法長時間連續操作等。
4. 老年用戶之困——認知障礙
人的認知能力也會隨著年齡的增長而下降。老年人會出現反應慢、判斷力下降、學習能力退化的情況。在這種情況下,老年用戶接觸互聯網的心理障礙就更加劇了。
常見的問題有:難接受新應用、難分辨信息真偽、不理解圖標/圖片的意思、容易挫敗更容易接受熟悉的東西等。
針對以上老年用戶的需求,銀行金融產品的適老化設計應當如何入手。接下來我們結合《移動互聯網應用(APP)適老化通用設計規范》中的內容(以下簡稱《規范》)和現有的各類產品適老化設計現狀一起學習下如何進行適老化設計。
《規范》適用范圍為:各企業在提供適老化服務時的內嵌適老版界面、單獨的適老版 APP。
主要包括 5 大點技術要求:可感知性、可操作性、可理解性、兼容性以及安全性。
1. 適老版入口設計
① 內嵌適老版界面
企業將適老版界面內嵌在原先的 APP 中,提供入口供用戶切換。這種方案目前市面上使用較多,入口通常放置在設置中。對于銀行金融產品,經調研,不少都遵循 all in mobile 的設計理念,要求根據不同的場景可以快速隨時切換,所以除了設置中,還會在其他位置放置切換入口,方便用戶切換。
常見切換入口名稱
工商銀行:幸福生活版;中國銀行:歲月長情版;光大銀行:簡愛版;甘肅銀行:頤年版;支付寶:長輩模式;招商銀行/網商銀行:長輩版;中國農業銀行/平安口袋銀行:大字版;寧波銀行/云閃付:關愛版等等
對于切換入口的名稱,每款應用都有自己的特色,整體來看,大字、長輩版是使用頻次最高的,通俗易懂,其他類型的名稱雖然有特色,但是與其他應用不同,不符合用戶通用認知,在一定程度上會給年長用戶造成理解障礙。
常見切換入口位置
對于內嵌版本的切換入口通常有以下三種:
- 一級頁面頂部的“版本切換”按鈕
- 一級頁面下拉加號內的“版本切換”
- 我的頁面-設置-“版本切換”
這三種形式根據應用的功能層級,開啟適老模式需要進行 1~3 次點擊,常見點擊路徑如下:
- 「首頁」—版本切換圖標—「適老版」
- 「首頁」—版本切換圖標—「版本選擇」—點擊選中—「適老版」
- 「首頁」—加下拉—版本切換圖標—「適老版」
- 「首頁」—加下拉—版本切換圖標—「版本選擇」—點擊選中—「適老版」
- 「個人中心」—設置按鈕—「設置」—版本切換—「適老版」
- 「個人中心」—設置按鈕—「設置」—版本切換—「介紹頁」—開啟確認—「適老版」
- 「個人中心」—設置按鈕—「設置」—版本切換—「版本選擇」—點擊選中—「適老版」
特色切換過渡頁面設計
中國農業銀行:設置頁面直接外置各種版本,直觀且豐富了設置頁面
工商銀行:在版本切換頁面詳細介紹了各個版本的特色
支付寶:獨立頁面介紹適老版
對于開啟適老模式,是否需要設置過渡頁面,個人認為需要,因為具有圖文介紹的過渡頁面,雖然在一定程度增長了用戶切換路徑,但是給了用戶切換的心里預期。而且對于模式的切換一般是低頻操作,適當給用戶一些“阻力”可以避免誤操作。
② 單獨的適老版 APP
企業也可以根據自身情況選擇開發單獨的適老版 APP,目前市面上以酷狗、UC、百度地圖/新聞、騰訊地圖/新聞、新浪微博等為代表開發了單獨的適老版 APP。用戶在應用商店搜索“大字版”“關懷版”等關鍵詞即可下載。(目前暫無銀行金融產品上線單獨適老版的 APP)
經體驗,一般開發了單獨的適老版 APP,在普通版本 APP 中便不會設置大字版切換模式,僅提供字號設置功能和下載適老版 APP 引導頁。
2. 可感知性
該技術要求主要解決老年用戶的視覺障礙、聽覺障礙及認知障礙。規范如下:
① 字型大小調整
文字的類型
根據調研,同樣文字大小的情況下,非襯線體比襯線體結構更加清晰。所以《規范》中建議使用非襯線體,以減少不必要的視覺干擾,保證易讀性。另外采用可以提高字重方法,使文本輪廓更加清晰。
中文字體例如思源黑體、微軟雅黑等都是比較厚重的,不建議使用宋體、楷體等襯線體。
英文字體,特別是對于數據的展示,為了讓數據更醒目直觀,可以選擇非襯線類厚重的字體。例如:我們部門為了在設計中更好的展示數據信息,提取常用字符設計了非襯線類的“兆日金融體”。
文字的大小
《規范》中建議適老版界面及單獨的適老版 APP 中的主要文字信息不小于 18 dp/pt。Ant Design 設計語言中講到關于計算最小字體的方法,基于年長用戶閱讀距離(43 cm)以及最佳閱讀角度(0.75)計算并換算得到建議最小字號為 16dp/pt。那么我們到底按照哪個規范來呢?
筆者覺得,這兩個規范沒有對錯,大家根據自己頁面設計或適配的情況來確定就可以了。對于年長用戶來講,不同的人視覺感官度也不一樣,我們在設計允許、布局整潔的限度下,字體肯定是越大越好。例如下圖是我在做適老版過程中制定的縮放系數規范,為了保證部分復雜頁面布局不錯亂,將主要文字最小字號定義為 16dp/pt。
當然以上的規范不一定可以適合所有人,畢竟隨著用戶的年齡增長,視覺障礙會加深。我們還可以更加人性化一點,比如讓用戶在大字模式下可以繼續根據需求調節字號大小、聽文字消息。例如:iOS 系統中在輔助功能里可以設置更大字體、粗體文本(《規范》建議應用字型大小可隨系統設置調整,或內部具備字體大小設置選項);微信可以開啟聽文字消息。
文字的適配規則
針對文字放大后,極值情況下的適配,主要有省略和換行兩種方式,需避免文本、元素被剪裁。
界面元素及容器需要跟隨文字放大而等比例系數放大
同一容器內的元素橫向間距保持固定,縱向間距可按照比例系數適配
② 行間距
《規范》建議段落內文字的行距至少為 1.3 倍,且段落間距至少比行距大 1.3 倍,同時兼顧移動應用適用場景和顯示效果。
根據調研測試:標題行間距為 1.3 倍,文字行間距為 1.5-1.8 倍,視覺效果最舒適。數值僅供參考,具體大家還要融合自己的設計去確定。
③ 對比度
為了解決年長用戶因為文字、圖像顏色淡而看不清的問題,在設計的過程中我們需要使用強對比度的顏色。《規范》建議文本/文本圖像呈現方式、圖標等元素間的對比度至少為 4.5:1(字號大于 18 dp/pt 時文本及文本圖像對比度至少為 3:1)。
這一標準源自 WCAG 標準,其中的顏色對比度的無障礙標準包括比度最低標準(AA 級)和對比度增強標準(AAA 級)。
- 對比度(AA 級):文本的視覺呈現以及文本圖像至少 7:1 的對比度;大號文本(字重為 Bold 時大于 18px,字重為 Regular 時大于 24px)以及大文本圖像至少有 4.5:1 的對比度。
- 對比度(AAA 級):文本的視覺呈現以及文本圖像至少要有 4.5:1 的對比度;大號文本(字重為 Bold 時大于 18px,字重為 Regular 時大于 24px)以及大文本圖像至少有 3:1 的對比度。
小貼士:
Web Content Accessibility Guideline(Web 內容無障礙指南)是業界公認的指導標準,簡稱 WCAG 標準。其目標是為滿足國際個人、組織和政府需求的 Web 內容可訪問性提供單一共享標準。2018 年 6 月發布了 2.1 版本,并成為 W3C 推薦標準。WCAG 2.2 草案于 2022 年 9 月完成。
簡單來說,就是要求我們在設計適老化界面的過程中,文本顏色需要按照標準加深,與背景色拉開差距以保證年長用戶可以清晰識別。為了保證達到這一標準,我們可以使用色彩對比工具去進行測試:
工具一: https://webaim.org/resources/contrastchecker/
工具二: https://www.wenjiangs.com/wp-content/uploads/2017/06/contrast-ratio/
工具三: https://m2.material.io/resources/color/
工具四: https://contrast-grid.eightshapes.com
④ 顏色用途
顏色是界面設計最重要的元素之一,設計師經常通過不同顏色表達去傳達一些信息,例如成功、失敗等等。但是在無障礙設計中,顏色不應當作為傳達信息、表明動作、提示響應等區分視覺元素的唯一手段。因為隨著年齡的增長,我們對顏色識別感知會變弱,所以使用顏色代表特定意義的時候,需要有另外一種區分方案。例如:
- 使用下劃線表示鏈接,或使用粗體突出顯示文本
- 圖標和文本結合使用傳達成功或失敗的信息
- 使用線條粗細、紋理或圖案區分圖標樣式
- 使用不同的圖案傳達信息等等
對于顏色的使用,我們還需要注意以下幾點:
顏色多樣:頁面中應使用區別較大的豐富色彩,可借鑒真實存在的物體,保持認知一致。
可適當加深顏色以提高顏色的對比度
重要元素避免使用藍色和紫色:由于老年人的晶狀體變黃、變渾濁,會選擇性的吸收藍光,從而導致老年人對藍色的鑒別能力比紅、綠色的鑒別能力下降的更明顯。對于這一點,還是要看各個品牌的主題調性,如果無法避免使用藍色和紫色,那么就提高飽和度以加強識別性。
⑤ 驗證碼
對于移動應用中的非文本驗證碼(例如拼圖類、選圖類、旋轉類等驗證方式),年長用戶容易產生認知障礙,不理解驗證的方式;也可能會產生行動障礙,無法準確對齊驗證碼。所以對于驗證碼我們應當做如下處理:
- 圖片文本類驗證碼應當清晰易懂,并提供放大查看的操作;
- 非文本類驗證碼應當簡單易操作,或者提供可被不同類型感官(視覺、聽覺等)接受的替代或引導表現形式。
⑥ 圖標設計
對于頁面中的圖標,在適老化的過程中我們通常是按照適配比例去放大原來的圖標尺寸。除了單純的放大,在項目允許定制化設計的時候,我們還需要注意盡量采用通用、年長用戶易理解的形式去設計圖標。另外建議搭配文字描述,方便用戶更清晰更快速理解。
例如平安口袋銀行的大字版,圖標都一定程度上進行了擬物化處理,并且都配有通俗易懂的文字解釋“電話”“去這里”,能夠讓年長用戶輕松領會含義。
3. 可操作性
① 組件焦點(熱區)大小
由于年長用戶細胞水分減少,手指偏大,在使用觸屏的過程中靈敏度較低。所以對于常規組件的焦點,他們操作起來可能會很難完成操作目標。所以我們在放大文字、圖標等控件的同時,對于可點擊的組件焦點(熱區)也需要同步放大。
《規范》建議適老版界面中的主要組件可點擊焦點區域尺寸不小于 60 × 60dp/pt,其他頁面下的主要組件可點擊焦點區域尺寸不小于 44 × 44dp/pt;單獨的適老版 APP 中首頁主要組件可點擊焦點區域尺寸不小于 48 × 48dp/pt,其他頁面下的主要組件可點擊焦點區域尺寸不小于 44 × 44dp/pt。對于規范中的內容,具體我們可以這樣做:
- 在需要點擊操作的元素(<44pt)周圍添加 12pt 的反饋熱區;
- 大于等于 44pt 的元素,且有清晰邊界的元素,熱區保持與元素大小一致即可;
- 如果多個元素指向同一個操作結果,可使用組合連接在一起的熱區;
- 當元素處于某個組件容器內,最大熱區不要超過容器本身;
- 如果整個容器指向同一個結果,應當以整個容器作為按壓區域,而不是某個圖標或文字;
- 元素較多的情況下,操作熱區應平分元素間的間距。「有明顯邊框元素」和「沒有明顯邊界元」素擁擠時,優先保證「沒有明顯邊界元素」的熱區;
- 特殊的小尺寸元素,可以考慮拓展熱區,甚至覆蓋其他元素,以保證最少 44*44pt 熱區;
小貼士: 菲茲定律:任意一點移動到目標中心位置所需要的時間,與目標距離正相關、與目標大小負相關。 所以根據菲茲定律,為了提高年長用戶的操作效率,界面中放大需要用戶操作的元素,可便于用戶快速精準觸達。
② 手勢操作
觸摸屏時代,有著各種各樣創新的手勢操作和交互;但是對于年長用戶由于行動和認知障礙,這些創新比較難學習理解并流暢操作。所以在移動應用中,應對用戶進行手勢導航或者操作的結果提供反饋提示;避免需 3 個或以上手指才能完成的復雜手勢操作。對于點擊、上下滑動、左右滑動、放大縮小這四類交互年長用戶的接受度更高。
這四種交互,操作比較簡單;且對應到界面上的屏幕空間,用戶更容易理解。
現在很多應用中創新,有長按側滑進入左側空間、長按下拉進入二樓等交互;這類交互對于年長用戶來講其實非常不容易理解且不便操作。筆者之前教過家里長輩這類操作,想告訴他們這類“便捷創新”的功能,但是發現他們重復三四次才能完成操作,且過一段時間就會忘掉,依舊會選擇一步一步點擊到達目標頁面。
綜上,對于適老化版本的手勢操作我們需要注意以下幾點:
- 使用簡單的手勢操作:單指優于多指、單擊優于雙擊(多次點擊)、單一的手勢優于組合手勢;
- 不要加入需要力道觸發的手勢,例如長按下拉,年長用戶把控不好力度很容易把這個手勢變成了單擊;
- 有一定學習成本的手勢,應當給出引導教學;
- 給手勢操作及時反饋,避免用戶覺得沒有觸發到而多次點擊。
③ 充足操作/反饋時間
在移動應用中,如果限時不是活動的必要部分或關鍵要素,且不會導致用戶發生法律承諾或財務交易,則應為用戶的操作留下充足時間,在用戶操作完畢前界面不發生變化。
年長用戶對于一些動態信息的感知度比較低,所以如果頁面中出現一些提示信息,我們可以采用以下方案讓提示更友好:
- 適當延長時間,避免用戶還沒讀清內容就消失了,例如 toast 顯示持續時間可以由 3s 延長到 5s;
- 采用其他類型的提示給用戶足夠的閱讀時間,將短暫停留的內容,調整為常顯內容,由用戶自行操作確認關閉,例如將 toast 改成彈窗;
- 利用震動等其他感官提醒優化提示,例如消息推送的震動及消息提示音、警告場景下的長震動;
我們在拉長交互時間的同時,還需要注意避免跨屏任務,因為年長用戶在進行多個輸入或操作的任務上會表現出明顯的障礙。在任務的過程中,我們需要給出足夠的解釋說明,引導幫助年長用戶完成多任務操作。
④ 浮窗
在移動應用中,若內容產生新窗口(包含但不限于彈窗),應設置易于用戶關閉窗口的按鈕。關閉按鈕只可在左上、右上、中央底部,且最小點擊響應區域不能小于 44×44dp/pt。
對于這條《規范》,我們可以拆分成以下幾點來理解落地:
- 超出 7 秒長時間停留的頁面(彈窗),需要提供關閉機制;
- 關閉機制可以是關閉按鈕、返回按鈕、跳過按鈕或者功能文字操作按鈕等一切可以立即退出當前頁面的操作;
- 對于這些關閉機制的點擊熱區不能小于 44×44dp/pt。
⑤ 提供更便捷的錄入方式
年長用戶對于表單錄入類的操作,總是有很大的心理/操作負擔,碰到這類頁面常常是不愿意操作,讓別人代勞。例如銀行的轉賬頁面,大部分都需要錄入付款信息、收款信息、轉賬金額等一系列內容。如果讓用戶每一項都手動輸入,不但效率低而且很容易出錯。我們可以做些什么,去減輕用戶錄入負擔呢?
提供有限的選項和默認項?
- 在頁面中我們需要適當精簡頁面以減輕用戶心理負擔,只提供需要的選項,或者在需要的時候出現對應選項。
- 另外在有限的選項中,還可以提供高頻選項作為默認選項,減少用戶操作
簡單理解,提供的選項越少,用戶越容易選擇,提供默認選項>提供有限選項>提供多種選項。
選擇代替輸入
選擇類的交互方式比輸入類更便捷,可以避免繁瑣的打字過程,很多年長用戶打字都不是很順暢,甚至是使用手寫錄入文字。所以對于一些固定項的內容,使用選擇類的交互可以很大程度提升操作效率。
識別錄入代替輸入
對于一些比較大段,需要仔細核對的內容,使用拍照掃描、復制粘貼識別、二維碼識別錄入等方式更不易出錯;例如付方賬號的錄入。
自動數據帶入
具有前后邏輯關聯的表單數據,可以提供填寫某個數據自動帶入其他內容的聯動交互,減少用戶輸入/選擇操作;例如錄入收款卡號后、自動識別帶入收款銀行;
常用項歷史記錄
提供歷史記錄功能,記錄近期操作過的選項,方便用戶快速復用再次操作;例如常用收款人的記錄,點擊后自動帶入收款人信息,無需重復操作錄入。
⑥ 縮短操作路徑
年長用戶經常會出現“我在哪”“我要怎么做”“接下來我要做什么”等困擾;面對這樣的困擾,我們可以做如下交互優化:
精簡功能,縮短重點功能操作路徑,避免信息層級過深,要讓用戶快速觸達;
拆分任務步驟,防止信息過載,減少每屏信息密度;對于跨屏的長任務,提供操作進度引導,告知用戶所處位置進度,做到流程明確。
減少非必要操作,或允許跳過不必要的步驟;
4. 可理解性
① 提示引導機制
《規范》建議在用戶安裝移動應用時,應為適老化設置、老年人常用功能提供顯著的引導提示。也就是我們常說的功能引導機制。
對于內嵌的適老版界面,前文中也有提到常見入口位置,市面上大多數的適老版切換位置都比較隱蔽,且未按照規范給予顯著切換提示,還有很大的優化空間。
經調研分析多個 app 產品,適老化設置我們可以從以下幾點著手優化設計:
初次下載 app 或適老版上線的時候,提供功能開啟引導或功能上新提示,告知用戶有該功能、功能的入口、如何操作開啟;
開啟前提前告知用戶,適老版是什么,開啟后界面會有怎樣的變化,給用戶心理預期;
進入適老版本后引導提示用戶如何回到標準版本,避免用戶不想使用適老版而找不到出口;
退出適老版需要二次確認關閉,防止長著用戶誤觸。例如云閃付為簡單的彈窗提示,招商銀行使用了半彈窗,還告訴用戶如何重新開啟長輩版,既起到了二次確認的作用也做了提示引導;
在“設置”中提供“適老版”入口,且用戶可以通過搜索“長輩版”、“親情版”、“關愛版”、“關懷版”等關鍵詞直達功能;
常用功能的提示引導我們可以從以下幾點著手優化設計:
- 提供功能指示引導或說明
- 設置幫助中心,提供純文字教程、圖文教程或視頻教程,方便用戶查找。還可以將教程以浮窗的形式展示在具體功能頁面中,讓用戶可以邊看邊操作。
- 設置客服中心(智能客服、電話客服),運營/客服人員專項跟進,隨時為年長用戶提供幫助。
- 界面設計中,對于需要點擊操作的設置行為指引,引導用戶完成點擊。例如在按鈕文案中加入行為動作,結果導向的內容;還可以對于一些卡片式的點擊區域加上按鈕引導。
② 語音功能
在適老版中融入語音功能可以很好的輔助年長用戶進行一些錄入操作和信息獲取,因為很多年長用戶文化程度不高,不會使用輸入法,大多選擇手寫輸入的方式。但是手寫輸入效率比較低,而且如果寫的字不清晰會識別錯誤。我們可以從以下幾個角度融入語音功能:
使用 AI 技術,提供語音輸入功能,目前市面上不少銀行應用都設置了語音操作的功能,而且將這個作為重點易觸達的功能展示在了關鍵位置。例如工商銀行的語音操作;
功能操作過程中,提供實時智能語音助手或人工客服;也可以結合語音導讀功能進行同屏解說引導用戶操作;
提供結果狀態下語音播報或聲音反饋提示,在操作正確或錯誤時給予對應的正向、警示提示音;
融入智能讀屏功能。
融入語音功能的時候,考慮到年長用戶的聽覺障礙,我們還需要注意以下幾點
- 適當增大音量:老年人聽覺平均感知音量在 67.5~75.3 分貝之間;
- 降低語速,提供慢速、正常、快速等語速供用戶自己選擇,更清晰有效的獲取語音信息;
- 優化收音機制,去除雜音,提升錄入識別成功率;
- 支持方言,可智能識別方言或有一定糾錯機制。
③ 通俗易懂的文字
由于年長用戶觸網時間短,受教育程度不同,可能對互聯網常用的一些詞匯存在認知障礙。所以我們在設計的時候需要對一些互聯網詞匯進行口語化表達,采用用戶易理解的文案。
同時對于一些提示性的文案,需要表達清晰,在文案上要具有一定的引導性,例如,用戶輸入賬號缺少 1 位的時候,應當提示:請輸入 xx 位賬號,而不是僅僅提示,輸入錯誤,讓用戶自己去找哪里錯了。
④ I 模型-精簡的布局
目前市面上大多數首頁都承載了很多內容,但是這種布局對于年長用戶來講不利于集中視線聚焦功能。所以在適老版建議采用 I 模型的布局模式,聚焦內容,減少用戶視線主焦點的轉化,這樣更便于年長用戶閱讀與理解。一般來講,我們需要控制用戶的視覺主焦點轉化不超過 2 次。
⑤ 使用具體的內容、真實形象
在制作活動 banner 場景中,采用具象的圖片會比插畫類型的圖形更容易向年長用戶傳達信息,而且會給年長用戶傳遞出真實感從而提升對產品的信任度。例如中國銀行在適老版的設計中采用了大量的真人場景配圖,非常的直觀易理解。
5. 兼容性
輔助技術
移動應用程序不應禁止或限制終端廠商已適配好的輔助設備(如讀屏軟件等)的接入與使用。在輔助工具開啟時,移動應用內容中所有功能性組件均能正常工作:按鈕可正常訪問;輸入框能正常進行輸入;多媒體能正常播放;在頁面局部更新后,移動應用內容中新增的功能性組件也應能正常工作。
這一點更多的是從開發技術角度制定的規范,要求軟件開發的過程中做好適配,保證適老版使用各類輔助技術的時候能夠正常運行。我們設計師能做的就是在設計驗收的過程中,考慮到這個層面,并將一些輔助功能的接入與使用納入設計驗收。
6. 安全性
① 拒絕引導性內容
現在很多應用有著各種各樣的廣告、推銷、誘導下載鏈接等,而年長用戶容易受騙,所以在適老版中嚴禁出現推銷廣告等內容。《規范》中限制如下:
- 廣告插件及誘導類按鍵限制
- 禁止廣告插件。適老版界面、單獨的適老版 APP 中嚴禁出現廣告內容及插件,也不能隨機出現廣告或臨時性的廣告彈窗。
- 禁止誘導類按鍵。移動應用程序中無誘導下載、誘導付款等誘導式按鍵。
對于銀行金融產品來講,涉及到資金安全,篩選重要功能、安全的產品提供給年長用戶就顯得尤為重要。例如工行適老版的投資理財和專屬存款,僅放了適合年長用戶的產品。
② 給用戶信任感,保障老年用戶個人信息安全
移動應用程序進行個人信息處理時應遵循最小必要原則,即處理個人信息應當有明確、合理的目的,并應當限于實現處理目的的最小范圍,不得進行與處理目的無關的個人信息處理,以保障老年用戶個人信息安全。
同時我們在設計呈現的時候,可以加入一些安全、保障類的表達來提升產品整體的可信度,增強年長用戶對產品的信任感,從而敢用。例如:
- 加入安全中心、安全保障、信任背書等元素,打消年長用戶疑慮;
- 對關鍵信息進行脫敏展示,降低年長用戶對數據泄露的擔心;
- 在各個環節增加安全信息提示,加強安全認證,多重保障讓年長用戶安心;
- 增加防騙、反欺詐模塊,增強年長用戶防騙意識
章節小結
以上,我們結合《規范》里逐條規則和實際案例拆分講解了如何去實際落地適老化設計。在這里借用阿里對適老化設計建議的關鍵詞提煉,總結本章重點內容:
- 字號≥18dp/pt——清晰的字型、足夠大的文字、舒適的行間距
- 強烈好于柔和——符合無障礙標準的對比度、可識別的顏色
- 具象好于抽象——優先使用寫實圖片
- 行動好于描述——使用表示行為的“動詞短語”會更容易理解
- 熟悉好于新鮮——使用符合認知的設計和流程、易理解的圖標、通俗易懂的文案
- 色彩好于圖形——使用豐富的色彩,加強年長用戶記憶與理解
- 點擊好于滑動——簡單的手勢操作、容易點擊的熱區
- 點擊好于輸入——提供更便捷的錄入方式
- 多模態好于單模態——語音功能的融入
接下來我們一起看一下目前市面上的一些銀行金融產品適老化版本的體驗測評分析。
1. 工商銀行
名稱:幸福生活版
slogan:超大字體,設計極簡;語音助手,交互升級;專屬理財,樂享收益;親情賬戶,傳遞關愛。
入口:五個一級頁面下拉加號內的版本切換;我的頁面-設置-切換長輩版(幸福生活版)
出口:一級頁面拉加號內的版本切換;我的頁面-設置-切換標準版。
體驗分析:
- 入口和出口位置及交互一致,貼合用戶心智,符合操作習慣;
- 一級頁面布局精簡,層級清晰,重點功能突出。語音操作放在了最重要的位置,方便年長用戶操作
- 頁面內的功能都經過了篩選,只放出了年長用戶常用功能。對于網點服務還有專門的適老網點推薦
- 功能子頁面也做了適老化的定制,從視覺到交互,都適配了年長用戶需求。
- 除了個別不是很重要的標簽文字比較小,工行整體的適老化都做的不錯
推薦指數:☆☆☆☆☆
2. 招商銀行
名稱:長輩版
入口:我的頁面-設置-長輩版
出口:首頁-下拉到底部-回標準版
體驗分析:
- 入口較隱蔽,開啟無提示直接開啟
- 首頁是常用功能、點擊客服直接進入“小招客服”,頁面精簡,重點突出;
- 功能子頁面僅做了簡單的文字、控件放大;
- 點擊“回標準版”出現的半彈窗提示,防止誤操作,起到二次確認的作用,同時告知用戶重新開啟的入口
推薦指數:☆☆☆
3. 中國銀行
名稱:歲悅長情版
slogan:風格簡約,大字展示,為年長客戶甄選產品和服務
入口:首頁-版本;我的-設置-版本切換
出口:我的-切換標準版
體驗分析:
- 入口的設計視覺效果很好,非常直觀。
- 出口太過明顯,且沒有二次確認,對于年長用戶如果誤觸了回到標準版,可能找不到入口
- 首次切換至歲悅長情版,有功能引導
- 一級頁面功能和布局做了精簡,但是二三級子頁面未做適配。
- 整體設計風格符合年長用戶審美,給用戶溫馨的感覺。
推薦指數:☆☆☆
4. 中國農業銀行
名稱:大字版
slogan:超大字體,功能精簡;語音助手,一鍵客服
入口:首頁-版本;鄉村振興-版本;我的-更多下拉-版本;設置-版本切換
出口:首頁-版本;我的-更多下拉-版本;設置-版本切換
體驗分析:
- 多個入口,且入口的設計樣式很有特色;出口與入口的路徑相同。
- 布局清晰,功能做了篩選精簡,一級頁面僅保留常用功能。
- 重點功能子頁面進行了布局和交互的適老化適配。
- 整體的視覺還原和諧度很好,大字版的用色也針對年長用戶的生理特征進行了加深處理。
推薦指數:☆☆☆☆☆
5. 寧波銀行
名稱:關愛版
slogan:超大字體,精簡功能;貼心服務,便捷易用
入口:首頁-加號下拉-版本切換;我的-版本切換;
出口:首頁-加號下拉-版本切換;
體驗分析:
- 頁面極簡,取消了底部的 tab 欄,首頁視覺表達符合年長用戶需求;
- 語音功能使用了懸浮的按鈕,且伴隨收起交互,這點對年長用戶不是很友好,不容易點擊使用;
- 重點功能子頁面僅做了少量適配,大部分控件與普通版一樣;
推薦指數:☆☆☆
6. 平安口袋銀行
名稱:大字版
slogan:平安在手,兒女無憂;字體更大,簡潔易懂
入口:首頁-加號下拉-版本切換;我的-版本切換;
出口:首頁-版本切換;我的-版本切換;我的-設置-版本切換
體驗分析:
- 頁面結構清晰,重點功能突出,精選的功能都是與年長用戶相關的,比如防騙寶典、平安老人意外險等等;
- 圖標設計更具象,更易讀懂理解;
- 二三級子頁面均做了視覺適配,適配呈現效果體驗感很好;
- 各類業務場景都做到了告知、引導和反饋。
推薦指數:☆☆☆☆☆
7. 云閃付
名稱:關愛版
slogan:字體大,圖標大,使用更簡單
入口:首頁-版本切換;我的-設置-切換至關愛版
出口:首頁-版本切換
體驗分析
- 布局和功能都做了精簡;
- 退出關愛版有二次確認,避免了誤操作;
- 各功能的子頁面未做大字適配。
推薦指數:☆☆☆
8. 江蘇銀行
名稱:融享幸福版
slogan:字體更大 簡潔清晰 一鍵幫助 安全無憂
入口:首頁-版本切換;
出口:首頁-版本切換;
體驗分析
- 入口與出口一致,標識明顯;
- 頁面布局精簡,功能內容貼合年長用戶的需求,特別是一鍵幫模塊里的內容都是實際解決年長用戶需求的功能;
- 語音介紹功能,是其他產品沒有的,開啟后可以點擊進行語音播報講解,很大程度解決了年長用戶看不懂、不會用的痛點;
- “反欺詐指南”、“日歷模式”都貼合年長用戶需求,暖心且有特色;
推薦指數:☆☆☆☆☆
這篇文章很長,感謝大家耐心讀到了最后。其實剛開始準備這篇文章的時候,只是想基于自己的工作內容做一個復盤。但是在書寫總結的過程中,我查找閱讀了大量的資料,感受到了無障礙、適老化設計的暖心人文關懷,就覺得很有必要仔細的寫一寫。特別是這句話“手機字體越來越大,音量越來越大,子女的陪伴卻越來越少。子女知識想用一部手機聯系到老人,卻沒有想過,他們也想用手機,去聯系今天的世界。”狠狠的觸動了我。
所以如果能讓更多的設計師關注到這個群體、能夠向更多的設計師傳達適老化設計的一些知識點,這篇文章就發揮了它的價值。
其實整體來看,目前整個互聯網的產品適老化才剛剛開始并不是很完善,企業也可能因為成本、資源等問題無法實際落地推動適老化設計。但是隨著時間的推移,一定會有更多的產品關注并落地實施適老化(在我寫這篇文章的過程中,有好幾家銀行產品對適老化的版本做了多次迭代優化,最終編輯排版的時候,又更新了一些案例。所以說適老化是大趨勢,頭部產品都已經開始注重這部分人群的體驗了)希望通過這篇文章給設計師們一點啟發。就算大家目前所做的產品,沒有適老化設計的需求,里面的一些知識點融入基礎產品的設計,也是適用的,能給用戶帶去更好的用戶體驗。
再次感謝大家的閱讀,希望通過設計的力量,幫助年長用戶更好的融入并享受數字化生活。
參考文章:
為了幫助大家更好的理解本文,以下為書寫過程中閱讀參考的一些文章和報告,可供進一步深入學習。
- 《QuestMobile2022 銀發經濟洞察報告》
- 《中國互聯網絡發展狀況統計報告》?
- 《QuestMobile 銀發人群洞察報告》?
- 《QuestMobile 金融支付報告》?
- 《工業和信息化部辦公廳關于進一步抓好互聯網應用適老化及無障礙改造專項行動實施工作的通知》
- 《騰訊出品!手機銀行適老化設計探索(附超多干貨)》
- 《如何做好產品的適老化和無障礙設計?來看騰訊的實戰案例!》?
- 《小程序適老化設計指南》?
- 《超全面!「無障礙設計」指南》?
- 《適老化設計——讓產品充滿溫度》?
- 《百度大字版精細系統的適老化設計研究實踐》?
- 《一篇就夠!實際場景落地適老化設計》?
- 《色彩無障礙指南: 如何讓色盲用戶獲取色彩信息》?
- 《銀發族數字化產品適老化研究藍皮書》?
- 《優設 9 圖-如何做好適老化設計》?
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
標志設計標準教程
已累計誕生 729 位幸運星
發表評論 為下方 16 條評論點贊,解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓