it-swarm.asia

Warna apa yang harus dipilih sebagai "bahaya" jika warna utama aplikasi saya adalah merah

Saya memiliki pertanyaan ini melilit kepala saya untuk beberapa waktu. Masalahnya adalah aplikasi utama saya memiliki tema warna merah. Dan untuk membatalkan saja tombol yang saya gunakan hanya menggunakan warna abu-abu tapi sekarang saya membutuhkan warna "bahaya" ... Apa yang harus saya gunakan? Ungu? Jeruk? Menggunakan merah lagi canggung, mungkin merah lebih gelap?

PD: Saya tidak bisa menggunakan warna biru karena itu warna pesaing kami.

enter image description here

56
caravana_942

Saya pikir Anda perlu bermain-main. Jika layar Anda berwarna merah dan Anda akan menggunakan peringatan atau Bahaya. Saya punya saran berikut:

1- Anda masih dapat menggunakan warna merah tetapi dalam derajat yang berbeda untuk membedakan antara warna aplikasi dan tindakan bahaya Anda.

2- Anda dapat menggunakan sembulan putih murni dan, menerapkan ikon merah , tanda seru atau tanda di dalam sembulan ini.

3 - Saran lain adalah untuk menggunakan warna hitam, dan menggunakan tanda putih di atas popup hitam . Ini mungkin sebuah perubahan.

Jika Anda dapat memberi kami layar sistem merah Anda, saya dapat memberi Anda solusi langsung.

enter image description here

101
Khalil Hanna

Daripada berfokus hanya pada warna tombol, lebih baik berfokus pada pengalaman secara keseluruhan untuk tugas tertentu itu. Anda tidak perlu membutuhkan warna bahaya terpisah untuk tombol hapus. Anda dapat menggunakan tombol merah standar Anda, tetapi mendukungnya dengan pesan bahaya lainnya. Seperti ini:

enter image description here

Jika pengguna Anda akan melakukan sesuatu yang berbahaya, lebih baik menggunakan peringatan dan pesan untuk menyoroti bahaya, daripada hanya mengandalkan warna tombol.

Perlu juga dikatakan bahwa tidak ada yang secara inheren berbahaya atau menakutkan tentang aplikasi merah. Saya mendesain untuk Coca-Cola untuk sementara waktu, dan warna merek utama mereka adalah merah. Mereka adalah contoh yang sangat baik tentang bagaimana menerapkan branding merah ke situs web dan aplikasi, jika Anda mencari itu. Mereka terutama menggunakan hitam, abu-abu dan putih sebagai warna aksen mereka.

52
Michael

Satu hal yang mutlak kunci yang perlu diperhatikan di sini:

Jangan hanya mengandalkan warna untuk menyampaikan makna.

Warna berguna untuk menyampaikan pesan visual, tetapi Anda perlu mempertimbangkan aksesibilitas saat membuat keputusan UX semacam ini. Jika pengguna Anda memiliki segala bentuk kebutaan warna atau gangguan visual lainnya, Anda memerlukan beberapa jenis indikator (ikon atau kata-kata) untuk menyampaikan artinya. Fakta bahwa tombol tersebut berjudul Delete bagus, tetapi jika Anda khawatir bahwa itu adalah informasi 'kritis sistem', maka itu perlu disampaikan lebih dari sekadar menggunakan warna sebagai indikator.

Artikel ini mencakup penggunaan warna sehubungan dengan aksesibilitas, dan memiliki paragraf khusus tentang ini:

"... memastikan aksesibilitas dengan memastikan Anda tidak bergantung pada warna untuk menyampaikan informasi sistem yang penting. Jadi, untuk hal-hal seperti status kesalahan, status keberhasilan, atau peringatan sistem, pastikan untuk memasukkan pesan atau ikonografi yang dengan jelas menyebutkan apa yang terjadi di."

Juga, mengingat merah adalah warna utama aplikasi Anda: pastikan Anda menggunakan kontras setidaknya 4.5:1 untuk mematuhi WCAG 2 level AA minimal. Ini adalah alat yang sangat berguna untuk memeriksa bahwa: https://webaim.org/resources/contrastchecker/

35
indextwo

Ketika jumlah opsi yang layak meningkat, mungkin menjadi lebih sulit untuk membuat keputusan akhir. Setelah Anda mempersempitnya menjadi beberapa, Anda dapat mempertimbangkan untuk mengizinkan pengguna memilih skema yang mereka inginkan .

