Press "Enter" to skip to content

4 Chú ý cho một Thiết kế hiệu quả

Có những thứ tưởng chừng như nhỏ nhặt nhưng lại rất ảnh hưởng đến thiết kế của bạn. Đôi khi bạn tạo ra được một thiết kế trông cũng đẹp nhưng khi nhìn kỹ thì thấy có điều gì đó không ổn mà lại không biết đó là điều gì! Có thể thiết kế đó thiếu một trong những thứ mà RGB.vn sẽ đề cập ngay sau đây: 4 bí quyết để có một thiết kế hiệu quả.

RGB.vn | 4 chú ý cho một thiết kế hiệu quả

1. Tương phản (Contrast)

Nếu một cái gì đó có sự tương phản mạnh thì có nghĩa là nó sẽ nổi bật hơn so với trang báo hoặc so với những thành phần khác trên trang báo đó. Tóm lại, sự tương phản làm cho một cái gì đó giống như thế này:

RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

Như bạn đã thấy hình minh họa ở trên, thì cách phổ biến nhất để làm gia tăng sự tương phản là thông qua màu sắc (lấy ví dụ chữ màu đen trên nền trắng thì hiệu quả hơn là chữ màu xám nhạt trên nền trắng), thông qua kích cỡ, hoặc thông qua những cách xử lý khác. Nhưng sự tương phản cũng có thể được thực hiện một cách thị giác bằng cách giảm thiểu số lượng các tin bài đang chen chúc tranh giành sự chú ý của độc giả và tập trung chủ yếu vào điểm chính của tờ báo (điều này được ứng dụng nhiều hơn trong các trang web hoặc các trang quảng cáo có nhiều tin tức).

Sự tương phản cũng được ứng dụng bằng cách xử lý chữ, kích cỡ, và thậm chí là độ dày của hàng chữ.

RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

Kinh nghiệm cho thấy là nếu chúng không giống nhau, thì hãy làm cho chúng khác biệt rõ rệt.

Tuy nhiên, cũng luôn cần phải có một tiêu chuẩn thống nhất đối với những sự tương phản mà bạn sử dụng cho những phạm vi nào đó trên trang báo – đơn giản là đừng sử dụng sự tương phản thái quá đến nỗi làm cho nội dung trở nên khó đọc hơn hoặc làm đau mắt người xem.

Sự tương phản là yếu tố then chốt để phân biệt giữa những khu vực trên trang web của bạn, như hình minh họa sau:

RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

2. Lặp lại (Repetition)

Sự lặp lại giúp cho việc hiểu được nội dung (hình ảnh hoặc văn bản) thông qua cách thức tổ chức. Việc lặp lại những yếu tố này không chỉ giúp người xem hiểu mối quan hệ với nhau của chúng mà còn hiểu được toàn bộ trang báo (sau đó là hiểu sự liên hệ của những phần quan trọng trong trang báo đó) cũng như tầm quan trọng của nó trong một trang web. Việc biết được cái gì là quan trọng để đặt vào những khu vực trọng tâm giúp cho người xem sắp xếp trong đầu mình nội dung của bài báo.

Việc xác định những yếu tố then chốt thông qua sự lặp lại sẽ cho bạn kinh nghiệm về tính chặt chẽ và thống nhất –  kinh nghiệm đó sẽ có ích cho bạn trong việc truy cập Web, đọc sách quảng cáo hay nhìn vào một tấm danh thiếp.

Ví dụ

Hãy chú ý cách mà trang danh mục amazon truyền tải thông tin và các khu vực nội dung bằng cách sử dụng tốt sự lặp lại cho mỗi thành phần hay kiểu của item:
RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

3. Căn chỉnh (Alignment)

Mỗi item hay mỗi yếu tố trên trang báo không nên được sắp đặt một cách ngẫu nhiên. Điều này không có nghĩa là bắt buộc mỗi item đều phải được xếp thẳng hàng với mọi thứ hay thậm chí là một thứ khác – mà nó nên góp phần làm nên tính chặt chẽ của toàn thể trang báo. Cái mà các bạn đang tìm kiếm là một sự sắp hàng trực quan giữa hoặc trong số các yếu tố trên trang báo.

