Saya ingin memberi masing-masing 10 pemain warna pengenal yang unik. Apakah ada rangkaian warna yang optimal untuk ini? Bagaimana cara saya membuatnya?
Setiap set yang saya buat mengandung warna yang terlalu mirip.
Pembaruan: Saya ditanya di bawah ini untuk apa (pertanyaan wajar). Sekarang saya dapat memberitahu Anda - Windwardopolis dan warnanya bekerja dengan baik.
multiplayer
color
usability
David Thielen
sumber
sumber
Jawaban:
Anda bisa menghasilkan nilai rona yang sama dalam ruang HSV:
Namun, mungkin saja Anda tidak selalu memiliki 10 pemain. Dalam hal ini, palet tidak akan sangat efisien kecuali Anda membuat palet berbeda untuk jumlah pemain lain. Sebagai gantinya, beberapa penulis merekomendasikan membuat palet menggunakan rasio emas, mengambil keuntungan dari properti yang dihasilkan dari teorema pemerataan :
Dengan begitu, bahkan jika Anda berhenti di 3 atau 4 atau 7 pemain, Anda mendapatkan penyebaran rona yang sangat baik.
Banyak bilangan irasional yang dapat digunakan, tetapi rasio emas akan bekerja paling baik (telah terbukti ).
Akhirnya, Anda dapat menggunakan dua urutan pembuatan yang berbeda untuk mengubah
S
atauV
, juga. Misalnya ( edit : Saya menambahkansqrt
panggilan untuk pemerataan yang lebih baik ):Pembaruan : hasil di atas dapat ditingkatkan dengan menggunakan kurva koreksi untuk
H
(mirip dengan kurva gamma untuk komponen RGB) yang memperhitungkan sistem visual manusia. Ini adalah kurva koreksi rona yang saya hitung menggunakan metrik CIEDE2000 :Hasil untuk nilai rona yang sama adalah sebagai berikut:
Dan untuk urutan generasi rasio emas (dengan dan tanpa tweak
V
):Saya akan menerbitkan perkiraan rumus kurva untuk digunakan dalam program segera setelah saya menemukan yang cukup bagus.
sumber
8 warna StarCraft adalah :
Obv. Blizzard adalah jenius UI dan telah mempelajari masalahnya.
Mereka meninggalkan Green sebagai pertukaran untuk Brown di peta gurun, jadi secara teknis ada 9 yang terdaftar di sana.
The 12 Warcraft 3 warna:
Begini tampilannya:
Seperti yang Anda lihat, mereka sangat berbeda dan mudah dibedakan. Hijau tua sebenarnya mudah dibedakan dari hijau, mungkin karena mata manusia paling mudah membedakan warna hijau. Jika Anda yakin para pemain Anda adalah tetrachromat betina Anda mungkin bisa memilih warna apa pun.
sumber
Beberapa orang di sini merekomendasikan membagi ruang warna HSV pada 10 posisi yang sama pada rona. Menurut saya, ini sebenarnya bukan solusi yang baik. Mata manusia tidak merasakan perbedaan warna secara sama di seluruh spektrum HSV. Sebagai contoh, apa yang kami sebut oranye menempati sepotong kecil band, sedangkan potongan 25% yang baik mungkin memenuhi syarat sebagai hijau. Jadi itu dimulai dengan premis yang buruk. Lihatlah deretan warna pertama dalam jawaban ini . Kedua sayuran itu hampir tidak bisa dibedakan.
Ingat pengguna Anda perlu berkomunikasi tentang dan merujuk ke warna. Dalam terang ini, tema Starcraft / Warcraft adalah petunjuk utama untuk diikuti. Memilih berdasarkan pada daftar warna-warna bahasa Inggris Crayola yang sederhana bukanlah ide yang buruk sama sekali, karena Anda akan berakhir dengan warna-warna bernama yang sudah dikenal. Kemudian, atur saja warna-warna itu menjadi tebal, tidak bersuara, apa pun yang cocok dengan estetika Anda, selama masih dikenali sebagai Merah, Oranye, Kuning, Hijau, Biru, Ungu, Coklat, Abu-abu, Putih, Hitam.
Sunting: koneksi antara bahasa dan persepsi warna sangat menarik, saya hanya ingin membagikan tautan yang mengagumkan ini:
The crayola-fication dunia: Bagaimana kami memberi nama warna, dan itu mengacaukan otak kami di Empirical Zeal
sumber
Saya pikir saya perlu memecah pendekatan "simbol" ini menjadi jawaban yang terpisah.
Kembali pada hari itu, saya berasumsi orang-orang membutuhkan bendera dan barang-barang untuk dengan mudah mengidentifikasi jalan tentara di kejauhan, sehingga Anda tahu apakah akan menyerang atau bertahan (jika ada musuh), atau merasa lega (dalam kasus sekutu).
Jadi, kebetulan itulah yang ingin Anda lakukan. Mudah mengidentifikasi sesuatu dari kejauhan.
Anda dapat melakukannya hanya dengan warna, tetapi mungkin cara yang lebih baik untuk melakukannya adalah dengan warna dan simbol . Menggunakan kombinasi warna dan simbol akan membantu orang buta warna mengidentifikasi sesuatu, seperti banyak orang yang disebutkan di atas.
Jika unit cukup besar, Anda juga bisa menggunakan 2-4 lambang warna.
The pola mudah dikenali, bukan hanya warna. Tekstur yang baik bisa memberi label lambang yang cukup besar di dada atau lengan atas setiap unit.
Pada gambar di atas, helm untuk unit yang berbeda memiliki geometri yang berbeda , serta lencana perisai.
Anda juga mungkin tertarik dengan ide Mon Jepang , yang sangat sederhana "logo"
Sekarang Anda pada dasarnya memberi merek unit Anda dengan "merek" modern. StarCraft II melakukan ini sedikit dengan "decals",
tetapi ini hampir tidak terlihat dalam game
dan tidak digunakan untuk mengidentifikasi unit sebanyak warna.
Saya akan melihat bendera juga untuk inspirasi, terutama yang tidak menggunakan pola merek 3-strip (yang menjadi sedikit membingungkan). Mempertimbangkan:
Ini semua memiliki beberapa bendera yang terlihat sangat sederhana, namun khas.
Lihat juga simbol-simbol yang digunakan pemerintah Amerika untuk mengidentifikasi staf pertahanan. Ini adalah gambar monokrom (dapat dilakukan sepenuhnya dalam hitam dan putih), jadi ini sebenarnya bisa menjadi solusi hebat yang tidak akan mengecualikan orang buta warna (pada dasarnya menggunakan simbol untuk mengidentifikasi tim, bukan warna)
sumber
Mengapa menemukan kembali roda? Bahkan ada standar untuk satu set enam belas warna, yang bisa Anda pilih sepuluh. Ini adalah set ANSI http://en.wikipedia.org/wiki/ANSI_escape_code#Colors
Warna ANSI didistribusikan secara merata pada kubus RGB, yang, menurut saya, lebih cocok untuk masalah ini daripada ruang HSV.
Saat mengambil ekstrem kubus RGB, Anda mendapatkan warna yang akrab, seperti merah, biru, cyan, dll. Setelah delapan titik sudut, Anda mendapatkan semua titik di antaranya, di tepi.
sumber
Membuat 10 warna yang dapat dibedakan akan sangat sulit. Ini adalah masalah yang cukup umum dalam membuat grafik atau bagan untuk banyak nilai, itulah sebabnya mereka sering menggunakan warna dan bentuk atau kombinasi pola warna dan hash.
Jika Anda perlu menampilkan spidol, Anda dapat menggunakan 4 warna dasar (merah, biru, oranye, hitam misalnya) dan empat bentuk dasar (persegi, lingkaran, segitiga, berlian) dan mendapatkan 16 spidol yang sangat mudah dibedakan.
Jika Anda mewarnai di area, gunakan ide yang sama tetapi kombinasikan warna dengan pola penetasan dalam garis hitam atau putih alih-alih bentuk.
Hal lain yang perlu dipertimbangkan adalah tidak menggunakan warna sebagai satu-satunya cara untuk mengatakan sisi. Mousing di atas area dapat menyorotnya dan memberikan tip alat dengan nama pemain yang dinyatakan secara eksplisit. Atau mungkin daftar 10 pemain dapat dipermainkan, dan ketika seseorang melayang di atas nama pemain, semua area di peta untuk pemain itu ditampilkan.
Selain itu, saat memilih warna, perlu diingat kebutaan warna. Hijau dan Merah misalnya mungkin tidak dapat dibedakan. Lihatlah http://jfly.iam.u-tokyo.ac.jp/color/#pilih satu set warna yang disarankan yang tidak akan menjadi masalah bagi individu yang buta warna. Sumber tambahan adalah http://www.usability.gov/articles/newsletter/pubs/022010new.html#ColorsthatWorktheBest
sumber
Sekalipun Anda bisa mendapatkan 10 warna unik yang mudah dibedakan oleh satu orang, orang lain mungkin masih merasa sulit untuk membedakannya.
Pertimbangkan membatasi diri Anda pada rangkaian warna yang lebih kecil, dan menambahkan fitur yang dapat dibedakan , seperti garis hitam . Untuk rangkaian warna, mungkin lebih baik tidak menyimpang terlalu jauh dari apa yang kebanyakan orang dapat dengan mudah membedakan: ROYGBIV . Garis sederhana / tanpa garis pada ROYGBIV membuat Anda mengidentifikasi 14 keping gim.
Anda juga tidak harus membatasi diri pada garis hitam. Pertimbangkan solusi berikut untuk memasang kabel 25 pasangan (yang bisa dengan mudah menjadi garis bukan pasangan): http://en.wikipedia.org/wiki/25-pair_color_code
sumber
Hanya ingin melemparkan referensi ke palet Tableau-10 yang dikembangkan untuk kekhasan tinggi dan yang dijelaskan dalam makalah ini:
http://vis.stanford.edu/files/2012-ColorNameModels-CHI.pdf
"Palet Tableau-10 memberikan arti warna yang terbaik dan tumpang tindih nama minimal."
sumber
Brent Berlin dan Paul Kay menunjukkan bahwa ruang warna dapat dibagi menjadi hanya beberapa warna dasar, tetapi itu tergantung pada budaya Anda dalam memberi nama pada warna membuatnya lebih dapat dibedakan.
Dalam bahasa Inggris, ada 11 warna dasar: putih, hitam, merah, hijau, kuning, biru, coklat, ungu, merah muda, oranye dan abu-abu.
Saya tidak suka gagasan memilih rona di sekitar roda untuk alasan yang sama seperti yang dinyatakan Matt Montag
sumber
Lakukan lebih dari sekadar warna - miliki representasi visual yang menambah pengetahuan, gaya seni, dan representasi warna.
Misalnya Legend of the Five Rings menggunakan cara yang luar biasa untuk membedakan antara "set warna".
Salah satu contoh paling indah untuk diambil pelajaran. Perhatikan ratusan cara mereka membedakan antara Klan. Ini bukan hanya warna primer, tetapi juga warna sekunder dan bahkan tersier. Warna-warnanya bahkan termasuk dalam gaya rambut, jenis pakaian, jenis karakter, simbol yang terpasang, bendera, spanduk, bendera mini di bagian belakang, kepribadian.
Hal terbesar yang akan saya ambil dari ini adalah kombinasi beberapa warna. Ini tidak sederhana: Biru, Merah, Ungu, Coklat, Kuning, Hijau, Teal.
Ini adalah kombinasi dari dua warna, dengan keduanya sangat terasa. Ini dapat memungkinkan sejumlah besar tambahan pemain.
Setiap klan akan memiliki kedua warna primer, dan satu set warna sekunder.
"Kepiting sebagian besar diidentifikasi dengan warna biru-abu-abu, ditambah hitam, merah, dan coklat."
Itu indah, karena tidak peduli seperti apa orang itu (besar, lemah, samurai, penyihir, petani) Anda selalu bisa tahu dari mana klan mereka berasal. Bukan hanya "Merah" untuk Scorpion, itu adalah Darah Merah gelap dan HITAM. Sementara Phoenix memiliki warna sunburst: merah, oranye, kuning.
Anda tidak akan pernah membingungkan Scorpion dengan Phoenix, bahkan jika warnanya sama dan mereka berdua menggunakan banyak warna merah.
sumber
Coba pencampur warna ini: w3schools.com Pencampur Warna HTML .
Inilah yang akan saya lakukan: pilih warna untuk opsi pertama. Kemudian, pilih satu untuk opsi ke-2 sehingga warna ke-2 berada pada posisi yang berlawanan dengan yang pertama. Jadi warna pada posisi: Baris 1, Sel 1 akan memiliki yang sebaliknya: Baris Terakhir, Sel Terakhir.
Dengan begitu Anda berakhir dengan 2 warna yang sangat berbeda pada ekstremitas campuran setiap saat. Ulangi ini 5 kali, selalu memilih warna yang jauh dari pilihan terakhir.
sumber
Pertanyaan ini memiliki banyak jawaban, tetapi saya ingin lebih menyentuh aksesibilitas.
Jika saya berada dalam skenario Anda (perlu memilih warna untuk sejumlah hal dalam permainan yang perlu dianggap berbeda oleh semua pemain yang terlibat), perhatian utama saya akan mengakomodasi tidak hanya pemain yang buta warna, tetapi juga pemain yang memiliki penglihatan rendah.
Satu-satunya solusi untuk masalah ini sejauh yang saya ketahui adalah VALUE CONTRAST . Beberapa orang hanya dapat melihat dalam warna hitam dan putih (sumber: seorang teman dari kisah-kisah perguruan tinggi seni tentang mengambil kelas teori warna sementara tidak dapat merasakan warna sama sekali karena operasi mata laser gagal). Beberapa orang penglihatan rendah atau sebagian / secara hukum buta. Anda perlu nuansa abu-abu yang berbeda sebagai titik awal sehingga warna yang Anda LAKUKAN dapat dilihat dan berbeda untuk SEMUA ORANG .
Untuk mencapai semua ini dan memiliki warna yang terlihat bagus, harap pertimbangkan gambar ini, diperoleh dengan meletakan gradien pelangi horizontal dalam mode blending warna di atas gradien hitam-ke-putih vertikal (coba sendiri, mungkin dengan warna kustom gradien selain pelangi!):
Dari yang paling gelap ke yang paling terang: hitam, biru, merah, magenta, hijau, cyan, kuning, putih.
Bisakah Anda melihat zig-zag samar "warna murni"? ITULAH nilai natural dari warna yang diilustrasikan. Bahkan ketika menggunakan warna murni, biru paling gelap dan kuning paling terang. Manfaatkan informasi ini untuk memilih warna yang cocok dengan persyaratan nilai untuk gamer yang buta warna dan / atau penglihatan rendah DAN secara estetika menyenangkan bagi orang-orang yang dapat merasakan keagungan penuh dari warna yang Anda pilih.
Semoga ini membantu! : -)
NB Saya ingin memastikan Anda sudah melihat komentar ini juga!
sumber
Cara untuk memastikan set optimal dalam hal warna yang dapat dibedakan untuk jumlah pemain yang bervariasi (tanpa memperhitungkan buta warna) adalah dengan memilih dari HSL model warna (Hue, Saturation and Lightness).
Anda memilih cahaya dan saturasi yang konstan, tergantung pada pilihan Anda. Kemudian Anda menggeser rona warna dengan
360 / playerCount
, seperti dalam kode pseudo berikut:sumber
Saya ingin menyajikan skema warna alternatif:
Ini adalah warna RGB (urutan yang sama) dengan nama yang disarankan:
Catatan: Saya tidak menggunakan hitam putih murni, berpikir bahwa mungkin mereka digunakan sebagai latar belakang atau garis besar.
Metodologi: mengambil 12 warna pada wajah jenuh dari kubus warna (berpikir saya akan senang dengan 12), mengamati pemisahan mereka, dan kemudian - menggunakan alat untuk mensimulasikan kebutaan warna - mulai tweeking. Setelah itu, saya menambahkan hampir putih, hampir hitam, dan menyelinap abu-abu, karena saya bisa. Itu memberi saya 15 warna. Saya ingin 16 warna karena itu adalah kekuatan 2, dan saya pikir itu bisa membuat segalanya lebih mudah bagi pengembang. Akhirnya saya menemukan cara untuk menambahkan warna ke-16, saya harus memindahkan yang lain untuk itu. Kemudian ... periksa lagi dengan alat simulasi buta warna, perbaiki dan ulangi.
Berikut adalah beberapa kasus buta warna yang berbeda:
Normal:
Protanopia:
Ulangan:
Tritanopia:
Protanomali:
Ulangan:
Tritanomali:
Achromatopsia:
Achromatomaly:
Setelah bermain dengan alat simulasi buta warna untuk sementara waktu, saya harus mengatakan, kontras adalah yang terpenting.
Misalnya, perhatikan warna ke-5 (hijau muda), ke-7 (abu-abu), dan ke-9 (ungu muda). Mereka terlihat serupa pada beberapa kasus, khususnya dalam ukuran kecil dan dipisahkan oleh warna lain. Namun, letakkan mereka berdampingan dan Anda dapat membedakannya. Tingkatkan area yang tercakup dalam warna dan Anda dapat membedakannya dengan lebih mudah. Jadi ... mendesain untuk buta warna tidak hanya memilih warna.
Pada catatan itu ... jika Anda memilih kombinasi dua warna dan bukan satu untuk mewakili sebuah faksi, ini membutuhkan waktu yang lama.
Warna-warna ini dipilih dengan metode yang sangat empiris. Saya perhatikan bahwa poin yang sangat penting adalah memastikan semuanya memiliki kecerahan yang berbeda. Saya juga memperhatikan bahwa sebagian besar "warna" muncul dua kali (ada dua hijau, dua ungu, dua cokelat, dll ...). Sebenarnya, warna ke-4 (zaitun) adalah yang terakhir saya tambahkan, dan saya memutuskan itu akan menjadi warna seperti kuning, karena tidak ada yang seperti kuning. Saya kira itu bisa menjadi dasar untuk cara yang lebih sistemik untuk memilih warna.
Dalam retrospektif, saya mungkin harus membuat warna kuning kedua (zaitun) lebih gelap, dan menggunakan tempat kecerahan untuk warna merah muda (lihat warna ke-7). Mengapa? Karena itu akan memberi Anda lebih banyak nuansa untuk dimainkan. Ern ... ini cukup bagus, dan mendapatkan semua gambar itu merepotkan.
Tambahan : Sesuatu yang tidak saya pertimbangkan adalah bagaimana layar LCD berubah warna jika Anda melihat di luar rentang sudut yang dipilih.
sumber