Beberapa skema warna untuk dipertimbangkan:

  • Merah = bahaya = aplikasi Anda berbahaya. Ubah warna utama aplikasi Anda.

  • Biru = warna pesaing. Pesaing = berbahaya. Gunakan warna biru untuk bahaya. Sementara warna biru yang lebih terang mungkin keliru dengan peringatan positif (seperti kesuksesan), warna biru tua mungkin tidak.

  • Gunakan hitam dan putih. Contoh dalam jawaban Khalil Hanna sangat mencolok. Masalahnya adalah hitam/putih mungkin bingung dengan teks biasa. Hitam + oranye/kuning mungkin tidak memiliki masalah yang sama.

  • Gunakan warna standar terlepas dari warna utama tema Anda. Hijau = sukses. Kuning/Oranye = Perhatian. Merah = bahaya/peringatan. Dll.

    Namun, seperti Aline menunjukkan , the Penggunaan Warna Bahan Desain Google menyarankan: "Karena merah adalah warna merek, juga tidak gunakan untuk menyampaikan status kesalahan . Pilih warna peringatan alternatif yang tidak menggunakan pewarnaan merek. " Contoh mereka menggunakan oranye. Tetapi ungu juga tampaknya merupakan pilihan.

    Material Design Example

10
習約塔

"Warna bahaya" harus menonjol dari skema warna aplikasi Anda. Juga baik untuk mempertimbangkan makna. Merah/Oranye/kuning, di sebagian besar budaya, menunjukkan bahaya, waspada, perhatian. Biasanya, jika saya melihat pesan biru atau hijau, saya otomatis berpikir itu adalah umpan balik yang sukses. Saya pikir Anda harus menggunakan oranye atau kuning, untuk menonjol dari warna utama.

Di Google Material Design, mereka menggunakan oranye dengan tema merah: https://material.io/design/color/color-usage.html#meaning

5
Aline

Skema warna pertama yang muncul di benak untuk menunjukkan bahaya adalah kombinasi kuning dan hitam, terutama jika hitam dalam garis-garis diagonal. Saya menduga hubungan dengan bahaya berasal dari lebah di alam.

Cukup mengetik yellow black sign ke Google akan menghasilkan banyak tanda yang mengindikasikan bahaya. Bernyanyi tentang racun, tentang bahaya terjatuh, kaset yang digunakan di sekitar tempat kejadian, dll.

Saya pribadi telah melihat kotak pesan dengan perbatasan bergaris-garis tebal, kuning dan hitam, dan mereka selalu membuat saya berpikir ada sesuatu yang berpotensi berbahaya, kemungkinan keputusan yang mungkin berbahaya untuk dibuat. Melihat tombol dengan segitiga bundar dengan pola yang sama akan memberi tahu saya bahwa saya harus sangat berhati-hati jika saya menekan tombol itu.

Bagi saya, merah polos sebenarnya tidak sekuat itu, dan perlu putih dan hitam untuk sepenuhnya melewati tingkat bahaya yang sama.

5
trlkly

Jika Anda sudah menggunakan warna merah, maka gunakan kuning dan hitam. Ini adalah tanda peringatan alamiah, dan pasti akan menarik perhatian. Ini juga digunakan pada banyak tanda bahaya untuk lokasi konstruksi.

enter image description here

Di negara-negara barat, tidak ada yang secara budaya lebih berbahaya daripada hitam merah:

enter image description here

2
Danielillo

DAPATKAN PERHATIAN

MAKNA KURANGNYA

Warna saja tidak menyampaikan makna, dan dengan sendirinya warna itu tidak dapat diandalkan untuk ekspresi "bahaya" atau "peringatan". Lebih lanjut, gangguan penglihatan seperti Deuteranomaly (6% laki-laki yang terkena) membuat kontras warna tertentu tidak terlihat, belum lagi perbedaan budaya seperti yang disebutkan oleh beberapa orang.

KONTRAS, SIMBOL, dan TEKS

Warna-warna seperti merah, kuning, oranye dipilih bukan karena warna memiliki makna tertentu, tetapi karena warna memberikan kontras warna tertentu, kontras luminance, dan "eye catching," dan dengan demikian menonjol di latar belakang.

Lebih penting untuk memiliki kontras pencahayaan yang memadai, dan untuk menggunakan simbol yang berorientasi perhatian/ketertarikan yang jelas dalam maksudnya.