Căn chỉnh có thể giúp gia tăng giá trị trực quan của một item trên trang báo, và do đó người xem sẽ quan tâm tới nó.

Việc căn chỉnh cũng có thể được sử dụng để gia tăng sự tương phản – đưa ra 1 câu trích dẫn là một ví dụ điển hình về làm cách nào để một sự căn chỉnh bình thường có thể thu hút sự chú ý mà người sử dụng không cần phải cố gắng suy nghĩ. Với việc căn chỉnh hoàn toàn hầu hết các item trên trang báo (hoặc những item phụ như bảng điều khiển) và để cho ra một điểm đặc trưng từ sự căn chỉnh này, chúng ta sẽ làm cho item đó tương phản với những cái còn lại trên trang báo, và do đó làm gia tăng giá trị trực quan của nó cũng như thu hút sự quan tâm từ phía người xem.

Ví dụ

Hãy xem cách mà trang amazon thực hiện điều này trên trang thông tin sản phẩm của họ:

RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

4. Khoảng cách gần (Proximity)

Là một trong những cách thiết yếu giúp chúng ta xác định các mối liên hệ và sắp xếp thông tin.

Ví dụ, một vài danh thiếp có cả số điện thoại và tên của doanh nghiệp và của chủ nhân danh thiếp đó. Không có chỗ nào trên tấm danh thiếp đó thật sự chỉ ra rõ ràng rằng số điện thoại nằm phía dưới tên doanh nghiệp là của doanh nghiệp nói chung và số điện thoại nằm dưới tên 1 cá nhân là của số của cá nhân đó. Sở dĩ chúng ta biết được là do khoảng cách gần nhau của chúng. Nếu ta gọi cho số thứ nhất thì ta sẽ gặp người trong văn phòng của công ty, còn khi gọi số thứ 2 ta sẽ gặp người mà có tên trên danh thiếp.

Ví dụ

Hãy nhìn vào trang amazon một lần nữa và chú ý đến những liên kết ở dưới cùng và những thông tin về kích cỡ màn hình cho 2 mẫu Kindle:

RGB.vn | 4 Chú ý cho một Thiết kế hiệu quả

Trong tích tắc chúng ta sẽ không nghĩ rằng những kích cỡ màn hình đó là của bất kỳ cái gì khác ngoài những mẫu Kindle lần lượt được trưng ra bên dưới.

Các item đặt gần với nội dung chủ yếu trên cùng một vị trí giúp chúng ta biết được chúng có liên quan đến nội dung chủ yếu đó hoặc ít nhất có tầm quan trọng liên quan nhiều hơn tới nội dung đó. Mối liên quan được nhận ra thông qua tình trạng gần nhau của 1 item này với 1 item khác: vì vậy chúng ta nên để cho những item này trở nên gần nhau hơn để gia tăng mối liên hệ của chúng.

Tóm lại

4 nguyên tắc đã nêu ở trên là một xuất phát điểm tốt để cho ra bất kỳ một bản thiết kế nào. Và hãy nhớ, đơn giản thôi: CRAP bao gồm:

  • Contrast (sự tương phản)
  • Repetition (sự lặp lại)
  • Alignment(sự sắp hàng)
  • Proximity (khoảng cách gần)
RGB (Theo Creativeoverflow)
747 Tổng số lượt xem 1 Lượt xem trong ngày
TUANLONGad
TUANLONGad

rất mong các bạn sau khi đọc xong bài viết xin để lại lời Bình luận đóng góp ý kiến cho chúng tôi. Bản thân Long cũng rất muốn lắng nghe ý kiến của mọi người để một phần giúp TẠP CHÍ 247 hoàn thiện hơn trong công việc cũng như trong định hướng phát triển Website giàu màu sắc, ý tưởng hơn. Cảm ơn các bạn.

View all posts

    Trả lời

    Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

    :wink: :twisted: :roll: :oops: :mrgreen: :lol: :idea: :evil: :cry: :arrow: :?: :-| :-x :-o :-P :-D :-? :) :( :!: 8-O 8)

    Top