, ,

7 nguyên tắc sử dụng màu sắc

1700 lượt xem

7 nguyên tắc sử dụng màu sắc

1. Thuật ngữ màu
2. Phân cấp (Hierarchy)
3. Diễn đạt (Expressive)
4. Ý nghĩa
5. Giới hạn màu
6. Tín hiệu thị giác
7. Tính nhất quán & bối cảnh

7 nguyên tắc sử dụng màu sắc

1. Thuật ngữ màu

Có một số thuật ngữ màu sắc bạn nên biết trước khi bước chân vào thế giới thiết kế. Hãy cùng tìm hiểu nó là gì.

  •  Hue

Hue đề cập đến màu gốc – một màu bão hòa không có sự pha trộn của các màu trắng hoặc đen.

  • Tint

  • Shade

Shade được tạo ra khi bạn pha trộn thêm một lượng màu đen vào màu gốc (màu hue).

  • Tone

Tone thì tinh tế hơn một chút, bởi vì nó đòi hỏi sự kết hợp của cả đen và trắng, đây cũng là lý do tại sao Tone trông có vẻ tự nhiên hơn so với Shade và Tint.

  •  Value

Value là một đặc tính giúp chúng ta biết mức độ sáng – tối của một màu.

  • Saturation

Saturation miêu tả màu sắc đậm hay nhạt theo các cường độ ánh sáng mạnh – nhẹ; hay hiểu theo một cách khác, ta có thể tạm dịch Saturation là cường độ màu sắc.

2. Phân cấp (Hierarchy)

Phân cấp thị giác là một trong những kỹ thuật cốt lõi được áp dụng cho quá trình thiết kế. Nó ban đầu được dựa trên lý thuyết tâm lý Gestalt kiểm tra nhận thức trực quan của người dùng về các yếu tố liên quan đến nhau và cho thấy cách mọi người có xu hướng thống nhất các yếu tố hình ảnh thành các nhóm.

Phân cấp thị giác cố gắng trình bày nội dung của một sản phẩm giúp người dùng có thể hiểu mức độ quan trọng của mỗi phần tử. Nó giúp chúng ta có thể phân biệt các đối tượng giựa trên những đặc tính dễ dàng nhận biết chẳng hạn như kích thước, màu sắc, độ tương phản, phong cách, v.v.

Trình bày trực quan các yếu tố giao diện người dùng có ảnh hưởng lớn đến trải nghiệm người dùng của sản phẩm. Nếu các thành phần nội dung trông giống như một mớ hỗn độn, mọi người không thể điều hướng trong một sản phẩm hoặc tương tác với sản phẩm đó một cách chính xác. Hơn nữa, nội dung không có cấu trúc dễ đọc sẽ khiến người dùng không thể đọc lướt nhanh và họ cần phải mày mò tìm kiếm dữ liệu họ đang càn. UX xấu như vậy có thể dẫn đến sự hài lòng của người dùng kém có nghĩa là một sản phẩm sẽ không được nhiều người sử dụng.

3. Diễn đạt (Expressive)

Hiển thị màu sắc thương hiệu tại những khoảnh khắc đáng nhớ giúp củng cố phong cách độc đáo của thương hiệu.

Hãy nghĩ về màu sắc thương hiệu của bạn như muối và hạt tiêu trên một đĩa bánh mì nướng bơ. Quá nhiều muối và nó áp đảo các hương vị tự nhiên, quá ít thì nó sẽ nhạt.

Khi thêm màu sắc để củng cố thương hiệu của bạn vào giao diện, hãy suy nghĩ kỹ về thời điểm và địa điểm được thêm vào.

4. Ý nghĩa

Màu sắc gợi lên những cảm xúc và mang ý nghĩa khác nhau, vì vậy khi bạn hiểu được ý nghĩa của màu sắc , chúng ta có thể sử dụng màu sắc để cộng hưởng với đối tượng mục tiêu.

Điều quan trọng là bạn phải biết đối tượng sử dụng là ai, nhận thức về màu sắc có thể thay đổi theo văn hóa và vùng miền. Ví dụ, trong văn hóa phương tây, màu trắng thường được kết hợp với đám cưới, trong khi ở văn hóa đông nam, màu trắng được coi là màu của tang tóc.