Kontras luminance tidak bergantung pada kontras warna yang dapat disalahpahami karena gangguan atau perbedaan budaya, dan membantu simbol untuk menonjol. Menggunakan kontras pencahayaan yang lebih tinggi daripada rangsangan di sekitarnya (teks, tombol, dll.) Adalah apa yang akan membantu mendapatkan perhatian dan fokus pengguna.

Kontras warna dapat membantu meningkatkan kesadaran dalam hal pengenalan kognitif peringatan, tetapi harus menjadi pertimbangan desain sekunder. Misalnya, jika pasarnya adalah Amerika Utara, hijau mungkin merupakan pilihan yang buruk untuk peringatan - Tapi hijau dalam kombinasi dengan warna lawannya merah (termasuk ungu) ) menciptakan deteksi Edge yang sangat kuat dalam persepsi visual manusia normal.

Simbol yang dapat dimengerti acan sangat berguna untuk menyampaikan makna dengan cara yang (idealnya) tidak memerlukan terjemahan. Padahal sekali lagi perbedaan budaya mungkin memiliki pengaruh yang kuat.

Di Las Vegas, MGM Grand Hotel awalnya dirancang di mana pintu masuk depan melalui mulut singa berwarna zamrud raksasa. Tak lama setelah pemikiran terbuka, mereka merobeknya dan membangun kembali pintu masuk untuk menghilangkan mulut singa karena mereka menemukan bahwa mulut singa memiliki simbolisme yang sangat negatif dalam beberapa budaya Asia.

Namun, dalam dunia komputer, ada ikon umum yang telah mencapai penerimaan internasional atas makna tertentu - yang dipahami dengan baik biasanya merupakan pilihan yang lebih baik, terutama untuk menyampaikan peringatan.

Teks adalah raja, meskipun perbedaan bahasa. Teks yang jelas dan sederhana adalah cara terbaik untuk menyampaikan makna tertentu. Satu kata dengan pop-up tool-tip informasi tambahan adalah preferensi pribadi saya untuk kegunaan.

Animasi dan gerak akan memengaruhi perhatian jika itu tujuannya. Satu LED merah berkedip di dinding 1000 LED merah pasti akan menarik perhatian Anda misalnya.

TL; DR

Singkatnya, lebih penting untuk memiliki kontras luminans baik/tinggi & teks deskriptif dan simbol daripada kombinasi warna tertentu.

Berikut adalah contoh penggunaan kontras luminance, modifikasi dari tombol hapus contoh Anda vs. tombol simpan:

SAVE DELETE MODIFIED

1
Myndex

Sesuatu yang perlu dipertimbangkan tentang membuat Antarmuka Pengguna adalah --- warna tidak boleh menyampaikan makna. Namun, Anda dapat menyorot tombol yang merusak dengan membuatnya berbeda dari tombol lain atau seluruh antarmuka Anda. Alih-alih memikirkan warna yang dapat Anda gunakan, coba pikirkan tentang bagaimana membuat tombol terlihat berbeda .

Ubah desain

  • Perbatasan - Jika desain Anda saat ini memiliki tombol tanpa batas, coba tambahkan perbatasan hitam atau putih yang sangat berbeda (tebal?). Ini membuat tombol "pop" dari seluruh antarmuka.
  • kuran - Cobalah bermain-main dengan tinggi atau lebar tombol. Ukuran dapat membantu membedakan tombol destruktif dari tombol normal. Tapi itu tidak selalu harus tentang ukuran tombol, mungkin Anda bisa mengubah ukuran font label?
  • Font Style - Berbicara tentang font, bagaimana dengan menambahkan garis bawah, miring, atau tebal pada label untuk membuatnya menonjol?
  • Style - Mungkin menambahkan bayangan atau hanya memiliki batas dan tidak ada warna isian. Bermain dengan desain dan membuatnya terlihat berbeda .

Warna

Sisi kreatif setiap orang berbeda-beda, jadi jika Anda ingin mempertahankan gaya Anda saat ini tetapi ubah warnanya, saya sarankan mencari roda warna untuk warna yang berlawanan dengan merah Anda. Ini akan membantu membuat tombolnya menonjol. Anda juga dapat menekankan tombol dengan memilih warna yang merusak seperti kuning, merah (jelas lebih gelap atau lebih terang), hitam atau putih (jika sesuai dengan desain Anda.)

Desain adalah bagian yang sangat menantang dari proses pengembangan, jadi bermain-main pasti akan membantu. Dapatkan pendapat orang - minta mereka untuk memilih desain. Buat beberapa desain mockup. Saya harap ini membantu.

0
Aaron