Slide tương tác người máy chương 6 thiết kế giao diện tương tác người dùng

PHẦN III: THIẾT KẾ GIAO DIỆN TƯƠNG TÁC NGƯỜI DÙNG – MÁY TÍNH CuuDuongThanCong.com https://fb.com/tailieudientucntt CHƯƠNG I THIẾT KẾ LẤY NGƯỜI DÙNG LÀM TRUNG TÂM I Khái niệm II Nguyên tắc III Các phương pháp thiết kế lấy người dùng làm trung tâm IV Thiết kế hợp tác CuuDuongThanCong.com https://fb.com/tailieudientucntt Thiết kế lấy người dùng làm trung tâm (User-centered design) • Đặt (yêu cầu của) người dùng vào trung tâm trình thiết kế phát triển • Tiến hành thử nghiệm đánh giá với người dùng • Thiết kế tương tác • Quy trình thiết kế quy trình lặp CuuDuongThanCong.com https://fb.com/tailieudientucntt Quy trình thiết kế lấy người dùng làm trung tâm • Đặc tả yêu cầu – Người dùng – Mục đích họ – Nhiệm vụ họ muốn hồn thành • Phân tích nhiệm vụ – Đặc trưng hóa bước mà người dùng cần thực – Xây dựng kịch việc sử dụng – Đưa định hỗ trợ đối tượng người dùng loại nhiệm vụ • Thiết kế dựa phân tích • Đánh giá – Thử nghiệm giao diện – Đánh giá trước cài đặt CuuDuongThanCong.com https://fb.com/tailieudientucntt CHƯƠNG I THIẾT KẾ LẤY NGƯỜI DÙNG LÀM TRUNG TÂM I Khái niệm II Nguyên tắc III Các phương pháp thiết kế lấy người dùng làm trung tâm CuuDuongThanCong.com https://fb.com/tailieudientucntt Mục tiêu Khen thưởng (rewarding) Tạo cảm xúc (emotionally fulfilling) Hỗ trợ sáng tạo (supportive of creativity ) Đáp ứng sở thích thâm mỹ (aesthetically pleasing ) Thỏa mãn (satisfying) Thiết kế phù hợp với kinh nghiệm người dùng Tạo động (motivating) Vui vẻ (fun) Hữu ích (helpful) CuuDuongThanCong.com Thú vị (enjoyable) Giải trí (entertaining) https://fb.com/tailieudientucntt Mục tiêu Khen thưởng (rewarding) Hỗ trợ sáng tạo (supportive of creativity ) Đáp ứng sở thích thâm mỹ (aesthetically pleasing ) Hiệu Dễ học Hữu ích (helpful) Thỏa mãn (satisfying) Năng suất Thiết kế đảm Thiết kế phù hợp với Dễ nhớ bảo tính dùng kinh nghiệm người dùng Tạo động (motivating) CuuDuongThanCong.com Tạo cảm xúc (emotionally fulfilling) An tồn Tiện ích Giải trí (entertaining) https://fb.com/tailieudientucntt Thú vị (enjoyable) Vui vẻ (fun) Tương thích • Người dùng: Thiết kế phải thích hợp với nhu cầu người dùng • Nhiệm vụ: Thiết kế phải đảm bảo luồng liệu chức thực nhiệm vụ đề ra, người dùng cố gắng để thực nhiệm vụ đề • Sản phẩm: Người dùng hệ thống thường người dùng hệ thống phiên trước Vì sản phẩm phải thiết kế cho thói quen, mong đợi hiểu biết người dùng cũ áp dụng CuuDuongThanCong.com https://fb.com/tailieudientucntt Thẩm mỹ rõ ràng Thẩm mỹ • Một thiết kế có tính thẩm mỹ phải hút người dùng – Tuân theo số nguyên lý thiết kế chung: • Độ tương phản cao thành phần hình • Nhóm thành phần có chức năng, nhiệm vụ • Cho phép biểu diễn 3D – Sử dụng màu sắc đồ họa phải đơn giản hiệu CuuDuongThanCong.com Rõ ràng • Giao diện phải rõ ràng mặt hiển thị, thiết kế ngữ nghĩa – Các thành phần hiển thị – Các chức – Các từ văn https://fb.com/tailieudientucntt Dễ cấu hình qn Cấu hình • Cho phép dễ dàng cá nhân hóa cung cấp khả cấu hình – Nâng cao độ nhạy mặt điều khiển – Khuyến khích người dùng chủ động tìm hiểu CuuDuongThanCong.com Nhất qn • Một hệ thống phải nhìn thấy, phản ứng, thao tác theo cách ngữ cảnh – Cùng thành phần phải : • Có diện mạo • Có tính sử dụng • Hoạt động tương tự – Cùng hành động phải cócùng kết – Chức thành phần phải cố định – Vị trí thành phần chuẩn hóa phải giữ cố định https://fb.com/tailieudientucntt 10 Nhóm thơng tin • Các thơng tin liên quan nhóm với nhau, có tiêu đề rõ ràng, có khoảng cách đường viền màu hợp lý CuuDuongThanCong.com https://fb.com/tailieudientucntt 74 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 75 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 76 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 77 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 78 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 79 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 80 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 81 Một số ví dụ hình CuuDuongThanCong.com https://fb.com/tailieudientucntt 82 Thiết kế hình cho Online Pizza Ordering System: đăng nhập, đăng ký người dùng CuuDuongThanCong.com https://fb.com/tailieudientucntt 83 Thiết kế hình cho Online Pizza Ordering System: chọn CuuDuongThanCong.com https://fb.com/tailieudientucntt 84 Thiết kế hình cho Online Pizza Ordering System: chọn phụ CuuDuongThanCong.com https://fb.com/tailieudientucntt 85 Thiết kế hình cho Online Pizza Ordering System: xác nhận đơn hàng CuuDuongThanCong.com https://fb.com/tailieudientucntt 86 Liệt kê tình tương tác thơng qua giao diện Online Pizza Ordering System CuuDuongThanCong.com https://fb.com/tailieudientucntt 87 CuuDuongThanCong.com https://fb.com/tailieudientucntt 88 ... Thiết kế lấy người dùng làm trung tâm (User-centered design) • Đặt (yêu cầu của) người dùng vào trung tâm trình thiết kế phát triển • Tiến hành thử nghiệm đánh giá với người dùng • Thiết kế tương. ..CHƯƠNG I THIẾT KẾ LẤY NGƯỜI DÙNG LÀM TRUNG TÂM I Khái niệm II Nguyên tắc III Các phương pháp thiết kế lấy người dùng làm trung tâm IV Thiết kế hợp tác CuuDuongThanCong.com... (enjoyable) Vui vẻ (fun) Tương thích • Người dùng: Thiết kế phải thích hợp với nhu cầu người dùng • Nhiệm vụ: Thiết kế phải đảm bảo luồng liệu chức thực nhiệm vụ đề ra, người dùng cố gắng để thực