Design

Thang Kim

Use Figma for design

A suggest em học và sài Figma để thiết kế Web & Mobile app

Xem e se hiểu cách sài tools, chức năng đặc biết, sao nên sài nó thay vì PTS và các tools khác. E đã biết PTS và AI thì sài Figma sẽ dễ hơn.

Review

A xem vài trang e gửi. Project đầu nhìn khá ổn.

Nhưng e sử dụng rất nhiều (4 font chữ khác nhau), và nhiều size k có thống nhất vs nhau, làm cho design bị rối. E nên sài 1-2 font family, size chữ cũng phải thống nhất (e nên chốt h1-h6 bao nhiêu, p1-p4 bao nhiêu, sử dụng trong trường hợp nào)

Dữ consistent mọi nơi

Cách viết cũng phải thống nhất. "Product Care", "Terms & Conditions", "Privacy Policy" các chữ đầu viết hoa, nhưng "Contact us", "About us" - "us" viết chữ thường

Icon

Icon nếu e sử dụng style filled (như trong icon shipping) thì các icon khác phải theo style đấy. Ở đây money back guarantee. e lại sài outline style - k consistent

Underline = Link

Như người dùng lúc a nhìn thấy element underline như vậy, a sẽ nghĩ là đường link, và sẽ bị confuse

Column grid

A thấy e có dùng grid trong design, nhưng các element thì k align theo nó.

E nên sử dụng grid như thế này

Use 8px grid. V ertical rhythm

Để cái design nhìn professional e phải sử dụng grid - ví dụ như 8px grid.

E nên tham khảo thêm:

More Practice

Các form, icon search, font chữ... E cần practice để làm cái các element cân đối hơn.

A suggest e xem nhiều và kiếm references chất lượng trên Dribbble, Behance, Awwwards r copy sài Figma, áp đụng 8px grid, và column grid. Để luyện figma, chắc basic design principles như Proximity & Similarity nhơ bố cục, visual solution, để sau sài trong thiết kế của mình.

Material Design Google

Để biết thêm về design, e nên đọc Google Material Design từ A-Z

Basic UX Principles.

Cách pick màu

Color in UI Design: A (Practical) Framework

Sources

Icons:

Photos:

Design

Use Figma for design

Review

Report Page