Cách phát triển trang web, thương mại điện tử hoặc lược đồ màu ứng dụng

Phát triển lược đồ màu trang web, thương mại điện tử hoặc ứng dụng

Chúng tôi đã chia sẻ một số bài viết về tầm quan trọng của màu sắc đối với một thương hiệu. Đối với một trang web, trang thương mại điện tử hoặc một ứng dụng web hoặc thiết bị di động, nó cũng rất quan trọng. Màu sắc có ảnh hưởng đến:

  • Ấn tượng ban đầu về một thương hiệu và giá trị của nó - ví dụ, hàng xa xỉ thường sử dụng màu đen, màu đỏ ngụ ý sự phấn khích, v.v.
  • Quyết định mua hàng - sự tin cậy của một thương hiệu có thể được xác định bởi độ tương phản của màu sắc. Các phối màu nhẹ nhàng có thể nữ tính và đáng tin cậy hơn, các màu tương phản gay gắt có thể cấp bách hơn và giảm giá.
  • Khả năng sử dụng và trải nghiệm người dùng - màu sắc có tâm lý và cả tác động sinh lý, khiến việc điều hướng giao diện người dùng trở nên dễ dàng hoặc khó khăn hơn.

Màu sắc quan trọng như thế nào?

  • 85% mọi người khẳng định rằng màu sắc có ảnh hưởng lớn đến những gì họ mua.
  • Màu sắc giúp tăng nhận diện thương hiệu trung bình 80%.
  • Ấn tượng về màu sắc chịu trách nhiệm cho 60% việc chấp nhận hay từ chối một sản phẩm.

Khi xác định bảng màu cho một trang web, có một số bước được trình bày chi tiết trong đồ họa thông tin kèm theo:

  1. Màu chính - Chọn màu sắc phù hợp với năng lượng của sản phẩm hoặc dịch vụ của bạn.
  2. Màu sắc hành động - Cái này còn thiếu trong đồ họa thông tin bên dưới, nhưng việc xác định màu hành động chính và màu hành động phụ là vô cùng hữu ích. Nó giáo dục khán giả của bạn tập trung vào các yếu tố giao diện người dùng cụ thể dựa trên màu sắc.
  3. AMàu sắc bổ sung - Chọn bổ sung màu sắc bổ sung màu chính của bạn, lý tưởng là những màu tạo nên màu chính của bạn bật.
  4. Màu nền - Chọn màu cho nền trang web của bạn - có thể ít gây ấn tượng hơn màu chính của bạn. Hãy ghi nhớ cả chế độ tối và sáng .. ngày càng nhiều trang web kết hợp các bảng màu ở chế độ sáng hoặc tối.
  5. Màu sắc kiểu chữ - Chọn màu cho văn bản sẽ có trên trang web của bạn - hãy nhớ rằng kiểu chữ đen liền khối là rất hiếm và không được khuyến khích.

Ví dụ, công ty của tôi Highbridge đã phát triển một thương hiệu trực tuyến cho một nhà sản xuất trang phục muốn xây dựng một trang web thương mại điện tử trực tiếp đến người tiêu dùng, nơi mọi người có thể mua váy trực tuyến. Chúng tôi hiểu đối tượng mục tiêu của mình, giá trị của thương hiệu và - bởi vì thương hiệu chủ yếu là kỹ thuật số nhưng cũng có sản phẩm vật lý - chúng tôi tập trung vào các bảng màu hoạt động tốt trên bản in (CMYK), bảng màu vải (Pantone), cũng như kỹ thuật số (RGB và Hex).

Thử nghiệm phối màu với nghiên cứu thị trường

