前不久看了阿里巴巴的設(shè)計(jì)周，其中有一個話題引起我注意“適老化”設(shè)計(jì)，今天就來聊一聊適老化設(shè)計(jì)的注意點(diǎn)。*文章末尾我會把阿里巴巴的演講ppt分享出來，如果這篇文章能幫助到你，還請點(diǎn)贊、分享。

1 老齡化是一個全球趨勢

據(jù)《世界人口展望：2019年修訂版》的數(shù)據(jù)顯示，到2050年，全世界每6人中，就有1人年齡在65歲（16%）以上，而這一數(shù)字在2019年僅為11人（9%）。
再來看看我國情況：因中國的人口基數(shù)龐大，中國目前老齡化進(jìn)程是世界第一。我國的網(wǎng)民除了地域呈現(xiàn)從一線城市向四、五線城市的遷移之外，也呈現(xiàn)出偏向老齡化的特征。

2 三孩政策暗示老齡化時(shí)代來臨

前不久國務(wù)院發(fā)布國家開放了“三孩政策”也看出來國家針對人口老齡化表現(xiàn)所作出的國家方針的決策?；貧w我們所在的互聯(lián)網(wǎng)行業(yè)，也許慢慢的互聯(lián)網(wǎng)的原住民不再是z時(shí)代的年輕群體，他會慢慢的向中年、老年人所遷移。
今年1月份國家也開始重視了關(guān)于老年人互聯(lián)網(wǎng)生活感受，先后頒布了《關(guān)于切實(shí)解決老年人運(yùn)用智能技術(shù)困難的實(shí)施方案》。通知在全國范圍內(nèi)組織了為期一年的互聯(lián)網(wǎng)應(yīng)用適老化及無障礙改造專項(xiàng)行動，?專項(xiàng)行動方案針對老年人、視障聽障人士、肢體障礙人士使用app需求，進(jìn)行改造要求，并且列出43個手機(jī)app的適老化改造產(chǎn)品清單。

我體驗(yàn)了百度、支付寶、喜馬拉雅、滴滴打車這四款app針對適老化項(xiàng)目的改版。

老年版還有一個特殊的名稱，就是精簡版。從產(chǎn)品的功能上進(jìn)行了大量的精簡，比如支付寶在老年版的模式中只提供了使用頻次比較高的功能健康碼、結(jié)賬付款、充話費(fèi)等功能，做到了功能上的精簡。

我相信在未來的幾年，我們的產(chǎn)品會有適老化的改版需求。聽完我說這么多大家心中都會有一個疑問：哪些群體屬于老年群體？生活中老年人用戶數(shù)量比較少不了解他們的需求？針對適老化項(xiàng)目我們應(yīng)該怎么改?

1.老年群體的劃分

各國對老年人口的年齡界限的規(guī)定各不相同，有的國家規(guī)定為65歲以上，有的規(guī)定為60歲以上。?我國《老年人權(quán)益保障法》第2條規(guī)定老年人的年齡起點(diǎn)標(biāo)準(zhǔn)是60周歲，即凡年滿60周歲的中華人民共和國公民都屬于老年人。

2.老年人的需求有哪些

身邊的人肯定會有上了年紀(jì)的人，回答這個問題前，咱們先說老年人和我們有什么不同，?其實(shí)當(dāng)人類的生理年齡超過20歲，人類的老化過程就可以開始，老年用戶最大的特點(diǎn)就是其五力—視力、聽力、表達(dá)力、行動力和認(rèn)知力的弱化，導(dǎo)致產(chǎn)品的可讀性和體驗(yàn)性低，造成用戶對我們的產(chǎn)品失望更有甚者認(rèn)為我們的產(chǎn)品是一個糟糕的產(chǎn)品。

如果把這些需求進(jìn)行整理，就會發(fā)現(xiàn)多數(shù)情況是用戶的聽力、視力和手部敏捷度下降造成用戶的可讀性下降，從而導(dǎo)致用戶產(chǎn)生了不理解、犯錯的操作。歸根到底我們可以把用戶的需求分為兩種類型“服務(wù)需求”和“生理需求”。

3.?為啥老年人看不清楚

