Buoi 4 Layout & Grid (II)

Page 1

Lớp học UIF

Layout & Grid (II)

Buổi 4


Buổi 1: Introduction to UIF

Buổi 6: Typography (II)

Buổi 2: UI Component

Buổi 7: Color (I)

Buổi 3: Layout & Grid (II)

Buổi 8: Color (II)

Buổi 4: Layout & Grid (II)

Buổi 9: Review & Quiz Test Chia sẻ lộ trình phát triển

Buổi 5: Typography (I) Quiz Test

Buổi 10: Practicing Test


PRINCIPLES OF DESIGN Balance

Balance Cân bằng

là sự phân bố trọng lượng thị giác (visual weight) của các đối tượng, màu sắc, kết cấu và không gian.

Khái niệm


PRINCIPLES OF DESIGN Balance

Cân bằng đối xứng Symmetrical / Formal Balance

Phân loại


PRINCIPLES OF DESIGN Balance

Cân bằng bất đối xứng Asymmetrical / Informal Balance

Phân loại


PRINCIPLES OF DESIGN Balance

Cân bằng hướng tâm Radial Balance

Phân loại


PRINCIPLES OF DESIGN Balance

Cân bằng ghép mảnh Mosaic / Crystallographic Balance

Phân loại


PRINCIPLES OF DESIGN Balance

Visual Weight Trọng lượng thị giác

là trọng lượng cảm nhận của một yếu tố trong bản thiết kế, được đánh giá bằng sự nổi bật của yếu tố đó so với các yếu

tố khác xung quanh nó.

Visual Weight


PRINCIPLES OF DESIGN Balance

Trọng lượng thị giác theo kích thước

Visual Weight


PRINCIPLES OF DESIGN Balance

Trọng lượng thị giác theo mật độ

Visual Weight


PRINCIPLES OF DESIGN Balance

Trọng lượng thị giác theo màu sắc

Visual Weight


PRINCIPLES OF DESIGN Balance

Trọng lượng thị giác theo độ tương phản

Visual Weight


PRINCIPLES OF DESIGN Balance

Visual Tension


PRINCIPLES OF DESIGN Balance

Visual Tension Căng thẳng thị giác

được tạo ra bằng cách sắp xếp các yếu tố đồ họa và điều chỉnh mối quan hệ của chúng với nhau, để tạo ra cảm giác mất cân bằng nhằm thu hút sự chú ý của người xem.

Visual Tension


PRINCIPLES OF DESIGN Balance

Visual Tension


PRINCIPLES OF DESIGN Balance

Visual Tension


PRINCIPLES OF DESIGN Balance

Visual Tension


PRINCIPLES OF DESIGN Proximity

Proximity Tiệm cận

các đối tượng ở gần nhau có khả năng được coi là một phần của cùng một nhóm - có cùng chức năng hoặc đặc điểm.

Khái niệm


PRINCIPLES OF DESIGN Proximity

Đặt các yếu tố liên quan gần nhau

Áp dụng


PRINCIPLES OF DESIGN Proximity

Đặt các yếu tố liên quan gần nhau

Áp dụng


PRINCIPLES OF DESIGN Proximity

Các yếu tố xa nhau tạo cảm giác không liên quan dễ bị bỏ qua

Áp dụng


PRINCIPLES OF DESIGN Proximity

Sự gần gũi giữa các đối tượng giúp thiết lập mối quan hệ giữa chúng

Sự gần gũi giúp người dùng hiểu, sắp xếp thông tin nhanh hơn và hiệu quả hơn

Áp dụng


PRINCIPLES OF DESIGN Reading Pattern

Reading Pattern Mô hình đọc

“Người dùng sẽ lướt và quét nội dung, trước khi họ thấy nội dung đó đáng để đọc.”

Khái niệm


PRINCIPLES OF DESIGN Reading Pattern

F-Pattern Chữ F

Phân loại


PRINCIPLES OF DESIGN Reading Pattern

Spotted Pattern Các điểm

Phân loại


PRINCIPLES OF DESIGN Reading Pattern

Layer Cake Pattern Lớp bánh

Phân loại


PRINCIPLES OF DESIGN Reading Pattern

Commitment Pattern Cam kết

Phân loại


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.