Các công ty sử dụng màu sắc trong thương hiệu và tiếp thị như một chiến thuật để tác động đến cảm xúc của mọi người. Bạn có nhận thấy rằng hầu hết mọi nhà hàng thức ăn nhanh đều sử dụng màu đỏ và màu vàng trong thương hiệu của mình? Đó là bởi vì màu đỏ kích thích sự thèm ăn, cơn đói và nó thu hút sự chú ý – trong khi màu vàng gây ra cảm giác hạnh phúc và thân thiện.

5. Giới hạn màu

Khi giới hạn việc sử dụng màu sắc trong ứng dụng, các khu vực nhận được màu sắc nổi bật sẽ nhận được nhiều sự chú ý hơn, chẳng hạn như văn bản, hình ảnh và các yếu tố riêng lẻ như các nút.

Bạn có thể nhận thấy trong nhiều ứng dụng có nhiều bài đăng đầy màu sắc và nội dung không thể đoán trước như Instagram hoặc Twitter, giao diện của chúng có xu hướng khá đơn giản. Nó giúp người dùng dễ dàng tập trung vào nội dung.

6. Tín hiệu thị giác

Màu sắc có thể cung cấp thông tin về trạng thái của ứng dụng, các component (thành phần) và element (yếu tố) của ứng dụng

Màu sắc là một cách mà chúng ta có thể hiển thị sự thay đổi trạng thái trong giao diện của chúng ta. Bằng cách loại bỏ màu của một nút bấm, nó có thể chỉ ra cho người dùng rằng nút bấm đó đã bị vô hiệu hóa hoặc bằng cách tô sáng nó bằng màu đỏ, nó báo hiệu một lỗi. Chúng ta cũng nên kèm theo các màu lỗi với thông báo lỗi và biểu tượng để đảm bảo sự rõ ràng và trực quan.

7. Tính nhất quán & bối cảnh

Việc sử dụng màu sắc trong một giao diện cần phải nhất quán, màu sắc luôn có nghĩa tương tự ngay cả khi bối cảnh thay đổi.

Nếu màu đỏ được sử dụng trong thương hiệu của bạn, thì bạn nên tránh sử dụng nó để thông báo về các trạng thái lỗi. Chúng ta có thể sử dụng một màu thay thế như màu vàng để tránh nhầm lẫn.

Đây là một vấn đề dễ dàng giải quyết, vì vậy không có lý do gì để tránh sử dụng màu đỏ hoặc màu vàng trong thương hiệu của bạn.

Một số bài viết theo tag

Các tin khác

,

Vintage là gì – Thiết kế phong cách vintage thế nào

Làm Chủ Phong Cách Vintage Trong Thiết Kế Menu Mỗi chủ tiệm lại lựa chọn cho mình những phong cách thiết kế khác nhau như phong cách retro, phong cách minimalism, phong cách scandinavia, … và trong số đó phong cách vintage vẫn được rất nhiều người yêu thích và lựa chọn, với những nét riêng biệt cuốn hút rất riêng. […]

,

Photoshop và Lightroom: Phần mềm sửa ảnh nào phù hợp với bạn?

Photoshop và Lightroom: Phần mềm sửa ảnh nào phù hợp với bạn? Trong bài viết này, chúng ta sẽ cùng xem xét các đặc điểm của Photoshop và Lightroom để giúp bạn tìm ra ứng dụng phù hợp với nhu cầu chỉnh sửa và xử lý ảnh của bạn. Khi bạn đang tìm kiếm phần […]

,

5 nguyên tắc tạo ấn tượng khi thiết kế banner

5 Nguyên Tắc Tạo Ấn Tượng Khi Thiết Kế Banner Thiết kế Banner quảng cáo sao cho ấn tượng không phải là điều dễ dàng bởi sự đòi hỏi cao về nghệ thuật, sức sáng tạo và khả năng phối hợp màu sắc tinh tế. Thực tế, các marketers không hiếm khi mắc lỗi, làm quảng […]

, ,

6 mẫu truyền thông thị giác ấn tượng

6 mẫu truyền thông thị giác ấn tượng 1. KISSmetrics Infographics Infographic vẫn mang lại hiệu quả rất lớn trong content marketing. Một ví dụ đặ biệt thành công là Kissmetrics. Trên trang infographics KISSmetrics, bạn sẽ tìm thấy hàng chục ví dụ về các nội dung hữu ích được thể hiện một cách trực […]