it-swarm-vi.tech

Chọn màu nào là "nguy hiểm" nếu màu chính của ứng dụng của tôi là màu đỏ

Tôi có câu hỏi này quấn quanh đầu tôi khá lâu. Có điều là ứng dụng chính của tôi có chủ đề màu đỏ. Và đối với việc hủy các nút, tôi chỉ sử dụng các màu xám nhưng bây giờ tôi cần một màu "nguy hiểm" ... Tôi nên sử dụng cái gì? Màu tím? Trái cam? Sử dụng màu đỏ một lần nữa là khó xử, có thể là màu đỏ đậm hơn?

PD: Tôi không thể sử dụng màu xanh lam vì đó là màu của đối thủ.

enter image description here

56
caravana_942

Tôi nghĩ rằng bạn cần phải chơi xung quanh. Nếu màn hình của bạn màu đỏ và bạn sắp sử dụng cảnh báo hoặc Nguy hiểm. Tôi có những gợi ý sau:

1- Bạn vẫn có thể sử dụng màu đỏ nhưng ở mức độ khác nhau để phân biệt giữa màu ứng dụng và hành động nguy hiểm của bạn.

2- Bạn có thể sử dụng cửa sổ bật lên màu trắng tinh khiết và áp dụng các biểu tượng màu đỏ , dấu chấm than hoặc dấu hiệu trong cửa sổ bật lên này.

3- Một đề xuất khác là sử dụng màu đen và sử dụng các dấu hiệu màu trắng trên cửa sổ bật lên màu đen . Đây có thể là một sự thay đổi.

Nếu bạn có thể cung cấp cho chúng tôi màn hình hệ thống màu đỏ của bạn, tôi có thể cung cấp cho bạn một giải pháp thẳng về phía trước.

enter image description here

101
Khalil Hanna

Thay vì chỉ tập trung vào màu sắc của nút, tốt hơn hết là tập trung vào trải nghiệm nói chung cho nhiệm vụ cụ thể đó. Bạn không nhất thiết cần một màu nguy hiểm riêng cho nút xóa. Bạn có thể sử dụng nút đỏ tiêu chuẩn của mình, nhưng hỗ trợ nó với các tin nhắn nguy hiểm khác. Như thế này:

enter image description here

Nếu người dùng của bạn sắp làm điều gì đó nguy hiểm, tốt hơn là sử dụng cảnh báo và nhắn tin để làm nổi bật mối nguy hiểm, thay vì chỉ dựa vào màu nút.

Cũng đáng nói rằng không có gì nguy hiểm hay đáng sợ về một ứng dụng màu đỏ. Tôi đã thiết kế cho Coca-Cola một thời gian và màu thương hiệu chính của họ là màu đỏ. Chúng là một ví dụ rất hay về cách áp dụng nhãn hiệu màu đỏ cho các trang web và ứng dụng, nếu bạn đang tìm kiếm. Họ chủ yếu sử dụng màu đen, xám và trắng làm màu nhấn.

52
Michael

Một điều hoàn toàn khóa cần lưu ý ở đây:

Đừng chỉ dựa vào màu sắc để truyền đạt ý nghĩa.

Màu sắc rất tiện lợi để truyền tải một thông điệp trực quan, nhưng bạn cần xem xét khả năng tiếp cận khi đưa ra các loại quyết định UX này. Nếu người dùng của bạn có bất kỳ hình thức mù màu hoặc khiếm thị khác, bạn cần một số loại chỉ báo (biểu tượng hoặc từ ngữ) khác để truyền đạt ý nghĩa. Thực tế là nút có tiêu đề Delete rất tuyệt, nhưng nếu bạn lo ngại rằng đó là thông tin 'quan trọng hệ thống', thì điều đó cần được truyền tải theo cách vượt ra ngoài việc sử dụng màu sắc làm chỉ báo.