人的眼球就像是一部精密的照相機(jī)，眼之所以能看見物體，是因?yàn)檎赵谖矬w上的反射光線，經(jīng)過眼球的角膜、晶狀體及玻璃體等屈光間質(zhì)折射后，成像在視網(wǎng)膜上。

隨著年齡增長人的晶狀體會出現(xiàn)硬化、睫狀肌衰弱的情況出現(xiàn)，造成物體不能很好地成像在視網(wǎng)膜上，據(jù)調(diào)查反饋在 40 歲時(shí)，只有一半的光線像 20 歲時(shí)一樣進(jìn)入視網(wǎng)膜。對于 60 歲的人來說，只有 20%。正是因?yàn)橐陨系脑颍瑢?dǎo)致老年人的視覺分辨物體的敏感度、明暗感覺、空間感覺、色彩感覺的能力下降，有看不清楚的情況出現(xiàn)。

4 別讓適老化的設(shè)計(jì)只有“大、大、大”

設(shè)計(jì)師是團(tuán)隊(duì)中唯一站在用戶的角度考慮問題的人員，我們不應(yīng)該只把適老化設(shè)計(jì)變成只是“大字版”的解決方案——加大字號、加大音量、加大屏幕尺寸這么簡單。

5.?有規(guī)劃的設(shè)計(jì)解決方案

凸顯我們設(shè)計(jì)的專業(yè)程度應(yīng)當(dāng)站在用戶同理心的角度，針對的為自己用戶的群體設(shè)計(jì)一份專業(yè)化的設(shè)計(jì)思路，把需要解決分問題點(diǎn)都一 一梳理清楚，再動手制作設(shè)計(jì)圖紙。

老年人眼睛最常見的問題是視力障礙，俗稱“老花眼”，影響用戶進(jìn)行閱讀。?如果老年人不會閱讀它，或者如果他們無法閱讀或理解它，那么擁有它又有什么意義呢？
我歸納出4種方法，大家可以按照以下歸納的設(shè)計(jì)方法和設(shè)計(jì)技巧來做適老化的設(shè)計(jì)改版。

1 字體

ui中的文字是產(chǎn)品界面中最重要的一個元素，我們先來看看關(guān)于字體的一些技巧。當(dāng)產(chǎn)品中的文本給用戶很難閱讀的感覺，用戶想閱讀的意愿就會降低，還有一個場景細(xì)心的同學(xué)不難發(fā)現(xiàn)，當(dāng)用戶閱讀時(shí)間變長了之后就會彎腰駝背，甚至瞇起眼閱讀，如果發(fā)現(xiàn)產(chǎn)品的用戶出現(xiàn)這樣的情況，那就要注意以下幾點(diǎn)。

A 使用非襯線體

襯線指的是字母結(jié)構(gòu)筆畫之外的裝飾性筆畫。有襯線的字體叫襯線字體（serif）；沒有襯線的字體，則叫做無襯線體（sans-serif）。
簡單的理解就是非襯線體(例如黑體等)就是沒有裝飾性筆畫的末尾，這種無襯線體也是被廣泛應(yīng)用網(wǎng)頁端或手機(jī)端的產(chǎn)品，所以非襯線字體有醒目而且輪廓清晰的特點(diǎn)，是提升屏幕可讀性的首選。
*注意的是在設(shè)計(jì)過程中避免使用多種字體或者精心設(shè)計(jì)的造型字體，因?yàn)檫@可能會造成用戶混淆。

2 文本

隨著年齡的增大，老年人可看到的視野也是變化的他會越來越小，所以在設(shè)計(jì)多字文本場景時(shí)候我們要注意以下兩點(diǎn)。

A 文本字號不小于16像素

有資料顯示12像素的字體可以正常閱讀文本了，但是對于大多數(shù)讀者來說，12 像素仍然太小了。即使是 15 像素也會讓原本可能會轉(zhuǎn)換的訪問者望而卻步。
為什么文本字號要設(shè)計(jì)為16像素呢？有研究表明在我們屏幕上 16 像素的文本大小與印刷在書籍或雜志上的文本大小相同，這很符合人的閱讀習(xí)慣，但是人閱讀還有一個因素是不能忽視的，就是人和屏幕之間的距離。

