Chính xác những mẫu màu '500' của Google là gì?

Tôi đã đọc về Thiết kế Vật liệu của Google và khi tôi đọc về Phong cách, họ liên tục đề cập đến 500 màu chính (cũng như bất kỳ số nào khác từ 50, gần như trắng, đến 900), nhưng những gì điều này có nghĩa là gì?

Tôi rất muốn thử sức mình trong việc tạo ra các mẫu màu "Lấy cảm hứng từ vật liệu" của riêng tôi, nhưng vì việc đặt tên màu của chúng làm tôi bối rối, tôi không chắc bắt đầu từ đâu. Tôi đã cố gắng googling cho một câu trả lời (mà bằng cách nào đó cảm thấy hơi mỉa mai), nhưng cho đến nay tôi không tìm thấy nhiều câu trả lời kết luận. Nếu tôi phải đoán, có vẻ như nó có liên quan đến bước sóng của màu sắc?

Cũng có đề cập đến A100 đến A700 màu ...

Tôi đã tự hỏi rằng bản thân mình.

Đầu tiên, "500" dường như không cho biết có bao nhiêu màu, nhưng hệ thống đánh số kỳ lạ mà họ sử dụng. 500 là cơ sở, 400 là nhẹ hơn cơ sở, 600 là tối hơn. Điều đó khá giống với cách đánh số phông chữ ( thông tin ) vì vậy có lẽ điều đó có liên quan đến nó.

Tôi đã phát hiện ra rằng một số số nhỏ hơn 500 được tìm thấy bằng cách làm mờ chúng thành chế độ hòa trộn màu trắng ("Màn hình" trong Photoshop) hoặc màu đen ("Nhân lên").

• 900: 59% (đóng)
• 600: 10% (gần như chính xác)
• 500: Cơ sở
• 400: 15% (chính xác)
• 300: 30% (chính xác)
• 200: 50% (chính xác)
• 100: 70% (đóng)
• 50: 88% (chính xác)

Tôi không thấy một mô hình ở đây. Và có lẽ không có. Hoặc có thể có một cái gì đó rõ ràng tôi đang xem; Tôi khá tệ trong việc phối màu.

Tôi sẽ để nó ở đây vì đây là thông tin mới về chủ đề này.

https://www.youtube.com/watch?t=73&v=xYkz0Ueg0L4

Xuất bản vào ngày 28 tháng 5 năm 2015

Một chút gỉ trên lý thuyết màu sắc của bạn? Chất liệu thiết kế giúp màu sắc dễ dàng. Tìm hiểu thêm về màu sắc và thiết kế vật liệu tại www.google.com.vn/design .

ETA: Các màu chính, (500) là các màu mà Google đã chọn làm "màu chính" (hoặc màu) mà bạn dựa trên thiết kế của mình. Bạn bắt đầu với 500 chính sau đó chia tỷ lệ từ sáng sang tối; những màu này được áp dụng cho các yếu tố khác nhau trong UI.

500s mô tả chủ đề chính trong sản phẩm (và rất phù hợp với thanh công cụ) Từ đó quy mô lên tới 700 giây cho thanh trạng thái hoặc xuống 300 cho thông tin thứ cấp Màu A là màu nhấn - tương tác sáng hơn và bão hòa hơn. Đây là hoàn hảo để làm nổi bật các nút hành động chính, nút tiêu chuẩn, công tắc và thanh trượt.

Điều thú vị là thông tin trong video này dường như mâu thuẫn với, hoặc ít nhất là không nhất quán, thông tin Google cung cấp trên trang bảng màu của họ được đề cập ở trên ( http://www.google.com/design/spec/style/color .html # màu-màu-bảng màu ).

Trên trang bảng màu, họ nói "Google gợi ý sử dụng 500 màu làm màu chính trong ứng dụng của bạn và các màu khác làm màu nhấn " Trong video họ nói "Màu A là màu nhấn ..."

Cấp, sự khác biệt tinh tế, nhưng nếu Google sẽ phát triển một hướng dẫn phong cách, họ nên phù hợp với việc sử dụng từ " dấu ".

Có lẽ bạn đã tìm thấy tài nguyên này, nhưng Google đã tập hợp một hướng dẫn cực kỳ tiện dụng để giúp các nhà phát triển và nhà thiết kế đồng bộ hóa với sự rung cảm của Vật liệu mới.

Toàn bộ hướng dẫn có thể được tìm thấy ở đây - http://www.google.com/design/spec/m vật liệu - design / int sinhtion.html #

Cụ thể, trang này làm cho tất cả các màu yêu thích của họ có sẵn để tải xuống - http://www.google.com/design/spec/style/color.html#color-color-palette

Đây là câu trả lời cho câu hỏi của bạn .. hãy xem video này

Những năm 500 là Màu cơ bản hoàn hảo mô tả chủ đề chính trong sản phẩm của bạn và rất phù hợp với thanh công cụ.

700s được sử dụng cho thanh Status

và 300 được sử dụng cho thông tin thứ cấp

Vì vậy, về cơ bản những con số này đại diện cho các sắc thái và sắc độ được xác định trước của màu Chính cho phần / phần cụ thể của thiết kế.

Theo tôi, quy ước đặt tên dựa trên quy ước đặt tên theo trọng số của webfont:

• 500: cơ sở
• <500: mỏng hơn / nhẹ hơn
• > 500: dày hơn / tối hơn

Một cách rất hữu ích và hợp lý để đặt tên một cái gì đó với đường cơ sở và các biến thể.

Liên kết tham chiếu: Liên kết đến trang GitHub của phông chữ Inter

Một ví dụ ở đây là ảnh chụp màn hình phông chữ "Inter" của Mozilla sử dụng cách đặt tên theo phông chữ như vậy nhưng trong trường hợp của họ, trọng lượng thông thường / cơ sở được đánh số là 400. Rất nhiều phông chữ thực sự sử dụng 400 như trọng lượng "thông thường" nhưng đây là chủ đề khác.