Quá trình lựa chọn bảng màu của chúng tôi rất chuyên sâu.

  1. Chúng tôi đã thực hiện nghiên cứu tiếp thị về một loạt màu cơ bản với đối tượng mục tiêu của chúng tôi để giảm chúng tôi xuống một màu duy nhất.
  2. Chúng tôi đã thực hiện nghiên cứu tiếp thị về một loạt các màu thứ cấp và thứ ba với đối tượng mục tiêu của chúng tôi, nơi chúng tôi thu hẹp một số cách phối màu.
  3. Chúng tôi đã thực hiện các mô hình sản phẩm (bao bì sản phẩm, thẻ đeo cổ và thẻ treo) cũng như các mô hình thương mại điện tử với các sơ đồ màu sắc và cung cấp những mô hình đó cho khách hàng cũng như đối tượng mục tiêu để phản hồi.
  4. Bởi vì thương hiệu của họ chủ yếu phụ thuộc vào tính thời vụ, chúng tôi cũng kết hợp các màu sắc theo mùa vào hỗn hợp. Điều này có thể hữu ích cho các bộ sưu tập hoặc hình ảnh cụ thể cho quảng cáo và chia sẻ trên mạng xã hội.
  5. Chúng tôi đã trải qua quá trình này hơn nửa tá lần trước khi quyết định sơ đồ cuối cùng.

bảng màu 52

Trong khi màu thương hiệu là hồng nhạt và xám đậm, chúng tôi đã phát triển màu sắc hành động trở thành bóng râm của màu xanh lá cây. Màu xanh lá cây là một màu hướng đến hành động vì vậy đây là một lựa chọn tuyệt vời để thu hút ánh nhìn của người dùng đến các yếu tố định hướng hành động. Chúng tôi đã kết hợp sự nghịch đảo của màu xanh lá cây cho các hành động phụ của chúng tôi (đường viền màu xanh lục với nền và văn bản màu trắng). Chúng tôi cũng đang thử nghiệm màu xanh lục đậm hơn trên màu hành động cho các hành động khi di chuột.

Kể từ khi chúng tôi vừa khởi chạy trang web, chúng tôi đã kết hợp theo dõi chuột và bản đồ nhiệt để quan sát các yếu tố mà khách truy cập của chúng tôi bị thu hút và tương tác nhiều nhất để đảm bảo chúng tôi có một bảng màu không chỉ trông đẹp mắt… nó hoạt động tốt.

Màu sắc, Khoảng trắng và Đặc điểm của các yếu tố

Việc phát triển một bảng màu phải luôn được hoàn thành bằng cách thử nghiệm nó trong một giao diện người dùng tổng thể để quan sát sự tương tác của người dùng. Đối với trang web ở trên, chúng tôi cũng đã kết hợp các lề, khoảng đệm, đường viền, bức xạ đường viền, hình tượng và kiểu chữ rất cụ thể.

Chúng tôi đã cung cấp hướng dẫn xây dựng thương hiệu đầy đủ cho công ty để phân phối nội bộ cho bất kỳ tài liệu tiếp thị hoặc sản phẩm nào. Tính nhất quán của thương hiệu là rất quan trọng đối với công ty này vì họ mới và chưa có bất kỳ nhận thức nào trong ngành vào thời điểm này.

Đây là trang web thương mại điện tử kết quả với bảng màu

  • Closet52 - Mua váy trực tuyến
  • Trang Bộ sưu tập Closet52
  • Trang sản phẩm 52

Ghé thăm Closet52

Khả năng sử dụng màu và mù màu

Đừng quên kiểm tra khả năng sử dụng cho độ tương phản màu giữa các phần tử của trang web của bạn. Bạn có thể kiểm tra chương trình của mình bằng cách sử dụng Công cụ kiểm tra khả năng truy cập trang web. Với bảng màu của chúng tôi, chúng tôi biết rằng chúng tôi có một số vấn đề về độ tương phản mà chúng tôi sẽ nghiên cứu trên đường hoặc chúng tôi thậm chí có thể có một số tùy chọn cho người dùng của mình. Điều thú vị là khả năng xảy ra các vấn đề về màu sắc với đối tượng mục tiêu của chúng tôi là khá thấp.

Mù màu là tình trạng không có khả năng nhận biết sự khác biệt giữa một số màu sắc mà những người khiếm thị không có màu sắc có thể phân biệt được. Mù màu ảnh hưởng đến năm đến tám phần trăm nam giới (khoảng 10.5 triệu) và ít hơn một phần trăm nữ giới.

Usability.gov

Nhóm tại WebsiteBuilderExpert đã tổng hợp đồ họa thông tin và bài viết đi kèm chi tiết về Cách chọn màu cho trang web của bạn đó là cực kỳ kỹ lưỡng.

Cách chọn phối màu cho trang web của bạn