舉一個例子，我們讀書都是手捧著書，印刷字體通常設(shè)置在 10 點(diǎn)～12點(diǎn)左右，考慮到用戶距離屏幕的距離其實(shí)和顯示器上16像素的字體大小相同的。（一般前端開發(fā)會使用em單位進(jìn)行字體大小開發(fā)，這個可以保證在不同分辨率上字體的比例，設(shè)計(jì)師只需要了解即可。）

*瀏覽器的默認(rèn)字體高都是16像素，除非特殊情況，通常情況下字體不建議使用10 像素。
*任何閱讀類或點(diǎn)擊類的內(nèi)容都應(yīng)該按一定比例放大，尤其是在設(shè)計(jì)按鈕上面的字號，應(yīng)該盡量保持較大，不少于16像素。

說一個有趣的事情，我發(fā)現(xiàn)在印刷中小至 8 像素的字體是可讀性和成本之間的理想折衷方案，我查閱了相關(guān)文章，是因?yàn)檫^大的字號會浪費(fèi)紙張?jiān)斐捎∷⒊杀驹黾?。?Web 上，不需要為更多空間而支付任何費(fèi)用，考慮的是給用戶高效的傳達(dá)文本信息。

B 添加設(shè)置字體大小的功能

現(xiàn)在很多系統(tǒng)中都會有調(diào)節(jié)字號的功能，如果在資源條件充沛的情況下可以開發(fā)類似的功能，方便用戶自己進(jìn)行設(shè)置調(diào)節(jié)。下圖是蘋果系統(tǒng)自定義文字大小功能。

3 顏色

任何設(shè)計(jì)都是離不開色彩的那么接下來讓我們看看在顏色的選擇上要注意那些情況。

A 使用和現(xiàn)實(shí)生活中認(rèn)知一致的顏色

老年人通常會用經(jīng)驗(yàn)去判斷一個事物，尤其是與外國人相比中國人更習(xí)慣以經(jīng)驗(yàn)來思考問題，所以我們在做設(shè)計(jì)時(shí)候要盡量降低老年人的學(xué)習(xí)成本。比如我們生活中常常會見到十字路口的紅綠燈，綠色代表通行，黃色代表等待，紅色代表禁止，我們在設(shè)計(jì)重要提示時(shí)候也可以借鑒這種方式去設(shè)計(jì)，保持和老年人現(xiàn)實(shí)生活對色彩的認(rèn)知是一致的。

B 避免使用藍(lán)色

前面已經(jīng)說 老年人對對比度差異的敏感度降低、區(qū)分相似顏色方面變得更差。尤其是無法分辨藍(lán)色和紫色之間的區(qū)別，對綠色鑒別能力下降更明顯。

考慮到老年人眼睛對藍(lán)顏色的陰影不敏感，那么就要降低設(shè)計(jì)中使用藍(lán)色和紫色相互配合的場景，比如背景、文字、圖標(biāo)、圖片等模塊。

C 找到最合適的對比度

使用具有高對比度級別的配色方案使頁面更具可讀性在顏色的對比度上，可以根據(jù)WCAG2.1（Web Content Accessibility Guideline，Web內(nèi)容無障礙指南）設(shè)計(jì)顏色的對比，比如把重要的文字信息的對比度設(shè)計(jì)到AAA,次級的文字信息的對比度設(shè)計(jì)到AA。

在適老化設(shè)計(jì)中，色彩對比度要在4.5:1之上，即對比度達(dá)到 AAA級和AA級，讓界面中的信息與其背景間的關(guān)系對比度較大，才能足以讓老年人看清信息。

如果不了解怎么判斷對比度是什么級別，我建議大家可以收藏下面的網(wǎng)站。只需要把色紙?zhí)钊氲杰浖?，就可以看到兩個顏色關(guān)系的對比度。

4 交互

人在手機(jī)上的交互手勢會有很多種，根據(jù)不同的業(yè)務(wù)場景，我們使用的交互手勢也不相同。?大致分為四類：單擊（tap）；長按（long press）；雙擊（Double Tap）；長按&拖拽（long press & Drag）。

