Hãy nghĩ về trang web hoặc ứng dụng mà bạn yêu thích. Điều gì khiến bạn yêu thích trang web hoặc ứng dụng đó? Giờ hãy nghĩ về một trang web hoặc ứng dụng mà bạn không thích. Bạn không thích điều gì về sản phẩm? Cách người dùng tương tác với thiết kế của bạn và trải nghiệm của họ trên trang web và ứng dụng có thể khác nhau.
Trải nghiệm đó có thể thay đổi dựa trên thời gian trong ngày, loại thiết bị được sử dụng, việc họ có ngủ đủ giấc vào đêm hôm trước hay không, họ có khoẻ hay không, họ có đang sử dụng công nghệ hỗ trợ hay không, v.v. Với gần 8 tỷ người trên toàn thế giới, khả năng mọi người sử dụng và trải nghiệm thiết kế của bạn là vô hạn.
Thiết kế bao trùm
Làm cách nào để chúng ta có thể giải quyết tất cả nhu cầu tiềm ẩn của người dùng cùng một lúc? Nhập thiết kế bao trùm. Thiết kế toàn diện sử dụng phương pháp lấy con người làm trung tâm, kết hợp tính toàn diện, khả năng hữu dụng và khả năng tiếp cận thành một.
Và không giống như thiết kế phổ quát tập trung vào một thiết kế mà nhiều người có thể sử dụng nhất có thể, các nguyên tắc thiết kế bao gồm tập trung vào việc thiết kế cho một cá nhân hoặc trường hợp sử dụng cụ thể, sau đó mở rộng thiết kế đó cho những người khác.
Có 7 nguyên tắc thiết kế toàn diện tập trung vào khả năng hỗ trợ tiếp cận:
- Cung cấp trải nghiệm tương đương: Đảm bảo giao diện của bạn mang lại trải nghiệm đồng đều cho tất cả mọi người, để mọi người có thể hoàn thành công việc theo cách phù hợp với nhu cầu của họ mà không làm giảm chất lượng nội dung.
- Xem xét tình huống: Đảm bảo giao diện của bạn mang lại trải nghiệm có giá trị cho mọi người, bất kể họ trong hoàn cảnh nào.
- Nhất quán: Sử dụng các quy ước quen thuộc và áp dụng chúng một cách hợp lý.
- Cấp quyền kiểm soát: Đảm bảo mọi người có thể truy cập và tương tác với nội dung theo cách họ muốn.
- Cung cấp lựa chọn: Hãy cân nhắc cung cấp nhiều cách để mọi người hoàn thành nhiệm vụ, đặc biệt là những nhiệm vụ phức tạp hoặc không theo tiêu chuẩn.
- Ưu tiên nội dung: Giúp người dùng tập trung vào các tác vụ, tính năng và thông tin cốt lõi bằng cách sắp xếp các phần tử này theo thứ tự ưu tiên trong nội dung và bố cục.
- Tăng giá trị: Hãy xem xét mục đích và tầm quan trọng của các tính năng cũng như cách các tính năng đó cải thiện trải nghiệm cho nhiều người dùng.
Cá tính
Khi phát triển một thiết kế hoặc tính năng mới, nhiều nhóm dựa vào nhân vật người dùng để hướng dẫn họ trong suốt quá trình. Personas là những nhân vật hư cấu sử dụng sản phẩm kỹ thuật số của bạn, thường dựa trên nghiên cứu định lượng và định tính về người dùng.
Chân dung độc giả cũng đưa ra một cách nhanh chóng và ít tốn kém để kiểm thử và ưu tiên các tính năng đó trong suốt quá trình thiết kế và phát triển. Các chỉ số này giúp tập trung vào các quyết định liên quan đến các thành phần của trang web bằng cách thêm một lớp cân nhắc thực tế vào cuộc trò chuyện để giúp điều chỉnh chiến lược và tạo mục tiêu tập trung vào các nhóm người dùng cụ thể.
Tích hợp tính năng hỗ trợ người khuyết tật
"Mỗi người đều khác nhau. Tôi chỉ có thể nói dựa trên trải nghiệm của mình. Khi bạn gặp một người khiếm thính, tức là bạn đã gặp một người khiếm thính chứ không phải tất cả chúng tôi".
Meryl Evans trong buổi trò chuyện ID24 Công nghệ dành cho người khiếm thính: Du hành xuyên thời gian từ quá khứ đến tương lai.
Chân dung độc giả có thể được dùng như một công cụ thiết kế dành cho tất cả mọi người khi bạn kết hợp những người khuyết tật vào chân dung của mình. Có nhiều cách để thực hiện việc này. Bạn có thể tạo nhân vật cụ thể về khuyết tật, thêm khuyết tật vào nhân vật người dùng hiện có hoặc thậm chí tạo một phổ nhân vật để phản ánh thực tế linh động của các khuyết tật tình huống, tạm thời và vĩnh viễn.
Bất kể bạn kết hợp người khuyết tật vào nhân vật của mình như thế nào, họ không được dựa trên người thật hoặc định kiến. Và hồ sơ nhân khẩu học không bao giờ thay thế được hoạt động kiểm thử người dùng.
- Tên: Jane Bennet
- Độ tuổi: 57 tuổi
- Vị trí: Essex, Vương quốc Anh
- Nghề nghiệp: Kỹ sư trải nghiệm người dùng
- Tật tật: Chứng run tay do bệnh Parkinson khởi phát sớm (YOPD)
- Mục tiêu: sử dụng tính năng nhập liệu bằng giọng nói để dễ dàng thêm đề xuất mã; tìm thiết bị đi xe đạp trên mạng với số lần nhấn phím tối thiểu.
- Điều gây khó chịu: trang web thiếu tính năng hỗ trợ chỉ bằng bàn phím; ứng dụng có thiết kế với các khu vực nhỏ để tương tác bằng thao tác chạm.
Là một kỹ sư trải nghiệm người dùng, Jane thiết kế và xây dựng các trang quan trọng để giữ cho trang web của công ty cô luôn phù hợp. Cô hỗ trợ nhiều thành viên trong nhóm trong suốt cả ngày. Bà là nữ hoàng của việc chữa cháy kỹ thuật và mọi người trong bộ phận đều cần đến khi có sự cố bất ngờ.
Cô mất đi các kỹ năng vận động tinh tế do chứng run khiến cô ngày càng khó sử dụng chuột. Cô ấy ngày càng dựa vào bàn phím để di chuyển trên web. Jane luôn chú trọng vào thể hình thể chất của mình. Cô thích đua xe đường trường và BMX. Điều này càng trở nên khó khăn hơn khi cô được chẩn đoán mắc bệnh Parkinson khởi phát sớm vào năm ngoái.
Mô phỏng người khuyết tật
Hãy hết sức thận trọng khi sử dụng trình mô phỏng khuyết tật để mô phỏng hoặc bổ sung tính cách của bạn.
Trình mô phỏng khuyết tật là một con dao hai lưỡi vì có thể tạo sự đồng cảm hoặc sự cảm thông. Điều này có thể phụ thuộc vào từng cá nhân, bối cảnh sử dụng trình mô phỏng và nhiều yếu tố không thể kiểm soát khác. Nhiều người ủng hộ tính năng hỗ trợ tiếp cận phản đối việc sử dụng các công cụ mô phỏng khuyết tật và đề xuất tìm kiếm phim, bản minh hoạ, hướng dẫn và nội dung khác do người khuyết tật tạo ra, đồng thời tìm hiểu trực tiếp trải nghiệm của họ.
"Tôi nghĩ chúng ta cần phải hoàn toàn trung thực rằng bất kỳ hoạt động mô phỏng nào cũng không ảnh hưởng đến một số hiểu biết quan trọng nhất mà chúng ta muốn người khiếm thị biết trong trái tim và tâm trí của họ. Mù không phải là đặc điểm xác định chúng tôi, mà sự hiểu lầm và kỳ vọng thấp về người mù mới là trở ngại lớn nhất của chúng tôi.
Những hiểu lầm đó tạo ra các rào cản nhân tạo ngăn chúng ta tham gia đầy đủ, và những giới hạn sai lầm đó trở thành một rào cản kìm hãm chúng ta".
Mark Riccbonno, Chủ tịch Liên đoàn người khiếm thị quốc gia.
Các thuật toán tìm tòi về khả năng hỗ trợ tiếp cận
Hãy cân nhắc việc thêm phương pháp phỏng đoán vào quy trình làm việc của bạn khi xây dựng các mẫu người và thiết kế. Heuristics là các quy tắc thiết kế tương tác, được Jakob Nielsen và Rolf Molich giới thiệu vào năm 1990. 10 nguyên tắc này được phát triển dựa trên nhiều năm kinh nghiệm trong lĩnh vực kỹ thuật khả năng hữu dụng và đã được sử dụng trong các chương trình thiết kế và tương tác giữa con người với máy tính kể từ đó.
Chuyển đến năm 2019, nhóm thiết kế tại Deque đã tạo và chia sẻ một bộ phương pháp phỏng đoán tập trung vào khả năng hỗ trợ tiếp cận kỹ thuật số mới. Theo nghiên cứu của họ, có thể tránh được tới 67% lỗi hỗ trợ tiếp cận cho một trang web hoặc ứng dụng khi tính năng hỗ trợ tiếp cận là một phần của quy trình thiết kế. Đó là một tác động lớn có thể xảy ra trước khi chỉ một dòng mã được viết.
Tương tự như bộ phương pháp phỏng đoán ban đầu, có 10 phương pháp phỏng đoán hỗ trợ tiếp cận cần cân nhắc khi lập kế hoạch thiết kế.
- Phương thức và phương thức tương tác: Người dùng có thể tương tác hiệu quả với hệ thống bằng cách sử dụng phương thức nhập mà họ chọn (chẳng hạn như chuột, bàn phím, thao tác chạm, v.v.).
- Điều hướng và tìm đường: Người dùng có thể điều hướng, tìm nội dung và xác định vị trí của họ tại mọi thời điểm trong hệ thống.
- Cấu trúc và ngữ nghĩa: Người dùng có thể hiểu được cấu trúc của nội dung trên mỗi trang và hiểu cách hoạt động trong hệ thống.
- Trạng thái và biện pháp phòng tránh lỗi: Các thành phần điều khiển tương tác có hướng dẫn liên tục, có ý nghĩa để giúp ngăn ngừa lỗi và cung cấp cho người dùng trạng thái lỗi rõ ràng cho biết vấn đề là gì và cách khắc phục bất cứ khi nào lỗi được trả về.
- Độ tương phản và khả năng đọc: Người dùng có thể dễ dàng phân biệt và đọc văn bản cũng như các thông tin có ý nghĩa khác.
- Ngôn ngữ và mức độ dễ đọc: Người dùng có thể dễ dàng đọc và hiểu nội dung.
- Khả năng dự đoán và tính nhất quán: Người dùng có thể dự đoán mục đích của từng thành phần. Bạn có thể thấy rõ mối quan hệ giữa từng phần tử với toàn bộ hệ thống.
- Thời gian và tính năng lưu giữ: Người dùng có đủ thời gian để hoàn thành nhiệm vụ và không mất thông tin nếu hết thời gian (tức là một phiên).
- Di chuyển và nhấp nháy: Người dùng có thể dừng các thành phần trên trang di chuyển, nhấp nháy hoặc có ảnh động. Người dùng không được bị phân tâm hoặc bị các thành phần này gây hại.
- Phương án thay thế bằng hình ảnh và âm thanh: Người dùng có thể truy cập vào các phương án thay thế dựa trên văn bản cho mọi nội dung hình ảnh hoặc âm thanh truyền tải thông tin.
Sau khi hiểu rõ các phương pháp phỏng đoán khả năng hỗ trợ tiếp cận này, bạn có thể áp dụng các phương pháp đó cho một nhân vật hoặc thiết kế bằng cách sử dụng trang tính phương pháp phỏng đoán khả năng hỗ trợ tiếp cận và làm theo hướng dẫn được cung cấp. Bài tập này giúp bạn khai sáng hơn khi thu thập nhiều quan điểm.
Ví dụ về quy trình xem xét định hướng hỗ trợ tiếp cận cho điểm kiểm tra điều hướng và chỉ đường có thể như sau:
| Điểm kiểm tra để điều hướng và tìm đường | Xuất sắc (+2 điểm) | Thẻ và vé (+1 điểm) | Thất bại (-1 pt) | Không áp dụng (0 điểm) |
|---|---|---|---|---|
| Chỉ báo rõ ràng, dễ thấy có được đặt trên tất cả các phần tử đang hoạt động khi chúng nhận được tiêu điểm không? | ||||
| Trang có văn bản tiêu đề có ý nghĩa và thông tin cụ thể về trang trước tiên không? | ||||
| Phần tử tiêu đề trang và H1 có giống nhau hay tương tự nhau không? | ||||
| Có tiêu đề có ý nghĩa cho từng phần chính không? | ||||
| Mục đích của đường liên kết có được xác định chỉ từ văn bản liên kết hay từ ngữ cảnh ngay lập tức của đường liên kết đó? | ||||
| Có cung cấp đường liên kết bỏ qua ở đầu trang không và đường liên kết đó có xuất hiện khi có tiêu điểm không? | ||||
| Việc sắp xếp các thành phần điều hướng có tạo điều kiện cho việc tìm kiếm không? |
Sau khi mọi người trong nhóm xem xét trang hoặc thành phần và tiến hành đánh giá khả năng hỗ trợ tiếp cận theo phương pháp phỏng đoán, tổng số điểm sẽ được tính cho từng điểm kiểm tra. Tại thời điểm này, bạn có thể quyết định cách khắc phục mọi vấn đề phát hiện được hoặc chỉnh sửa mọi thiếu sót quan trọng để hỗ trợ khả năng hỗ trợ tiếp cận kỹ thuật số.
Chú thích hỗ trợ tiếp cận
Trước khi chuyển giao thiết kế cho nhóm phát triển, bạn nên cân nhắc thêm chú thích hỗ trợ tiếp cận.
Nhìn chung, chú thích được dùng để giải thích các lựa chọn mẫu quảng cáo và mô tả các khía cạnh khác nhau của thiết kế. Chú thích hỗ trợ tiếp cận tập trung vào những khía cạnh mà nhà phát triển có thể đưa ra các lựa chọn lập trình dễ tiếp cận hơn theo hướng dẫn của nhóm thiết kế hoặc chuyên gia tập trung vào khả năng hỗ trợ tiếp cận.
Bạn có thể áp dụng chú thích hỗ trợ tiếp cận trong bất kỳ giai đoạn nào của quy trình thiết kế, từ sơ đồ khung đến bản minh hoạ có độ chân thực cao. Các trạng thái này có thể bao gồm luồng người dùng, trạng thái có điều kiện và chức năng. Họ thường sử dụng các biểu tượng và nhãn để đơn giản hoá quy trình và tập trung vào thiết kế.
Các ví dụ minh hoạ thiết kế sau đây là của bộ chú giải hỗ trợ tiếp cận của Indeed.com dành cho Figma.
Tuỳ thuộc vào chương trình thiết kế, bạn sẽ có nhiều bộ khởi động chú thích hỗ trợ tiếp cận để lựa chọn. Hoặc nếu muốn, bạn có thể tạo bộ của riêng mình. Trong cả hai trường hợp, bạn nên quyết định thông tin nào cần được thông báo cho nhóm phụ trách chuyển giao và định dạng nào hiệu quả nhất.
Sau đây là một số khía cạnh cần xem xét đối với chú thích hỗ trợ tiếp cận:
- Màu: bao gồm tỷ lệ tương phản của tất cả các tổ hợp màu khác nhau trong bảng màu.
- Nút và đường liên kết: xác định trạng thái mặc định, di chuột, đang hoạt động, tiêu điểm và bị vô hiệu hoá.
- Đường liên kết bỏ qua: làm nổi bật các khía cạnh thiết kế ẩn và hiển thị cũng như vị trí liên kết đến các khía cạnh đó trên trang.
- Hình ảnh và biểu tượng: thêm đề xuất văn bản thay thế cho các hình ảnh và biểu tượng cần thiết.
- Âm thanh và video: làm nổi bật các khu vực và đường liên kết đến phụ đề, bản chép lời và nội dung mô tả bằng âm thanh.
- Tiêu đề: thêm các cấp có lập trình và bao gồm mọi nội dung trông giống như tiêu đề.
- Điểm đánh dấu: làm nổi bật các phần khác nhau của thiết kế bằng HTML hoặc ARIA.
- Thành phần tương tác: xác định các phần tử có thể nhấp, hiệu ứng di chuột, vùng tiêu điểm.
- Bàn phím: xác định vị trí tiêu điểm bắt đầu (điểm dừng alpha) và thứ tự thẻ sau.
- Biểu mẫu: thêm nhãn trường, văn bản trợ giúp, thông báo lỗi và thông báo thành công.
- Tên có thể hỗ trợ tiếp cận: xác định cách công nghệ hỗ trợ sẽ nhận dạng phần tử.