Bài viết này bao gồm việc sử dụng màu liên quan đến khả năng truy cập và có một đoạn cụ thể về điều này:

"... đảm bảo khả năng truy cập bằng cách đảm bảo bạn không dựa vào màu sắc để chuyển tiếp thông tin hệ thống quan trọng. Vì vậy, đối với những thứ như trạng thái lỗi, trạng thái thành công hoặc cảnh báo hệ thống, hãy đảm bảo kết hợp nhắn tin hoặc biểu tượng để gọi rõ ràng những gì đang diễn ra trên."

Ngoài ra, coi màu đỏ là màu chủ chốt của ứng dụng của bạn: đảm bảo rằng bạn đang sử dụng độ tương phản ít nhất 4.5:1 để tuân thủ WCAG 2 cấp độ AA ở mức tối thiểu. Đây là một công cụ thực sự tiện dụng để kiểm tra xem: https://webaim.org/resource/contrastchecker/

35
indextwo

Khi số lượng các lựa chọn khả thi tăng lên, việc đưa ra quyết định cuối cùng có thể trở nên khó khăn hơn. Khi bạn đã thu hẹp nó xuống một vài, bạn có thể xem xét cho phép người dùng chọn lược đồ họ thích .

Một số cách phối màu để xem xét:

  • Đỏ = nguy hiểm = ứng dụng của bạn là nguy hiểm. Thay đổi màu chính của ứng dụng của bạn.

  • Màu xanh = màu của đối thủ cạnh tranh. Đối thủ cạnh tranh = nguy hiểm. Sử dụng màu xanh lam cho nguy hiểm. Trong khi màu xanh nhạt hơn có thể bị nhầm lẫn với cảnh báo tích cực (chẳng hạn như thành công), màu xanh đậm có thể không.

  • Sử dụng màu đen và trắng. Các ví dụ trong câu trả lời của Khalil Hanna rất ấn tượng. Vấn đề là đen/trắng có thể bị nhầm lẫn với văn bản thông thường. Đen + cam/vàng có thể không có cùng một vấn đề.

  • Sử dụng màu tiêu chuẩn bất kể màu chính của chủ đề của bạn. Xanh = thành công. Vàng/Cam = Thận trọng. Đỏ = nguy hiểm/cảnh báo. Vân vân.

    Tuy nhiên, như Aline chỉ ra , Cách sử dụng màu thiết kế vật liệu của Google khuyên: "Vì màu đỏ là màu của thương hiệu, cũng không sử dụng nó để truyền đạt trạng thái lỗi . Chọn màu cảnh báo thay thế không sử dụng màu thương hiệu. " Ví dụ của họ sử dụng màu cam. Nhưng màu tím có vẻ là một lựa chọn khả thi là tốt.

    Material Design Example

10
習約塔

"Màu nguy hiểm" phải nổi bật so với bảng màu của ứng dụng. Nó cũng tốt để xem xét ý nghĩa. Đỏ/Cam/vàng, trong hầu hết các nền văn hóa, biểu thị sự nguy hiểm, cảnh giác, chú ý. Thông thường, nếu tôi thấy một thông điệp màu xanh hoặc màu xanh lá cây, tôi tự động nghĩ rằng đó là một phản hồi thành công. Tôi nghĩ bạn nên sử dụng màu cam hoặc vàng, để nổi bật so với các màu chính.

Trong Thiết kế Vật liệu của Google, họ sử dụng màu cam với chủ đề màu đỏ: https: // m Material.io/design/color/color-usage.html#meaning

5
Aline

Phối màu đầu tiên xuất hiện trong đầu để chỉ ra sự nguy hiểm là sự kết hợp giữa màu vàng và màu đen, đặc biệt nếu màu đen nằm trong các đường chéo. Tôi nghi ngờ sự liên quan với nguy hiểm đến từ những con ong trong tự nhiên.

