中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

什么是無障礙思維？如何提升？具體如何使用？文章主要從這三點出發(fā)，對無障礙思維進行了梳理分析，與大家分享。

概念說明：一種不需要定制就能滿足于各類需要用戶群體的思維模式。

一、概述

無障礙這個概念被提出時最初是為了滿足殘疾人群體的要求，相信生活中大家也時?？吹竭^很多無障礙設計。

無障礙衛(wèi)生間

無障礙通道

無障礙電梯

伴隨著人們對“無障礙使用”思維的積累和設計上的部隊革新，“無障礙”已經(jīng)不再是殘疾人的代名詞，它漸漸成為了所有人群的代名詞。

什么是無障礙？字面意思已經(jīng)非常清楚了，就是讓用戶不分群體、不分心智、不分身體情況等，在沒有任何障礙的情況下去正常使用產品。

二、產品中的無障礙方法論

在任何一件產品中，或多或少都會包含無障礙的思維。

好的無障礙應該從下面四個要素去考慮：

• • 易讀性
  • 易操作性
  • 簡易性
  • 包容性

1. 易讀性：無論使用者處于何種年齡段，無論他們的感官上是否存在差異，他都能夠很好的理解產品中的設計；
2. 易操作性：無論使用者處于站、坐、臥還是其他狀態(tài)，無論是單手、雙手還是其他操作姿態(tài)，他都可以很好的操作產品；
3. 簡易性：無論使用者在何種文化水平，對菜品的使用經(jīng)驗或背景上有何等差異，他都能夠快速上手并正確使用產品；
4. 包容性：無論使用者怎么去進行“破壞”產品的操作（如文本框輸入特殊符號、懶加載瘋狂下拉等），都能夠保證產品的最小錯誤和最輕后果。

三、如何提升產品中的無障礙

一款產品中的“無障礙”提升應該從上面四個要素組成的四維維度去考慮。

1. 易讀性

1. 使用通用圖標，文字等標注呈現(xiàn)的通用信息，對于不同模塊或者同一模塊的不能內容則有層次感有區(qū)分度，從而提高用戶的感官舒適度；
2. 輔助性設計，如圖片的alt屬性，input的占位符屬性；
3. 合理的頁面布局，如“我的”放在底部右側，文章本身有層次感。

2. 易操作性

1. 盡可能減少使用者的“無用操作”和“重復性”操作，從而減少使用者體力消耗和疲勞積累，以增加產品舒適度和使用時長。如QQ對接的“表情包api”就可以幫助用戶省略了“找圖->保存->發(fā)圖”這一不屬于產品本身的無用操作。而“上滑發(fā)圖”則減少了用戶“選擇圖片”的重復性操作；
2. 考慮用戶身體條件，以最適合勞苦大眾的方式呈現(xiàn)出產品的操作內容。如《王者榮耀》的“輪盤施法”，革新了手游moba的操作方式，玩家不再需要很高的手速去快速點擊技能，只需要簡單滑動；
3. 考慮用戶身體和姿態(tài)，單手還是雙手，站姿坐姿還是臥姿，以視頻播放來說，橫過手機全屏播放是最通常的做法，所以設計出了自動轉屏。但是也存在側臥看視頻的情況，而這時手機的陀螺儀處于手機的上下位，這時候的自動轉屏則會使用戶崩潰，解決方案也很簡單，一個鎖定按鈕，順帶還解決了“手殘黨”的誤操作。

3. 簡易性

1. 最小干擾項，消除臨時的設計保證產品重點突出，該是顯示內容的地方就絕對不要弄些亂七八糟的特效；
2. 導引清晰明了，以“對話式導引”來說，引導用戶左滑屏幕，很多人對于左滑的定義是不一樣的“從左往右”“向左”這些情況都可能出現(xiàn)，所以最好配上箭頭或手勢清晰的告知用戶滑動方式，如網(wǎng)易云音樂就做的很好。

4. 包容性

自我更正功能，如微信的話費充值的號碼提示；

邏輯正確且性能穩(wěn)定的頁面擴展流程；

明確的提示信息和操作錯誤后的進一步引導，如未購物時查看購物車則使用“局部類型空白頁導引”引導用戶去商品購買頁面。

四、無障礙的實際使用

無障礙的最終目的說到底就是：提升盡可能多的用戶群體的體驗。從這個角度出發(fā)去考慮或許更容易。

案例：表單驗證的錯誤提示

在用戶提交一個表單的時候為了避免用戶錯誤提交無用內容甚至聯(lián)合查詢或sql注入，通常會進行前端正則或進行驗證。而在這個過程中必然存在對用戶進行報錯提示。

如何做好表單的無障礙設計也是一個很頭大的問題。

我們來看下面的表單：

這個表單是一個有錯誤驗證機制，但是沒有用戶反饋的表單，用戶只知道自己的表單點了提交沒有動靜，卻不知到是哪里錯了。

再看這個表單，嘗試在郵件欄隨便輸入點什么東西再點擊提交，可以看到它的錯誤提示。這就是從文字方面進行的一個很好無障礙設計。當然，或許會有人覺得這樣的文字提示比較臃腫，那么我們不妨從顏色上進行區(qū)分。

