Một thiết kế có thể sử dụng grid rất chuẩn, khoảng cách giữa các thành phần rất đẹp, typography được căn chỉnh cẩn thận và màu sắc cũng hài hòa, nhưng khi nhìn tổng thể, chúng ta vẫn có cảm giác nó “không cân”.
Không phải lúc nào vấn đề cũng nằm ở alignment hay spacing.
Đôi khi, nguyên nhân nằm ở một khái niệm tinh tế hơn: Visual Weight – trọng lượng thị giác.
Trong thiết kế đồ họa, không phải mọi element đều có “sức nặng” như nhau. Một hình ảnh lớn có thể nặng hơn một đoạn text nhỏ. Một mảng đen đặc có thể thu hút ánh nhìn mạnh hơn một vùng sáng rộng. Một headline đậm có thể tạo cảm giác nặng hơn nhiều dòng chữ mảnh, dù diện tích thực tế của chúng tương đương.
Điều thú vị là trọng lượng này không tồn tại theo nghĩa vật lý. Nó tồn tại trong cách mắt và não bộ chúng ta tiếp nhận hình ảnh.
Hiểu Visual Weight giúp Designer kiểm soát được thứ tự chú ý, tạo ra sự cân bằng, dẫn hướng ánh nhìn và quan trọng hơn, biết chính xác tại sao một bố cục đang hoạt động – hoặc không hoạt động.
Visual Weight là gì?
Visual Weight có thể hiểu đơn giản là mức độ một element “chiếm sự chú ý” trong tổng thể bố cục.
Một element có Visual Weight lớn thường khiến mắt người xem chú ý trước hoặc cảm nhận nó như một điểm neo của thiết kế. Ngược lại, một element có Visual Weight nhỏ thường dễ dàng lùi xuống phía sau, đóng vai trò hỗ trợ thay vì trở thành tâm điểm.
Điều này không đồng nghĩa với việc element lớn luôn nặng hơn element nhỏ.
Một chấm đen nhỏ đặt giữa một khoảng trắng rộng đôi khi có thể gây chú ý mạnh hơn cả một vùng hình ảnh lớn. Một từ được viết bằng Bold có thể nổi bật hơn một câu dài sử dụng Light. Một màu đỏ rực có thể tạo ra điểm hút mắt mạnh dù chỉ chiếm vài phần trăm diện tích.
Vì vậy, khi nói một bố cục “nặng bên trái”, “nặng phía trên” hay “nặng ở trung tâm”, Designer không chỉ đang nói về kích thước. Họ đang nói về sự phân bổ chú ý trong không gian.
Đây chính là điểm khiến Visual Weight trở thành một khái niệm quan trọng trong Composition.
Vì sao hai bên bằng nhau nhưng bố cục vẫn không cân?
Một trong những hiểu lầm phổ biến nhất về cân bằng trong thiết kế là cho rằng chỉ cần chia bố cục thành hai phần bằng nhau là đủ.
Nhưng mắt người không đo bố cục bằng thước.
Hãy tưởng tượng một poster được chia thành hai nửa bằng nhau. Bên trái là một hình ảnh lớn nhưng rất sáng, ít tương phản. Bên phải là một hình vuông nhỏ màu đen nằm trên nền trắng.
Về diện tích, hai bên gần như không có lý do để mất cân bằng.
Nhưng về cảm nhận, hình vuông đen có thể tạo ra một “lực hút” rất mạnh.
Đó là bởi Visual Weight không phụ thuộc đơn thuần vào diện tích mà phụ thuộc vào cách một element nổi bật trong môi trường xung quanh.
Một vật thể càng tương phản với phần còn lại, nó càng dễ tạo ra trọng lượng thị giác lớn. Một element càng cô lập, đậm, tối, bão hòa hoặc có hình dạng phức tạp, nó càng có khả năng trở thành điểm chú ý.
Do đó, khi đánh giá một layout, Designer không nên chỉ hỏi:
Mà nên hỏi:
Hai câu hỏi này hoàn toàn khác nhau.
Những yếu tố tạo nên Visual Weight
Visual Weight được hình thành từ nhiều yếu tố cùng lúc. Không có một công thức cố định cho mọi trường hợp, bởi trọng lượng của một element luôn phụ thuộc vào mối quan hệ giữa nó với những element còn lại.
Kích thước
Đây là yếu tố dễ nhận biết nhất.Một hình ảnh lớn thường có Visual Weight lớn hơn một hình ảnh nhỏ. Một headline chiếm gần một nửa poster rõ ràng có sức nặng cao hơn một caption nhỏ ở cuối trang.
Tuy nhiên, kích thước chỉ là điểm khởi đầu.
Một vùng lớn nhưng có độ tương phản thấp có thể trở nên nhẹ hơn một element nhỏ nhưng tương phản mạnh. Vì vậy, việc tăng kích thước không phải lúc nào cũng là cách tốt nhất để tạo hierarchy.
Màu sắc
Màu sắc có thể thay đổi trọng lượng của một element gần như ngay lập tức.Những màu có độ tương phản cao, màu tối hoặc màu bão hòa thường dễ tạo cảm giác nặng hơn. Một mảng đen trên nền trắng là ví dụ kinh điển: diện tích có thể nhỏ nhưng Visual Weight lại rất rõ ràng.
Ngược lại, những màu nhạt, gần với màu nền hoặc có saturation thấp thường dễ lùi lại.
Đây cũng là lý do một Designer có thể sử dụng một màu accent chỉ trên một element nhỏ nhưng vẫn khiến element đó trở thành điểm chú ý chính.
Độ tương phản
Contrast là một trong những công cụ mạnh nhất để điều khiển Visual Weight.Một element càng khác biệt so với môi trường xung quanh, nó càng dễ được phát hiện.
Một chữ đen trên nền trắng có contrast rất cao. Một chữ xám nhạt trên nền xám sáng thì ngược lại.
Nhưng contrast không chỉ nằm ở màu sắc. Nó có thể đến từ kích thước, hình dạng, texture, độ sắc nét, typography hoặc thậm chí là khoảng trống.
Một hình ảnh sắc nét đặt cạnh một vùng blur cũng tạo ra contrast. Một hình vuông đặt giữa những hình tròn cũng tạo ra contrast. Một font Bold đứng giữa một hệ thống typography mảnh cũng vậy.
Độ đậm của Typography
Typography là một trong những nơi Visual Weight thể hiện rõ nhất.Cùng một kích thước, cùng một từ và cùng một vị trí, nhưng một phiên bản Light và một phiên bản Black sẽ tạo ra cảm giác hoàn toàn khác nhau.
Font weight càng lớn, nét chữ càng dày thì text càng có xu hướng trở thành một khối thị giác.
Đây là lý do Designer thường sử dụng sự tương phản giữa Regular, Medium, Semibold và Bold để tạo hierarchy thay vì chỉ tăng kích thước chữ.
Một headline không nhất thiết phải thật lớn để nổi bật. Đôi khi chỉ cần tăng weight, thay đổi contrast hoặc giảm khoảng cách xung quanh là đủ.
Mật độ
Một element chứa nhiều chi tiết thường có Visual Weight lớn hơn một element đơn giản.Hãy thử đặt một bức ảnh đầy người, nhiều vật thể và texture cạnh một vùng màu phẳng. Dù hai vùng có kích thước tương đương, bức ảnh thường thu hút mắt hơn.
Điều này liên quan đến visual density – mật độ thông tin thị giác.
Một vùng càng nhiều chi tiết, đường nét, texture hoặc pattern, nó càng có khả năng tạo cảm giác “nặng”.
Đó cũng là lý do khoảng trắng có vai trò quan trọng. White Space không chỉ làm thiết kế thoáng hơn mà còn giúp giảm mật độ thị giác, từ đó làm những khu vực khác trở nên nổi bật hơn.
Isolation – Sự cô lập
Một element đứng một mình trong không gian rộng có thể trở nên cực kỳ mạnh.Đây là một nghịch lý thú vị của Visual Weight: đôi khi càng ít thứ xung quanh, một element càng có khả năng thu hút sự chú ý.
Một dấu chấm nhỏ nằm giữa một vùng trắng rộng có thể gây chú ý hơn hàng chục element được đặt sát nhau.
Đây chính là lý do Negative Space và Visual Weight có mối quan hệ rất chặt chẽ.
Khoảng trống không làm element biến mất. Ngược lại, nó có thể biến một element nhỏ thành một điểm neo rất mạnh.
Visual Weight và Balance: Hai khái niệm không thể tách rời
Nếu Visual Weight nói về “sức nặng” của các element, thì Balance nói về cách những sức nặng đó được phân bố trong bố cục.
Một bố cục cân bằng không nhất thiết phải đối xứng.
Có hai dạng cân bằng quen thuộc: Symmetrical Balance và Asymmetrical Balance.
Symmetrical Balance phân bổ các element tương đối giống nhau ở hai phía của một trục. Cách này tạo cảm giác ổn định, rõ ràng và dễ kiểm soát.
Nhưng Asymmetrical Balance thú vị hơn.
Một hình ảnh lớn ở bên trái có thể được cân bằng bởi một nhóm typography nhỏ ở bên phải. Một mảng tối có thể được đối trọng bằng một vùng màu sáng nhưng bão hòa. Một object lớn có thể được cân bằng bởi nhiều object nhỏ.
Điều quan trọng không phải là hai phía có cùng số lượng element.
Điều quan trọng là tổng Visual Weight của chúng tạo ra cảm giác ổn định.
Có thể hình dung bố cục giống như một chiếc cân. Một vật thể lớn không nhất thiết phải được cân bằng bằng một vật thể có kích thước tương đương. Một vật nhỏ nhưng rất nặng vẫn có thể tạo ra lực đối trọng đáng kể.
Trong thiết kế cũng vậy.
Vị trí cũng làm thay đổi trọng lượng
Visual Weight không chỉ phụ thuộc vào bản thân element mà còn phụ thuộc vào vị trí của nó.Một element đặt gần trung tâm thường có cảm giác ổn định hơn. Khi element di chuyển về các vùng biên, đặc biệt là gần mép bố cục, cảm giác về lực và cân bằng bắt đầu thay đổi.
Một object nằm sát cạnh poster có thể tạo ra cảm giác như nó đang “kéo” bố cục về phía đó.
Trong nhiều trường hợp, Designer có thể cố tình sử dụng hiệu ứng này để tạo tension.
Ví dụ, một typography lớn bị crop khỏi cạnh poster có thể khiến bố cục có cảm giác chuyển động. Một hình ảnh bị đẩy sát mép có thể tạo cảm giác năng động hơn một hình ảnh được đặt hoàn toàn trong khung.
Đây là điểm mà Visual Weight bắt đầu liên quan đến Movement trong Composition.
Mắt không chỉ nhìn vào một điểm. Nó di chuyển giữa các điểm có trọng lượng khác nhau.
Nếu những điểm đó được sắp xếp có chủ đích, Designer có thể tạo ra một đường đi cho ánh nhìn.
Khi Visual Weight tạo ra Visual Hierarchy
Visual Hierarchy thường được giải thích bằng kích thước và typography, nhưng thực tế nó rộng hơn nhiều.
Khi một element có Visual Weight lớn, nó có xu hướng được nhìn thấy trước. Sau đó mắt chuyển sang những element có trọng lượng thấp hơn.
Như vậy, hierarchy không chỉ là:
Lớn → nhỏ
mà có thể là:
Nặng → nhẹ → nặng → nhẹ
hoặc thậm chí là một chuỗi phức tạp hơn.
Một poster có thể có headline rất lớn nhưng không phải là thứ được nhìn thấy đầu tiên nếu hình ảnh có contrast mạnh hơn. Một button nhỏ có thể trở thành điểm chú ý nếu màu sắc của nó khác biệt hoàn toàn với phần còn lại.
Điều này dẫn đến một nguyên tắc quan trọng:
**Hierarchy không phải thứ Designer nói cho người xem biết