Chỉ cần gõ yellow black sign vào Google sẽ dẫn đến rất nhiều dấu hiệu cho thấy sự nguy hiểm của một loại nào đó. Hát về chất độc, về nguy cơ rơi ra, băng được sử dụng xung quanh hiện trường vụ án, vv.

Cá nhân tôi đã nhìn thấy các hộp tin nhắn với đường viền sọc chéo dày, màu vàng và đen, và chúng luôn khiến tôi nghĩ rằng có một thứ gì đó có khả năng nguy hiểm, có thể là một quyết định nguy hiểm có thể được đưa ra. Nhìn thấy một nút có hình tam giác tròn với cùng một mẫu sẽ cho tôi biết rằng tôi nên rất thận trọng nếu tôi nhấn nút đó.

Đối với tôi, màu đỏ trơn không thực sự mạnh như vậy, và sẽ cần màu trắng và đen để hoàn toàn vượt qua cùng một mức độ nguy hiểm.

5
trlkly

Nếu bạn đã sử dụng màu đỏ, sau đó sử dụng màu vàng và đen. Đó là một dấu hiệu cảnh báo tự nhiên của tự nhiên, và chắc chắn sẽ thu hút sự chú ý. Nó cũng được sử dụng trên nhiều dấu hiệu nguy hiểm cho các công trường xây dựng.

enter image description here

Ở các nước phương tây, không có gì nguy hiểm về mặt văn hóa hơn màu đen trên màu đỏ:

enter image description here

2
Danielillo

NHẬN ĐƯỢC SỰ CHÚ Ý

MÀU SẮC CÓ Ý NGH! A

Màu sắc một mình không truyền đạt ý nghĩa, và như vậy, không nên dựa vào bất kỳ biểu hiện nào của "nguy hiểm" hoặc "cảnh báo". Hơn nữa, suy giảm thị lực như Deuteranomaly (6% nam giới bị ảnh hưởng) làm cho màu sắc nhất định tương phản vô hình, không đề cập đến sự khác biệt văn hóa như một số đã đề cập.

HỢP ĐỒNG, BIỂU TƯỢNG và VĂN BẢN

Các màu như đỏ, vàng, cam được chọn không phải vì màu này có ý nghĩa cụ thể, mà vì màu này cung cấp độ tương phản màu nhất định, độ tương phản độ chói và "bắt mắt", do đó nổi bật so với nền.

Điều quan trọng hơn là phải có độ tương phản độ sáng đầy đủ và sử dụng các biểu tượng hướng sự chú ý/thu hút rõ ràng trong ý định của chúng.

Độ tương phản độ chói không phụ thuộc vào độ tương phản màu sắc có thể bị sai lệch do suy yếu hoặc khác biệt văn hóa và giúp biểu tượng nổi bật. Sử dụng độ tương phản độ chói cao hơn các kích thích xung quanh (văn bản, nút, v.v.) là những gì sẽ giúp thu hút sự chú ý và tập trung của người dùng.

Độ tương phản màu có thể giúp tăng nhận thức về mặt nhận thức cảnh báo, nhưng nó phải được xem xét thiết kế thứ cấp. Chẳng hạn, nếu thị trường là Bắc Mỹ, màu xanh lá cây có thể là một lựa chọn tồi cho cảnh báo - Nhưng màu xanh lá cây kết hợp với màu đỏ của đối thủ (bao gồm cả màu tím ) tạo ra phát hiện Edge rất mạnh trong nhận thức thị giác bình thường của con người.

Các ký hiệu có thể hiểu được acan rất hữu ích để truyền đạt ý nghĩa theo cách mà (lý tưởng) không yêu cầu dịch. Mặc dù một lần nữa sự khác biệt văn hóa có thể có một ảnh hưởng mạnh mẽ.

Ở Las Vegas, MGM Grand Hotel ban đầu được thiết kế nơi lối vào phía trước thông qua miệng sư tử màu ngọc lục bảo khổng lồ. Ngay sau khi mở suy nghĩ, họ xé nó xuống và xây dựng lại lối vào để loại bỏ miệng sư tử vì họ phát hiện ra rằng miệng sư tử có một biểu tượng đặc biệt tiêu cực trong một số nền văn hóa châu Á.

