LUẬT XA GẦN VÀ BỐ CỤC TRONG THIẾT KẾ ĐỒ HỌA

BÀI 3: Nguyên lý Cân bằng và Nguyên lý Căn chỉnh

MUL114-LXG&BCTTKĐH
Bài online 3
MỤC TIÊU BÀI HỌC

 Tìm hiểu kỹ về nguyên lý Cân bằng và nguyên lý Căn chỉnh

 Nắm được tầm quan trọng của cân bằng và căn chỉnh trong thiết
kế đồ họa
 Hiểu về việc sử dụng lưới trong thiết kế trang
 Các kiểu căn chỉnh văn bản
NỘI DUNG BÀI HỌC

Nguyên lý Cân bằng:

 Cân bằng là gì?
 Trọng lượng hình ảnh
 Cân bằng đối xứng và không đối xứng
Nguyên lý Căn chỉnh:
 Căn chỉnh là gì?
 Ưu và nhược điểm trong việc sử dụng lưới
 Các kiểu căn chỉnh văn bản.
CÂN BẰNG
 Nội dung 1: NGUYÊN LÝ CÂN BẰNG

 Nguyên lý cân bằng là gì?

 Tại sao phải sử dụng nguyên lý cân bằng trong thiết kế?
 Làm thế nào để sử dụng được nguyên lý cân bằng hiệu quả
trong thiết kế?

?
?
 Vấn đề 1:
Chủ nhật tuần này, Thảo được một người bạn mới quen mời đến nhà chơi. Thảo
rất hào hứng muốn đến thăm căn hộ chung cư của người bạn mới này vì Thảo
thấy người bạn này rất thú vị. Khi bước vào căn hộ Thảo rất ngạc nhiên khi thấy
toàn bộ đồ đạc trong phòng khách được xếp dồn vào một bên tường. Bằng sự
suy đoán, Thảo nghĩ rằng người bạn này chắc vừa mới chuyển đến căn hộ này,
Thảo nói” Căn hộ đẹp quá! Nó sẽ là một nơi tuyệt đẹp sau khi dọn dẹp và trang
trí. Bạn chuyển tới đây khi nào vậy?” .
“Tôi ở đây được 5 năm rồi”, người bạn mới quen đáp lại, đưa mắt nhìn Thảo một
cách khác lạ. Thảo bối rối hỏi: “ Bạn đang trang trí lại căn hộ hay lau chùi lại
thảm phải không?” “ Không , phòng khách của tôi lúc nào cũng thế đấy” người
bạn trả lời.
Thảo nhận ra rằng người bạn của mình có phần lập dị. Và có lẽ đã đến lúc về rồi.
 Nội dung 1.1: Cân bằng là gì?

 Thiết kế cân bằng là thiết kế trong đó mức độ tác

động thị giác của tất cả các phần tử (hình ảnh,
text..) được dàn đều trên toàn bộ layout.
 Mỗi phần tử có một mức tác động thị giác riêng.
 Thiết kế cân bằng kiên định hơn nhiều so với
thiết kế không cân bằng.
Nội dung 1.1: Cân bằng là gì?

Sự sắp xếp thiếu tính cân bằng

trong một không gian phòng khách.
Nội dung 1.2: Trọng lượng hình ảnh?

 Trọng lượng hình ảnh là trọng lượng

ảo của yếu tố hình ảnh trên trang

Bốn biến thể của tác động thị giác.

 Nội dung 1.2: Trọng lượng hình ảnh?

 Size, màu sắc, bold, chất liệu của hình ảnh góp phần vào
trọng lượng hình ảnh.
 Hình ảnh mang trọng lượng hơn văn bản, người đọc có xu
hướng nhìn vào hình ảnh trước khi văn bản.
 Khi xác định sự cân bằng trọng lượng của mỗi yếu tố phải
xem xét và cân đối lại với các yếu tố khác trên trang.
 Nội dung 1.3: Cân bằng đối xứng và không đối xứng?

Có 2 kiểu cân bằng:

Trong cân bằng đối xứng Trong cân bằng không đối xứng
các yếu tố hình ảnh được nhân yếu tố thị giác được bố trí không
đôi từ bên này sang bên kia hoặc đồng đều, không cân bằng
từ trên xuống dưới
Nội dung 1.3: Bố cục cân bằng đối xứng

 Dễ dàng khởi tạo

 Truyền đạt cảm giác trang trọng,
trang nghiêm, và lịch sự
 Thiếu chuyển động và thường tĩnh
 Là giải pháp an toàn
Nội dung 1.3: Bố cục cân bằng đối xứng

 Bố cục đối xứng được xác định

bằng cách vẽ một đường trục ảo
thông qua trung tâm của trang.

Một layout đối xứng

Nội dung 1.3: Bố cục cân bằng không đối xứng

 Khó khởi tạo hơn

 Truyền đạt cảm giác chuyển động
năng động?
 Trực quan thú vị
Nội dung 1.3: Bố cục cân bằng không đối xứng

 Để xác định bố cục không đối xứng vẽ một