成功，警告，錯誤分別使用不同的顏色來表示，這樣對于大多數(shù)用戶人群而言似乎更能一眼發(fā)現(xiàn)自己填寫時的問題。

但是如果對于色弱，色盲等用戶群體而言，他們看到的可能是這樣的，還比不上之前的文字描述來的實在，對于他們的無障礙化我們應該怎么做呢？

我們可以對表單添加額外的圖標，在刪除了文字多余的評論的同時又保證了色覺障礙人群能夠直觀的發(fā)現(xiàn)自己填寫的表單中的錯誤部分。

這樣對于視覺障礙人群來說是不是看起來比之前清晰多了？

這里同時使用了三種視覺線索來區(qū)分錯誤，顏色，符號，文字，哪怕?lián)p失兩種也能夠正常操作。

案例：app注冊登錄邏輯

這是我目前正在做的一個項目的注冊登錄的局部邏輯，我拿出來分享給大家。

先簡單梳理一下我的項目的注冊登錄邏輯：

再看一下頁面原型：

先看一下具備的功能元素：

1. 手機號碼輸入文本框
2. 短信驗證碼發(fā)送按鈕
3. 短信驗證碼填寫文本框
4. 第三方登錄按鈕

可能有點人會奇怪：為什么沒有登錄按鈕？甚至于沒有圖標提示？這是不是與前面說到的四個要素相違背了？

由于某些眾所周知的原因，獲取用戶手機的某些權限已經(jīng)是一個很常見的事情了，那么如何讓用戶毫無反感的給出權限，這可以從無障礙思維的最終目的——提升體驗下手。

看一下詳細需求：

1. 手機號碼前端正則校驗，校驗通過后；
2. ”發(fā)送短信“由{禁用}變?yōu)閧可點}。
3. 若輸入不為手機號碼則提示文案（請輸入正確手機號）

剖析一下這個需求里包含了哪些無障礙：

易讀性：文案1（輸入手機號碼）；文案2（請輸入正確手機號碼）。文案1用來直接了當告知用戶你應該做什么，文案2也直接了當告知用戶你做錯了什么又應該怎么做。

或許有人問為什么文案2不需要分為：你的手機號碼位數(shù)不對，你的手機號碼號段不對等提示？

這里又涉及到簡易性了，考慮到用戶心智的邊界，只要能下載打開app的用戶必定具備輸入和辨別手機號的能力。又考慮到用戶習慣，用戶在手機號碼輸入錯誤且一眼看不出錯誤點何在的情況下必定是直接重新輸入而非花費大量精力去改正。

包容性：短信按鈕在手機號校驗通過后才變?yōu)榭牲c，最大程度上避免了用戶對錯誤號碼發(fā)送短信驗證碼，從而對產品以及用戶體驗造成破壞。對產品來說每一條無效的驗證碼都是在增加成本，對用戶來說操作而無回應無疑是最大的傷害。

需求：

1. 點擊發(fā)送短信后出現(xiàn)滑塊提示，拖動滑塊后變?yōu)槠磮D驗證。
2. 拼圖成功顯示所用時間， 小于3s即為成功，大于3s則刷新拼圖并提示用戶再試一次。
3. 成功后則彈窗消失并自動發(fā)送短信，文案變?yōu)椋▄時間}后重新發(fā)送）成功發(fā)送短信后彈窗索要權限{讀取電話和短信}，彈窗文案提示（需要讀取您的短信驗證碼并自動登錄），自動填入驗證碼并自動登錄。
4. 若權限被拒絕則提示用戶手動輸入，輸入后自動登錄。

易讀性：這個方面我就不詳細說了，每一步指令都寫的非常明確

易操作性：較大的按鈕可以讓用戶在手機上輕松操作。用戶已經(jīng)操作過的步驟絕對不讓他重復操作，用戶可以不操作的步驟絕對不讓他去操作。

簡易性：采用滑塊瞬變拼圖驗證而非驗證碼，在更好的阻攔機器人惡意調用接口的同時又降低了用戶的識別和輸入成本，對用戶操作來說，點擊和滑動遠比輸入輕松的多。

包容性：用戶的人機驗證操作在獨立彈窗中進行，不影響用戶已填寫內容。獲取權限的方式由“一言不合要你權限”變成了有依有據(jù)的請求權限。

五、總結

無障礙的思維其實真的很容易理解，說白了就是俗話說的“怎么簡單怎么來”。

但是無障礙做起來卻很難，需要脫離固有的思維模式去嘗試打開新奇的腦洞。

或許，無障礙最核心的精髓就在一個“無”字上，當什么都沒有的時候自然也不會有障礙，但是如果控制不好這個“什么都沒有”也會變的全是障礙。

作者：萌新世紀，一只正在找校招坑位的小萌新

本文由 @萌新世紀 原創(chuàng)發(fā)布于人人都是產品經(jīng)理，未經(jīng)作者許可，禁止轉載。

題圖來自Unsplash，基于CC0協(xié)議。