Thiết kế User Flows càng tốt thì người dùng càng dễ hiểu câu chuyện đằng sau thiết kế và do đó, họ sẽ đưa ra phản hồi mang tính xây dựng càng cao.
Bài viết này sẽ giúp bạn thiết kế User Flows dễ đọc và trực quan.
1. Đặt tên mô tả
Luôn đặt tên mang tính mô tả, đơn giản cho User Flows của bạn để mô tả nội dung của luồng đó.
Ví dụ: bạn có thể gọi nó là “Điều hướng từ trang chủ đến trang tổng quan”.
Điều này cũng sẽ khuyến khích bạn chia nhỏ các luồng của mình, thay vì bao gồm nhiều luồng vào một bước và gây khó hiểu.
2. Luồng một chiều
Khi thiết kế User Flows, hãy tập trung vào luồng một chiều.
Hãy nghĩ về giao thông trên đường là bạn hiểu. Cảnh tượng người đi đường ngược xuôi rất là hỗn loạn, khó kiểm soát.
Một dự án nhỏ với vài trang thì sẽ không có vấn đề gì. Nhưng nếu là dự án lớn mà khách hàng đang đầu tư rất nhiều tiền vào và bạn phải thiết kế vài chục trang với User Flows hỗn loạn như hệ thống đường cao tốc phức tạp – chẳng mấy chốc bạn sẽ không biết phải làm gì tiếp theo. Vì vậy, hãy đảm bảo User Flows của bạn không kết thúc như thế này.
Các luồng (đường và mũi tên) phải luôn đi theo một hướng tuyến tính – không bao giờ có luồng hai chiều giữa các màn hình cho một hành động.
3. Một mục tiêu cho mỗi luồng
Tốt hơn hết bạn nên thiết kế các luồng với một mục tiêu tại một thời điểm.
Là một designer, nếu bạn không thể giữ sự chú ý của mình trong khi thiết kế sản phẩm của mình, làm thế nào người dùng có thể giữ sự chú ý của họ và tập trung vào một nhiệm vụ?
Đừng bao giờ thiết kế thứ gì đó chen ngang khi người dùng đang cố gắng hoàn thành nhiệm vụ nào đó.
Hãy giúp họ đạt được một mục tiêu tại một thời điểm, thay vì khiến họ mất tập trung.
Ví dụ: Khi người dùng bấm nút đăng bài, đừng bật ra popup yêu cầu họ cập nhật hồ sơ.
4. Luôn có key chú giải
Việc sử dụng key chú giải sẽ giúp User Flows của bạn dễ hiểu hơn ngay cả với những người mới (những người không quen đọc các loại sản phẩm này) và giúp họ hiểu ngay ý nghĩa của các hình khối, màn hình và các mũi tên.
Ví dụ: Trong chú giải của bạn, hãy chỉ định hình tròn là điểm bắt đầu, hình chữ nhật là màn hình và hình thoi đại diện cho các quyết định, v.v.
5. Quyết định điểm bắt đầu
Điều quan trọng là User Flows của bạn phải bắt đầu với một điểm rõ ràng.
Nếu User Flows của bạn không có điểm bắt đầu rõ ràng (ví dụ như bắt đầu từ màn hình đăng nhập hoặc từ trang chủ), thì sẽ rất khó thiết lập hành trình tuyến tính từ đầu đến cuối khi người dùng điều hướng đến mục tiêu của họ.
Nếu có nhiều điểm bắt đầu, hãy đảm bảo chúng được chỉ định rõ ràng hoặc xem xét chia chúng thành các luồng khác nhau.
Hãy đảm bảo bạn biết rõ người dùng đang truy cập vào ứng dụng hoặc trang web từ đâu để bạn bắt đầu thiết lập luồng.
6. Gán nhãn rõ ràng
Việc gắn nhãn rõ ràng cho từng hành động, màn hình và quyết định trong User Flows là rất quan trọng.
Điều này có nghĩa là bạn cần gắn nhãn màn hình đăng nhập là “Màn hình đăng nhập” nếu đó là hình chữ nhật; hoặc “đăng nhập hoặc đăng ký” nếu đó là một quyết định.
Cố gắng tránh những nhãn dài dòng và những thông tin không cần thiết, chẳng hạn như “Đăng nhập nếu đã có tài khoản hoặc đăng ký nếu chưa có tài khoản”.
Nếu tài liệu User Flows của bạn bao gồm các màn hình thực tế từ Wireframes hoặc Prototype, thì bạn có thể gắn nhãn cho chúng hoặc bao gồm các ghi chú ngắn gọn bên dưới mỗi màn hình.
7. Sử dụng màu sắc khôn khéo
Nếu bạn định đưa một chút màu sắc vào User Flows của mình thì bạn nên sử dụng nó có mục đích (mô tả màu rõ ràng, càng dùng ít càng tốt), hoặc tốt nhất là không sử dụng màu sắc.
Ví dụ: Sử dụng màu riêng cho từng thành phần khác nhau trong User Flows để người đọc có thể dễ dàng hiểu mã màu.
Bạn có thể dùng màu xanh lam cho màn hình, màu xanh lá cây cho các quyết định, màu vàng cho các điểm bắt đầu, v.v.
8. Đưa ra giải pháp rõ ràng
Luôn đảm bảo User Flows của bạn hoàn tất khi đạt được mục tiêu.
Đừng để xảy ra tình trạng không rõ ràng, nếu không mục đích tạo ra luồng đó sẽ thất bại.
Ví dụ: Khi người dùng đăng ký bản tin, theo quy định người dùng phải đồng ý vào chính sách sử dụng thông tin. Vì vậy, đừng để họ đồng ý cũng được, không đồng ý cũng không sao. Thay vào đó, bạn phải hướng họ qua màn hình chính sách, yêu cầu họ đọc, nhấn đồng ý rồi mới cho đăng ký thành công.
Bằng cách vạch ra mọi thứ rõ ràng, bạn sẽ không bỏ sót thứ gì hoặc để lại mâu thuẫn và các rủi ro tiềm ẩn.
Nguồn: justinmind.com
Tham gia Khóa học Thiết kế UI/UX chuyên nghiệp của iDesign, bạn sẽ thành thạo kỹ năng thiết kế UI/UX cho mobile apps và website chỉ sau 03 tháng. iDesign cam kết hỗ trợ việc làm!
Đồ án GD31 – Thiết kế đồ họa: Tiệm bánh CLOVER