đường trục ảo thông qua các trung tâm
của trang.
 Hai nửa sẽ khác nhau, nhưng bố cục thành
công vẫn sẽ được trực quan cân bằng.

Layout bất đối xứng

 Ví dụ về sự cân bằng:

 Quá nhiều không gian trắng (không gian

không có yếu tố thị giác) ở dưới cùng trang
 Sự nhấn mạnh còn yếu
 Ví dụ về sự cân bằng:

 Sự cân bằng đã tốt hơn, tuy nhiên vẫn còn

một số vấn đề:
• Những con bọ và những dòng tiêu đề vẫn
đang có kích thước giống nhau, trong khi
đó cũng là thành phần quan trọng
• Màu sắc chỉ được áp dụng ở dòng tiêu đề
tạo cảm giác nặng nề cho trang

Thiết kế bất đối xứng với sự áp

dụng nguyên lý tương phản.
 Ví dụ về sự cân bằng:

 Bố cục đối xứng không cân bằng

được áp dụng tốt cho trang:
• Chữ ở các góc độ khác nhau tạo
cảm giác chuyển động
• Màu sắc và các kiểu chữ được áp
dụng cho phần tiêu đề

Thay đổi trong bố cục và ứng dụng

nguyên lý tương phản tạo hiệu quả tốt.
CĂN CHỈNH
 Nội dung 1: NGUYÊN LÝ CÂN BẰNG

 Nguyên lý căn chỉnh là gì?

 Tại sao phải sử dụng nguyên lý căn chỉnh trong thiết kế?
 Làm thế nào để áp dụng được nguyên lý căn chỉnh hiệu quả
trong thiết kế?

?
?
 Vấn đề 2:

Bạn đang trên hành lang của trường đế đến dự lớp học về thiết kế.
Trên đường đi, các bạn sẽ nhìn thấy các tấm poster, tờ rơi quảng cáo
và những thứ linh tinh được dán trên tường. Bạn nhận thấy có rất
nhiều những thôn tin về các khóa học cũng như những hoạt động của
hội sinh viên.
Khi đi qua hết tấm poster này tới tấm poster khác, bạn cảm thấy rất lạ
ở cách các tấm poster được sắp xếp với nhau. Trông chúng rất lộn xộn
không theo một trật tự dễ nhìn nào, thậm chí có những tờ dán bị lộn
ngược rất khó đọc. Mặc dù điều đó không sai, nhưng rõ ràng nó làm
cho người xem sẽ cảm thấy rất khó chịu.
 Nội dung 2.1 Căn chỉnh là gì?

 Căn chỉnh xảy ra khi các phần tử trực quan

được sắp hàng phù hợp so với những
phần tử trực quan khác trên trang.

Sự sắp xếp lộn xộn không theo trật

tự nào của những tấm poster.
 Nội dung 2.1 Căn chỉnh là gì?

 Trang có sự căn chỉnh mạnh mẽ sẽ có tổ chức hơn.

 Trang có sự căn chỉnh sẽ đạt hiệu quả tinh tế và chuyên nghiệp.

Quá trình căn chỉnh của 1 thiết kế danh thiếp

 Nội dung 2.1 Căn chỉnh là gì?
 Phần nội dung bên trái hiện không được căn chỉnh, sẽ tạo cảm giác lộn xộn

Thiết kế thiếu tính căn chỉnh.

 Nội dung 2.1 Căn chỉnh là gì?
 Phần nội dung đã được căn chỉnh, sẽ tạo cảm giác rõ ràng và có tổ chức hơn

Thiết kế đã được sử dụng căn chỉnh.

 Nội dung 2.2 : Ưu điểm của việc sử dụng lưới

 Lưới là một hệ thống các đường ngang và dọc, phân chia

trang và giúp các nhà thiết kế sắp xếp các yếu tố đồ hoạ
 Lưới sẽ không được in
 Ô lưới là bộ khung của một thiết kế , rất hữu dụng khi làm
việc với định dạng một trang hoặc nhiều trang.
Nội dung 2.2 : Ưu điểm của việc sử dụng lưới

 Sử dụng lưới giúp đơn giản hoá việc bố

trí yếu tố đồ hoạ
 Nâng cao tính thống nhất trong thiết kế
 Không gây rối, loạn trong thiết kế
 Nội dung 2.2 : Ưu điểm của việc sử dụng lưới

 Các đường nét đứt cho thấy cấu trúc cơ

bản của lưới thiết kế trang này

Phác họa cấu trúc ô lưới

 Nội dung 2.3 : Cân nhắc khi sử dụng ô lưới
 Lưới cần được vẽ trước khi thiết kế
 Xác định lưới giúp nhà thiết kế quyết định nơi đặt tiêu đề,
đầu đề, nội dung, đồ họa và các yếu tố thị giác khác.
 Nội dung 2.3 : Cân nhắc khi sử dụng ô lưới

Những mô tả có thể xảy ra khi không sử dụng cấu trúc ô lưới

