Đoán RGB của tôi: Guess My RGB
(susam.net)- Guess My RGB là một trò chơi đoán màu đơn giản, trong đó người chơi tự đoán các giá trị RGB của màu nền màn hình
- Người dùng di chuyển các thanh trượt phía trên để điều chỉnh các giá trị R, G, B và tìm tổ hợp gần với màu nền
- Trên màn hình hiển thị các ký tự thập lục phân từ 0 đến 9, từ A đến F, cùng với các nhãn R, G, B
- Có thể bắt đầu ván mới bằng nút
New Game - Chỉ từ thông tin tóm tắt được cung cấp thì không thể xác định điểm số, cách công bố đáp án, độ khó hay cách triển khai
Màn hình và mục tiêu
- Tiêu đề là Guess My RGB
- Mục tiêu là điều chỉnh các thanh trượt để đoán đúng màu RGB của nền
- Trên màn hình hiển thị các ký tự từ 0 đến 9, từ A đến F
- Các nhãn R, G, B cũng được hiển thị để phân biệt từng kênh màu
Cách thao tác
- Dòng hướng dẫn là “Move the sliders above to guess the background RGB colour.”
- Người dùng điều chỉnh các giá trị R, G, B bằng các thanh trượt phía trên
- Bắt đầu ván mới bằng nút
New Game
1 bình luận
Ý kiến trên Hacker News
Tò mò không biết chiến lược tối ưu sẽ là gì nếu không thể nhìn màu mà chỉ xem được điểm sau khi gửi
Ngay cả cách leo đồi đơn giản (hill climbing) cũng khá hiệu quả: bắt đầu mỗi thanh trượt từ 0, kéo sang phải cho đến khi điểm giảm rồi lùi lại một nấc
Trung bình có vẻ cần khoảng 9 lần cho mỗi thanh trượt, tức khoảng 27 lần thử cho một màu
Nếu nhìn chênh lệch điểm khi chuyển từ 0 sang 1 thì có thể ước lượng đại khái cần đi bao xa sang phải, nhưng do làm tròn nên không ra được khoảng cách chính xác
Nếu là chiến lược tối ưu thì trung bình có lẽ chỉ cần 4 lần cho mỗi thanh trượt, tức 12 lần thử cho một màu
Do phần trăm kết quả bị làm tròn nên các màu liền kề có thể có cùng điểm, vì vậy cần lặp ít nhất hai lần
Kết quả tam giác định vị cho ra hai ứng viên, nên nếu chọn ngẫu nhiên một trong hai thì có vẻ trung bình sẽ đoán trúng sau 4,5 lần thử
https://en.wikipedia.org/wiki/Golden-section_search
Trong phạm vi 0-F, đo tại 6 và 9, rồi tùy bên nào cao hơn mà thu hẹp còn 0-9 hoặc 6-F
Sau đó tiếp tục thu hẹp phạm vi trong khi tái sử dụng các giá trị đã đo thì trường hợp xấu nhất là 6 lần cho mỗi thanh trượt, trung bình khoảng 5 lần
Có lẽ vẫn tối ưu thêm được, nhưng mới xem đến đây
Cách làm là chọn các lần đoán sao cho những màu có thể có được phân bố càng đều càng tốt vào 100 nhóm điểm, tức là tối thiểu hóa phương sai
Hơn một nửa số màu có thể được nhận diện chỉ với 2 lần đoán
Nếu sửa mã để tối thiểu hóa kích thước nhóm lớn nhất thì trung bình sẽ tệ hơn một chút, nhưng trong mọi trường hợp sẽ không quá 4 lần
Đây là lời giải có thể dán vào console của trình duyệt trên trang web để chạy
Nếu tạm bỏ qua việc scale và làm tròn, thì khoảng cách từ màu mục tiêu đến ba điểm bất kỳ không thẳng hàng sẽ thu hẹp ứng viên còn tối đa hai điểm, bất kể độ chính xác theo từng trục là bao nhiêu
Vì vậy xác suất đoán đúng ở lần thứ ba là 50%, và ở lần thứ tư là 50%
Khi có scale, vẫn có thể xem như bài toán giao nhau của các mặt cầu, nhưng hàm khoảng cách không đối xứng nên các “mặt cầu” có hình thù kỳ lạ
Ví dụ nếu lần đoán đầu tiên là một đỉnh của khối lập phương, thì tức là đã chọn điểm xa nhất nên 1/8 không gian sẽ có cùng điểm 0%
Nếu tính cả mất mát độ chính xác do làm tròn, thì tốt hơn là xem đây là bài toán rời rạc và tìm các bộ điểm có thể phân biệt mọi màu; sau vài lần thử, bốn điểm [11,7,4], [4,4,8], [11,8,11], [4,11,7] cho kết quả tốt
Có thể vẫn tồn tại tập nhỏ hơn, nhưng để vét cạn xem chỉ ba điểm có đủ phân biệt toàn bộ hay không thì có lẽ cần cỡ 2^48 công việc, và nếu chọn điểm thứ hai dựa trên kết quả đầu tiên thì có thể còn tốt hơn
Đây là tiết mục tủ của tôi
Bạn chỉ cần mô tả màu, tôi có thể nói ra mã màu hex của nó
Chắc cũng đoán được rồi, cực kỳ được yêu thích trong các bữa tiệc
Gợi ý đầu tiên là một từ, gợi ý thứ hai là hai từ, và mọi người đặt quân cờ vào vị trí dự đoán màu của mình
Cách tính điểm dựa trên khoảng cách nên rất dễ chơi
https://boardgamegeek.com/boardgame/302520/hues-and-cues
Trước đây tôi từng đọc một bài nói về cách Netscape diễn giải những từ không nằm trong danh sách tên màu chính thức thành màu, kiểu như bỏ các ký tự không phải hex rồi đệm và chia phần còn lại để tạo thành các số RGB
Vì vậy “dumptruck” có thể trở thành DC0 và hiện ra như một màu vàng
Nhìn thấy thế là tôi lập tức làm một ứng dụng nhỏ, parse toàn bộ từ trong /usr/share/dict/words rồi đưa vào một DB sqlite cùng với biểu diễn màu Lab của chúng
Nó hiển thị 100 từ màu giả gần nhất với RGB mong muốn bằng màu thật và sắp xếp theo thứ tự gần dần, khá vui cho một dự án buổi tối làm ngẫu hứng
Một màu vàng đục gợi nhớ loại trái cây chua ngọt mọc ở Trung Mỹ và miền nam nước Mỹ
Câu này lấy từ mô tả sơn
Sau khi gửi, màu nền của ô hiển thị kết quả độ khớp sẽ đổi thành màu tôi đã đoán
Tùy màu cần đoán mà điều này có thể trông hiển nhiên, nhưng trường hợp của tôi thì màu khá xám nên phải sau vài lần đoán tôi mới nhận ra gợi ý trực quan quan trọng này
Vô tình lại thành một màn quảng bá tuyệt vời cho không gian màu dựa trên tri giác
Khi bắt đầu tiến gần đáp án, việc bỏ qua màu và chỉ nhìn mức thay đổi phần trăm lại dễ hơn
Không biết nếu là trò Guess My OKLCH thì có khác không
Có cảm giác như bị chạm trần ở mức 95%
Trang không gắn liên kết, nhưng với ai quan tâm thì kho GitHub ở đây
https://github.com/susam/myrgb
Tình cờ vừa hoàn thành tài liệu bài giảng dạy về nhiều định dạng màu khác nhau, nên thấy cái này khá thú vị
Trong đó tôi có giải thích việc chọn màu bằng giá trị RGB khó đến mức nào, vì con người không nghĩ về màu sắc theo cách đó
Trò chơi này là một ví dụ rất hay cho điều đó
HSL trực quan hơn nhiều, và chỉ cần có cảm giác về vòng tròn màu là có thể định nghĩa màu bằng mức độ bão hòa và độ sáng rất dễ dàng
Tôi cho sinh viên làm bài tập thử định nghĩa sự khác biệt giữa màu quần áo họ đang mặc bằng HSL
Nếu cảm thấy RGB khó hình dung thì cũng có thể thử Lab
Tôi đoán trúng màu đầu tiên ngay trong một lần, giờ thì sợ rằng từ đây chỉ còn đi xuống thôi
Có vấn đề gì đâu? Chỉ cần xem màu nền trong công cụ dành cho nhà phát triển rồi chuẩn hóa về 16 mức là xong mà, haha
Nói thật là trò này được làm rất tốt, vui và đầy thử thách
Tôi cũng muốn thử một bản spin-off Guess my HSL
https://bottosson.github.io/posts/oklab/
https://codepen.io/kaliedarik/full/YzvYadX
Ý tưởng thực sự rất hay
Hai lần đầu tôi nhanh chóng lên được 94%, nhưng sau đó thì kẹt cứng
Mốc 94% trông giống như một cực trị cục bộ, cảm giác như tăng hay giảm bất kỳ thanh trượt nào một nấc cũng không giải quyết được
Có ai giải thích được lý do không? Ngoài ra sẽ tốt hơn nếu có cách bỏ cuộc và xem đáp án
Trên điện thoại, ngón tay tôi quá to nên không nhận ra mình không thể di chuyển thanh trượt chính xác từng nấc một mà lại đang nhảy mỗi lần hai nấc
Trước tiên tính sai số tối đa có thể có so với màu mục tiêu, rồi lấy khoảng cách Euclid tới dự đoán thực tế chia cho khoảng cách tối đa đó và trả về
Math.floor(100 * (1 - dist / maxDist))Đây là một cách hợp lý để phần trăm ở mỗi vòng có cảm giác tương tự nhau
Nếu không thì màu xám trung tính sẽ luôn nhận điểm tương đối cao với gần như mọi dự đoán
Để trả lời câu hỏi của bạn, tôi nghĩ tình huống cực trị cục bộ như bạn nói có lẽ không thể xảy ra
Tôi không phải nhà toán học, nhưng chỉ nhìn vào hàm này thì có vẻ nếu chưa đúng đáp án, sẽ luôn có hướng di chuyển một thanh trượt nào đó để tăng điểm
Có lẽ nhiều khả năng là bạn đã bỏ lỡ bước di chuyển một nấc đó, và chuyện này càng dễ xảy ra khi bạn tiến gần đáp án hơn
Nếu bạn đã thử di chuyển một cái mà không giải được, thì trước khi thử cái khác bạn phải đưa thanh trượt đầu tiên về lại vị trí ban đầu
Khi tôi thử thì chỉ cần đổi một con số thôi là độ khớp đã tăng hoặc giảm