這么多交互手勢，機(jī)器需要先判斷你是什么手勢再根據(jù)手勢指令給出相應(yīng)的反饋。
當(dāng)手指貼合上屏幕的時(shí)候，反饋的熱區(qū)，并不是均勻向四周擴(kuò)散的，而是向下的擴(kuò)散。對于觸摸中心點(diǎn)，在觸摸的過程中，就會有向下的一個偏移，如圖：

例如在iOS內(nèi)的手勢識別，有一個專門的接口來做識別：PanGestureRecognizer，這個接口會在10px內(nèi)先判定手指移動的方向和距離，再對具體觸發(fā)的手勢來做定義。

A? 大的間距

在移動端，按鈕尺寸根據(jù)手指觸摸屏幕的最小點(diǎn)觸區(qū)域，平均長度在10-14mm之間，指尖的長度為8-10mm，所以10mm x 10mm就是一個最小觸摸目標(biāo)尺寸。在iOS 人機(jī)交互規(guī)范里面的 44*44 point是apple HIG建議的手指點(diǎn)觸最小點(diǎn)觸面積。所以我們可以在不同設(shè)備不同 PPI 時(shí)處理尺寸，在移動端設(shè)定點(diǎn)觸尺寸的最小點(diǎn)觸區(qū)域大小來設(shè)置按鈕尺寸的大小。

·移動端：按鈕高度35px-50px之間，字號13pt-17pt，圓角4-8
·web端：按鈕高度24px-48px，字號12-18，圓角6-10

因?yàn)槔夏耆说氖种钙螅从匙兟鸵枰严嚓P(guān)按鈕的大小、組合的間距等設(shè)計(jì)的足夠?qū)挻?，方便用戶點(diǎn)擊；一些操作反饋的時(shí)長也需要拉長，給老年人足夠的反應(yīng)時(shí)間。建議至少保持在8像素以上的間距。

B 點(diǎn)擊好于輸入

基于以上因素考慮，對于老年人群，選擇類的交互和輸入類的交互相比，用戶的效率會大大提高，所以點(diǎn)擊類交互要好于輸入類交互。

C?符合用戶心理預(yù)期

這里我列舉一個蘋果的案例，蘋果在設(shè)計(jì)積極按鈕的時(shí)候通常會放到布局的最右側(cè)，舉個例：
這里有“取消”和“確認(rèn)”兩個按鈕，對于業(yè)務(wù)方來說判斷“確定”是積極按鈕，所以在設(shè)計(jì)這樣的彈窗時(shí)候 會把“確定”放在最右側(cè)。

5 具體的內(nèi)容

A 形象應(yīng)更加真實(shí)

老人對設(shè)計(jì)師的樣式判斷不是那么清晰和明顯，設(shè)計(jì)師尤其是在制作活動banner場景中，使用具象的圖像往往會比插畫的圖像信息傳達(dá)更為直接。

B?圖標(biāo)加文案

人與人之間的認(rèn)知水平是存在差距的，老年人的認(rèn)知水平相對較低。比如在圖標(biāo)的設(shè)計(jì)方向，可能一個通話的圖標(biāo)會有手提電話和座機(jī)電話兩種表現(xiàn)方式，但是真正使用那種圖標(biāo)就會給用戶產(chǎn)生誤區(qū)，最好的解決辦法是用“純文字加圖標(biāo)”的形式表達(dá)是最為合理的一種方式。

C 色彩更有辨識度

對于部分的用戶來說，有好的色彩更能增加信息傳達(dá)的辨識度。比如我們在把圖標(biāo)雖然加上了文案，用戶第一眼看上去還是撞色處理的方式更好。

D?有引導(dǎo)性文案

對于老年人，我們可以運(yùn)用潛意識作為界面中的隱形向?qū)?，確保視覺提示清晰，幫助產(chǎn)品順利完成目標(biāo)行為。

老年人的理解能力也會比常人要弱一些，對于一些文案或者專有名詞要描述具體，便于用戶進(jìn)行理解和做出選擇。研究發(fā)現(xiàn)帶有目的性的行動文案要好于描述類的文案。

