Thiết kế cho người mù màu, quan tâm nhỏ dành cho 4% dân số thế giới

Bạn có thể sẽ tự hỏi mình sẽ được brief để làm sản phẩm cho nhóm khách hàng này từ đâu nhỉ? Sao mình lại phải băn khoăn vác thêm ưu tư? Gượm đã, khoảng 4% dân số thế giới, 1/12 nam giới, 1/200 nữ giới mắc chứng mù màu. Vậy là hầu hết những lần bạn thiết kế cho một nhóm khách hàng có vẻ đại chúng, thì đã bao gồm trong đó 4 người mù màu trên mỗi 100 người dùng.

Hơn cả trách nhiệm của một người thiết kế trải nghiệm, hành động quan tâm đến từng nhóm nhỏ người dùng, để họ bước ra và bày tỏ khó khăn với bạn như những con người sống động (dù chỉ trong tưởng tượng, dù họ có là 1, 4, hay 50 trên 100), cũng là một điều nhỏ đủ tinh tế nuôi dưỡng tâm hồn nghề nghiệp của chúng mình. Nào, hãy gọi đây là serum dưỡng lòng cho người trong ngành và bắt đầu tìm hiểu nhé.


Chính xác thì mù màu là thế nào?

Thị giác của chúng ta tiếp nhận và trộn ba ánh sáng cơ bản R – Đỏ, G – Xanh lá, B – Xanh dương để tạo ra vô số màu sắc khác nhau. Chức năng này được đảm nhận bởi các tế bào nón trong mắt. Mù màu xảy ra khi các tế bào nón gặp khó khăn trong việc nhận biết 1 trong 3 loại ánh sáng cơ bản trên.

Đây là kết quả của một đột biến trên cặp nhiễm sắc thể giới tính (XX ở nữ và XY ở nam), thường là gen lặng. Điều đó làm cho em bé trai nếu nhận nhiễm sắc thể X từ mẹ có gen bệnh, thì nhiễm sắc thể giới Y nhận từ cha lại không có gen phân biệt màu sắc trội để bù lại. Đây là lý do tỉ lệ nam giới mù màu cao hơn nữ giới.

Dễ hiểu hơn nếu là tớ là con gái, X này không dùng được thì tớ còn X kia, nhưng các cậu trai thì chỉ có 1 X để mà dùng.


Người mù màu nhìn thấy gì?

Hầu hết người mù màu đều nhìn thấy rõ nét, họ cũng không nhìn đời qua màu đen trắng. Chỉ là họ thấy dãy màu ít hơn số đông còn lại.

Rối loạn màu sắc thường gặp nhất là ở cặp đỏ/xanh lá, khiến người bệnh bối rối với các màu có thành phần đỏ hoặc xanh lá.

Nguồn: wearecolorblind.com

Có 3 chứng mù màu thường gặp: Protan – ít nhạy cảm với ánh sáng đỏ, Deuteranopia – ít nhạy cảm với ánh sáng xanh lá và loại ít gặp hơn là Tritanopia – gặp khó khăn với ánh sáng xanh dương và vàng.


Làm thế nào thiết kế thân thiện với người mù màu?


Quy tắc số 1: Sống đơn giản, ít vấn đề

Rắc rối từ đâu thì gỡ trước hết từ đấy. Điều gì ta có nhiều ta cũng sẽ phải bận lòng quản lý chăm nom chúng. Nên thật lòng không đùa đâu, giải pháp tinh gọn đầu tiên và ưu tiên là việc sử dụng tiết chế màu sắc, chú trọng vào độ tương phản và layout thiết kế. Điều này giúp thiết kế của bạn thân thiện với nhiều đối tượng người dùng, không riêng với người mù màu. Về cơ bản, nên giữ bảng màu thiết kế của bạn từ 2 – 3 màu sắc.


Quy tắc số 2: Đời đưa đẩy, nhưng hãy tránh những cặp đôi rắc rối sau

Các cặp màu gây khó khăn cho người dùng mù màu

Người Protan sẽ nhìn chúng thế này.

Người Deuter sẽ nhìn chúng thế này.

Và người Tritanopia sẽ thấy thế này.

Quy tắc số 2: Sống phức tạp hơn một chút: Màu sắc + Gì đấy

Đừng bao giờ chỉ sử dụng đơn lẻ yếu tố màu sắc trong thiết kế để tạo sự phân biệt.