Nội dung 2.3 : Cân nhắc khi sử dụng ô lưới

 Lưới tốt sẽ giúp điều tiết các

yếu tố đồ hoạ

Các phần tử được sử dụng trong

thiết kế bản tin hoặc tạp chí
DÀN TRANG TẠP CHÍ
DÀN TRANG TẠP CHÍ
CÁC VÍ DỤ MINH HOẠ VỀ CỘT, LƯỚI
SỬ DỤNG LƯỚI ĐỂ CĂN CHỈNH NAME CAR
Nội dung 2.3 : Cân nhắc khi sử dụng ô lưới
 Khi thiết kế với cấu trúc lưới cần chú ý tới
chiều rộng của cột nội dung
 Lưới với các cột dày hoặc mỏng sẽ làm
giảm khả năng đọc
2 Biến thể của cùng một bản tin xây dựng
trong 2 chương trình máy tính khác nhau.
 Nội dung 2.3 : Cân nhắc khi sử dụng ô lưới

 Hình ảnh cho thấy 3 kích thước

khác nhau của khu nội dung
 Phần hiển thị cột nội dung cuối
cùng dễ đọc nhất

Nghiên cứu về độ rộng cột

 Nội dung 2.4 : Căn chỉnh văn bản

 Một khía cạnh quan trọng của việc căn chỉnh là căn chỉnh
chữ (nội dung)
 Việc căn chỉnh mạnh sẽ tăng tính dễ đọc và có tổ chức
 Văn bản không được căn chỉnh dẫn đến khó khăn trong
việc đọc và không có tổ chức
 Nội dung 2.4 : Căn chỉnh văn bản

 Căn chỉnh văn bản cơ bản

• Flush Left (dàn đều bên trái)
• Flush Right (dàn đều bên phải)
• Centered (căn giữa)
• Justified (dàn đều hai bên)
 Kỹ thuật căn chỉnh nâng cao:

• Bẻ văn bản
• Không đối xứng
• Khối văn bản
 Nội dung 2.4.1 : Căn trái

 Cách căn chỉnh văn bản cơ bản

nhất là căn trái, phải
 Làm tính dễ đọc tốt hơn
 Nội dung 2.4.2 : Căn phải

 Hiệu quả hơn với đoạn nội dung ngắn

 Gây khó cho người đọc khi tìm kiếm
dòng nội dung tiếp theo
 Nội dung 2.4.3 : Căn giữa

 Mang tính trang trọng

 Hiệu quả với những đoạn nội
dung ngắn
Nội dung 2.4.4 : Căn chỉnh cân xứng

 Cả bên trái và phải đều được căn chỉnh

 Tăng tính dễ đọc
 Áp dụng được cho đoạn văn bản dài
Nội dung 2.4.4 : Căn chỉnh cân xứng

 Thường sử dụng trên báo giấy, tạp

chí, brochures
 Thường được sử dụng để loại bỏ sự
phát triển của không gian trắng
 Nội dung 2.4.5 : Bẻ văn bản

 Đây là kỹ thuật nâng cao của căn chỉnh

văn bản
 Thường được hiểu là bẻ chữ (wraptext)
 Chữ sẽ chạy quanh một yếu tố đồ hoạ
Nội dung 2.4.6 : Căn chỉnh không đối xứng

 Thường sử dụng ở cuối hoặc bắt đầu

một dòng
 Gây khó đọc
 Nên hạn chế sử dụng
 Truyền tải cảm giác thân mật và tràn
đầy năng lượng
Nội dung 2.4.7 : Căn chỉnh dạng khối văn bản

 Nội dung được xếp theo dạng hình khối

 Khó đọc, tuy nhiên đây là cách căn chỉnh
rất sáng tạo
 Ví dụ về căn chỉnh

 Card trên hiện đang được căn chỉnh theo nhiều phía
 Nội dung rất khó đọc
 Ví dụ về căn chỉnh

 Sau khi sử dụng nguyên lý căn chỉnh

 Nội dung rõ ràng hơn rất nhiều.
 TỔNG KẾT
 Các thiết kế trang sẽ hoạt động tốt hơn, và dễ đọc hơn khi những phần tử
trực quan được nhóm lại với nhau một cách thông minh, có chủ ý.
 Độc giả sẽ cảm thấy thoải mái hơn với một thiết kế trang cân bằng và muốn
đọc chúng hơn.
 Có hai loại cân bằng: đối xứng và không đối xứng.
 Các yếu tố trọng lượng phải được xem xét để có sự cân bằng trong khi thiết
kế
 Cấu trúc lưới có ích trong việc sắp xếp yếu tố đồ họa trên trang.
 Có 4 kiểu căn chỉnh cơ bản và 3 kiểu căn chỉnh nâng cao
 Mỗi loại căn chỉnh văn bản ảnh hưởng đến tổng thể của trang.
 Cách căn trái hợp lý rất dễ đọc nhất và được sử dụng nhiều nhất trong các bố
cục trang.