Tuy nhiên, trong lĩnh vực máy tính, có những biểu tượng phổ biến đã đạt được sự chấp nhận quốc tế về một số ý nghĩa nhất định - được hiểu rõ thường là sự lựa chọn tốt hơn, đặc biệt là để truyền đạt một cảnh báo.

Văn bản là vua, khác biệt về ngôn ngữ. Văn bản rõ ràng và đơn giản là cách tốt nhất để truyền đạt một ý nghĩa cụ thể. Một từ duy nhất với công cụ bật lên - thông tin bổ sung là sở thích cá nhân của tôi về tính khả dụng.

Hoạt hình và chuyển động sẽ ảnh hưởng đến sự chú ý nếu đó là mục tiêu. Một đèn LED đỏ nhấp nháy trên tường gồm 1000 đèn LED đỏ chắc chắn sẽ thu hút sự chú ý của bạn chẳng hạn.

TL; DR

Nói tóm lại, điều quan trọng là phải có văn bản và biểu tượng mô tả độ tương phản tốt/độ chói cao hơn bất kỳ sự kết hợp màu sắc cụ thể nào.

Đây là một ví dụ về việc sử dụng độ tương phản độ chói, một sửa đổi của nút xóa ví dụ của bạn so với nút lưu:

SAVE DELETE MODIFIED

1
Myndex

Một cái gì đó để xem xét về việc tạo Giao diện người dùng là màu sắc không bao giờ nên truyền đạt ý nghĩa. Tuy nhiên, bạn có thể làm nổi bật các nút phá hoại bằng cách làm cho chúng khác với các nút khác hoặc phần còn lại của giao diện của bạn. Thay vì suy nghĩ về màu sắc bạn có thể sử dụng, hãy thử nghĩ về cách làm cho nút trông khác nhau .

Thay đổi thiết kế

  • Biên giới - Nếu thiết kế hiện tại của bạn có các nút không có viền, hãy thử thêm một viền đen hoặc trắng rất khác biệt (dày?). Điều này làm cho nút "bật" từ phần còn lại của giao diện.
  • Kích thước - Thử chơi xung quanh với chiều cao hoặc chiều rộng của nút. Kích thước có thể giúp phân biệt các nút phá hoại từ các nút bình thường. Nhưng nó không phải luôn luôn có kích thước của nút, có lẽ bạn có thể thay đổi kích thước phông chữ của nhãn?
  • Kiểu chữ - Nói về phông chữ, làm thế nào về việc thêm một gạch chân, in nghiêng hoặc in đậm vào nhãn để làm cho nó nổi bật?
  • Kiể - Có thể thêm bóng hoặc chỉ có viền và không tô màu. Chơi với thiết kế và làm cho nó trông khác .

Màu sắc

Mặt sáng tạo của mọi người khác nhau, vì vậy nếu bạn muốn giữ phong cách hiện tại của mình nhưng thay đổi màu sắc, tôi khuyên bạn nên nhìn vào một bánh xe màu cho các màu đối diện với màu đỏ của bạn. Điều này sẽ giúp làm cho nút nổi bật. Bạn cũng có thể nhấn mạnh nút bằng cách chọn các màu phá hủy như vàng, đỏ (rõ ràng là tối hơn hoặc nhạt hơn), đen hoặc trắng (nếu phù hợp với thiết kế của bạn.)

Thiết kế là một phần rất thách thức của quá trình phát triển, vì vậy chơi xung quanh chắc chắn sẽ giúp ích. Lấy ý kiến ​​của mọi người - khiến họ chọn một thiết kế. Thực hiện một số thiết kế mockup. Tôi hy vọng điều này sẽ giúp.

0
Aaron