UI/UX

Card là gì?

Card là khối giao diện hình chữ nhật gom hình ảnh, tiêu đề, mô tả và hành động liên quan đến cùng một đối tượng, giúp người dùng lướt và so sánh nhiều mục nhanh.

Hiểu kỹ hơn

Mỗi card đại diện cho một đối tượng như một sản phẩm, một bài viết hay một khoá học, và các card cùng loại có cấu trúc giống nhau để mắt dễ so sánh. Card thường được tách khỏi nền bằng viền mảnh, bóng đổ nhẹ hoặc màu nền khác, kèm bo góc. Trong Figma, card nên dựng bằng auto layout dọc với padding và gap cố định, ảnh đặt Fill container, rồi biến thành component để dùng lại trong lưới. Ví dụ: kết quả tìm kiếm trên các ứng dụng đặt phòng là lưới card gồm ảnh, tên chỗ ở, đánh giá và giá. Lỗi thường gặp là nhồi quá nhiều nút và thông tin vào một card, hoặc làm cả card bấm được nhưng bên trong lại có thêm nhiều nút khác, khiến người dùng không biết bấm vào đâu sẽ dẫn tới đâu.

Card (thẻ nội dung)

Học viên ColorME làm Card

Kiểm tra nhanh

Bộ câu hỏi ôn tập về UI/UX

Làm thử

Thuật ngữ liên quan