6 語音功能的加入

語音功能也是輔助老年人的一項(xiàng)功能點(diǎn)，通過語音搜索直達(dá)某個功能等。比如在搜索場景、客服場景、查詢場景等等。值得注意的是在設(shè)計(jì)之初要考慮以下幾個場景：·適當(dāng)?shù)卦龃笠袅?、使接收的聲音更加清晰?/strong>·添加聲音反饋機(jī)制，如果聲音發(fā)送成功，應(yīng)該給予正確的聲音提示。

1 驗(yàn)證的范圍

其實(shí)驗(yàn)證設(shè)計(jì)是否成功和我們正常做項(xiàng)目的思路大致相同，無外乎從比如產(chǎn)品體驗(yàn)，用戶服務(wù)，產(chǎn)品功能這三個層面進(jìn)行跟蹤反饋。

2 驗(yàn)證的指標(biāo)

目前都是通過定量測試的方式，進(jìn)行可用性指標(biāo)來進(jìn)行衡量的。我列舉了四個緯度，方便大家進(jìn)行借鑒和衡量。

任務(wù)成功率：用戶能否順利的完成任務(wù)，解決用戶需求。任務(wù)完成率：用戶多快能完成任務(wù)，耗費(fèi)時(shí)間多久，多數(shù)情況用于衡量效率。任務(wù)出錯率：在用戶完成任務(wù)的路徑出，用戶出錯幾次，用于衡量出錯頻率。用戶滿意度：用戶完成任務(wù)后，用戶對產(chǎn)品的功能進(jìn)行打分，用戶衡量用戶的滿意程度。

其實(shí)國家提倡的適老化設(shè)計(jì)，我們可以設(shè)想另外一個話題——為老年人做設(shè)計(jì)等于為更多的人做設(shè)計(jì)。

1 無障礙設(shè)計(jì)在互聯(lián)網(wǎng)產(chǎn)品中的應(yīng)用

如果你使用的是蘋果MacOS系統(tǒng)的操作系統(tǒng)，你可以看到蘋果在這種老年人（無障礙）設(shè)計(jì)中的功能設(shè)計(jì)，比如蘋果的輔助功能中的設(shè)計(jì)選項(xiàng)，有興趣的同學(xué)可以體驗(yàn)一下。

其實(shí)在國內(nèi)的互聯(lián)網(wǎng)產(chǎn)品公司也有做過無障礙的設(shè)計(jì)，比如小米發(fā)布的MIUI系統(tǒng)中的無障礙觸感設(shè)計(jì)，有興趣的小伙伴可以自己下載去體驗(yàn)。

2 開拓自己的知識面

其實(shí)網(wǎng)上有很多關(guān)于無障礙設(shè)計(jì)可以借鑒的參考文獻(xiàn)，比如W3C無障礙指南（WCAG 2.1）就是其中一款，WCAG是Web Content Accessibility Guidelines 即web內(nèi)容無障礙指南有興趣的同學(xué)可以查詢一下。

很多設(shè)計(jì)規(guī)范網(wǎng)站都會有關(guān)于無障礙設(shè)計(jì)的介紹，有興趣的同學(xué)也可以查看。

參考文獻(xiàn)：
探索“流暢感”——談手勢動效體驗(yàn)設(shè)計(jì)：https://mp.weixin.qq.com/s/RVCHzJQYp_NompX2ebbg9w

如何為老年人設(shè)計(jì)？來看貝殼的實(shí)戰(zhàn)經(jīng)驗(yàn)總結(jié)：

https://www.uisdc.com/designed-for-the-elderly
工具網(wǎng)址：https://www.w3.org/Translations/WCAG21https://contrast-grid.eightshapes.comhttps://webaim.orghttps://odyssey.okta.design/base/https://www.carbondesignsystem.com/https://fusion.design/pc/?themeid=2https://primer.style/

文章轉(zhuǎn)載自：https://www.zcool.com.cn/article/ZMTI2MTQwMA==.html

作者：斜杠7濕兄?

? ? ? ? ?

本文內(nèi)容為轉(zhuǎn)載 僅供個人學(xué)習(xí)使用

標(biāo)簽：