Một ví dụ đơn giản và hiệu quả cao là dấu chấm đơn giản trên Spotify. Năm 2017, nghe được phàn nàn của người dùng Spotify khó khăn khi phân biệt khi nào nút Shuffle và Repeat đang hoạt động, vì chúng chỉ chuyển màu từ xám sang xanh lá. Sự chuyển màu này gần như vô nghĩa với người mù màu. Spotify đã giải quyết vấn đề đơn giản bất ngờ với 1 dấu chấm hiển thị bên dưới các icon này khi chúng được kích hoạt.

Một cách khác, Trello sử dụng thẻ trên các thẻ phân biệt công việc:


Quy tắc số 4: Buộc lòng sống phức tạp – Cẩn thận với bé Huệ

Đùa đấy, ý mình là Hue. Một số trường hợp, bạn sẽ cần hoặc buộc phải sử dụng nhiều màu sắc trong thiết kế. Lúc này, chỉ cần để tâm giả lập và tinh chỉnh màu sắc trên trải nghiệm của người dùng mù màu.

Đầu tiên, mình cùng xem ví dụ về bản độ Sóng Nhiệt – một bản đồ cảnh báo hiện tượng nắng nóng bất thường tại Nhật Bản.

Các nhà tái thiết kế lại bản đồ cần giải quyết bài toán giữ dải màu quen thuộc và dễ nhận biết cho người dùng thường, đồng thời, tạo ra sự phân biệt cho người mù màu. Các nhà thiết kế đã điều chỉnh từng màu (gia giảm các màu trong từng thang) và đây là kết quả:

Bạn có thể dễ dàng tùy chỉnh nhiều, ít sắc R, G, B trong từng màu, và kiểm tra kết quả bằng cách sử dụng chế độ giả lập trong Adobe: Adobe/View/Proof Setup/Color Blindness…


Một số công cụ dành cho bạn

Vậy là chúng ta đã đi qua những quy tắc thiết kế rất đơn giản để hỗ trợ được nhiều người dùng hơn. Đừng quên bốn chuyện giản đơn này nhé:

  • Đơn giản trong thiết kế.
  • Tránh những cặp đôi màu hoàn cảnh.
  • Sử dụng biểu tượng, hoạt tiết bên cạnh màu sắc.
  • Cân chỉnh và cẩn thận với thiết kế nhiều màu.

Một lời cảm ơn vì bạn đã đọc bài viết này, từ 4% dân số thế giới, và 4% người dùng thiết kế của bạn.

Nguồn: weareblindcolor.com, qz.com, wistia.com
Dịch và tổng hợp: Liu May

Cùng tác giả

#Tag

blind color color theory liumay lý thuyết màu sắc màu sắc ux ux design

iDesign Must-try

Cheryl Vo: ‘Trước khi thiết kế, mình luôn hỏi tại sao?’
Cheryl Vo: ‘Trước khi thiết kế, mình luôn hỏi tại sao?’
Tính khái niệm trong Design Decisions (tạm dịch: Quyết định thiết kế) của một thiết kế hay là hành trình những cảm xúc Cheryl Vo sẽ được mở khóa từ…
7 yếu tố thị giác cơ bản trong nghệ thuật và thiết kế: Màu sắc
7 yếu tố thị giác cơ bản trong nghệ thuật và thiết kế: Màu sắc
Màu sắc là yếu tố thị giác tạo ra hiệu ứng mạnh nhất tới cảm xúc của chúng ta. Chúng ta sử dụng màu sắc để tạo ra tâm trạng…
Synesthetic Letters: khi con chữ được nhuộm màu trong tiềm thức
Synesthetic Letters: khi con chữ được nhuộm màu trong tiềm thức
Trong thế giới của những người mắc hội chứng Synesthesia, các giác quan thường dược liên kết chặt chẽ với nhau. Dự án Synesthetic Letters của Dasha Pears và Jane…
Thiết kế tương tác (Interaction Design) là gì?
Thiết kế tương tác (Interaction Design) là gì?
Thiết kế tương tác là một thành phần quan trọng trong chiếc ô khổng lồ của thiết kế trải nghiệm người dùng (UX). Trong bài viết này, hãy cùng iDesign tìm…
Tư duy thiết kế và những tính chất trong hệ thống
Tư duy thiết kế và những tính chất trong hệ thống
Một cách cơ bản hơn để đối phó với tính chất tạm thời của công việc là xem xét lại bản thân chúng ta với tư cách là nhà thiết…
7 hiện tượng tâm lý người dùng trong thiết kế UX
7 hiện tượng tâm lý người dùng trong thiết kế UX
Đừng trở nên xấu xa và lạm dụng tâm lý học để thao túng người dùng cuối của bạn. Khi nhìn vào meme thú vị này, bạn có tự hỏi…