Bài giảng Thiết kế giao diện người dùng - Ngô Bá Nam Phương

Thiết kế giao diện người dùngGV : Ngô Bá Nam Phương Khoa CNTT – ĐHKHTNNội dungMục tiêuKiến trúc màn hìnhCách thức tiến hànhCải tiến màn hình với tính tiện dụng và hiệu quảThiết kế màn hình tra cứuThiết kế màn hình thực đơn1. Giới thiệuMục đích của việc thiết kế giao diện là nhằm mô tả cách thức giao tiếp giữa người sử dụng và phần mềm.Kết quả:Danh sách các màn hình.Thông tin chi tiết của từng màn hình.Màn hình thực đơn (Màn hình chính).Sơ đồ màn hình2. Kiến trúc màn hìnhThành phần nhập liệuThông tin kết quảCác nút xử lýMục tiêu: cho phép người sử dụng nhập dữ liệu dưới nhiều hình thức khác nhau.Hình thức 1: Hình thức 2:Hình thức 3:Hình thức 4:2.2 Thành phần thông tin kết quảMục tiêu: cho phép người dùng xem trực tiếp kết quả hay các thông tin tương ứng với dữ liệu nhập trên màn hình.Hình thức 1:Hình thức 2:2.3 Các nút xử lýMục tiêu: cho phép người dùng lựa chọn các tác vụ cần thực hiện trên màn hình giao diện.3. Cách thức tiến hành3. Cách thức tiến hành3. Cách thức tiến hànhLưu ýThành phần nhập liệu quyết định tính đúng đắn của màn hình giao diện. Nói một cách khác, màn hình giao diện với tính đúng đắn chỉ thành phần nhập liệu mà thôi.Thành phần thông kết quả quyết định tính hiệu quả và tiện dụng của màn hình giao diện.Khi thiết kế giao ta không cần thiết kế các nút xử lý vì trách nhiệm này thuộc về khâu “Thiết kế xử lý”.Bài tập làm ngayHãy thiết kế màn hình cho yêu cầu phần mềm lập phiếu mượn sách với tính đúng đắn.4. Cải tiến màn hình với tính tiện dụng và hiệu quảHãy cải tiến màn hình cho mượn sách với tính tiện dụng và tính hiệu quả.Màn hình cho mượn sách với tính đúng đắn:Cải tiến với tính tiện dụngKĩ thuật 1: Cung cấp thêm thông tin cho người dùng.Ví dụ:Cải tiến với tính tiện dụngCải tiến với tính hiệu quảKĩ thuật 2: Cung cấp giá trị định sẵn cho ô nhập liệu.Cải tiến với tính hiệu quảCải tiến với tính tiện dụngCải tiến với tính tiện dụngKĩ thuật 3: Cho phép nhập nhiều giá trị đồng thờiCải tiến với tính tiện dụngCải tiến với tính tiện dụngKĩ thuật 4: Suy nghĩ thấu đáo về nghiệp vụ và đưa ra các cải tiến phục vụ tối đa cho người dùng.Bài tập về nhàHãy thiết kế và cải tiến các màn hình với tính đúng đắn đã làm5. Thiết kế màn hình tra cứuMục tiêu: tăng tính tiện dụng và hiệu quả của người dùng khi tra cứu dữ liệu.Kiến trúc màn hình tổng quát:5.1. Kiến trúc màn hình tra cứuTiêu chuẩn tra cứuKết quả tra cứuCác nút xử lý5.2. Tiêu chuẩn tra cứuLà các thông tin mà người dùng có thể dựa vào đó để tra cứu dữ liệu.Các dạng thông tin người dùng có thể sử dụng để tìm kiếm dữ liệu là:Chuỗi ký tự.Ngày tháng.Giá trị số.Loại.5.3. Kết quả tra cứuLà dữ liệu thỏa mãn các tiêu chuẩn tra cứu của người dùng đưa vào được thể hiện hiện trên màn hình.Áp dụngVấn đề: Hãy thiết kế màn hình tra cứu Đại lý với tính đúng đắn và sau đó cải tiến màn hình này với tính hiểu quả và tiện dụng.Màn hình tra cứu đại lý với tính đúng đắn.Cải tiến màn hình tra cứu đại lý bằng cách bổ sung kết quả tra cứu.Cải tiến màn hình tra cứu đại lý bằng cách cải tiến kết quả tra cứu.Cải tiến màn hình tra cứu đại lý bằng cách bổ sung các ô nhập liệu ứng với thông tin của đối tượng tìm kiếm.6. Thiết kế màn hình thực đơnMục tiêu: cho phép người sử dụng chọn các công việc trên máy tính.Kết quả: Màn hình thực đơn với các nhóm công việc.Chi tiết từng nhóm công việc cụ thể.Các bước thực hiệnBước 1: Thiết kế màn hình thực đơn với tính đúng đắn.Bước 2: Cải tiến màn hình thực đơn với tính tiện dụng và hiệu quả.Các yêu cầu khi thiết kế màn hình thực đơnYêu cầu nghiệp vụ.Yêu cầu chất lượngYêu cầu hệ thốngThiết kế thực đơn với tính đúng đắnBước 1: Thiết kế màn hình thực đơn với tính đúng đắn: đơn giản là xác định danh sách các công việc và các nghiệp vụ mà phần mềm hỗ trợ.Thiết kế với tính tiện dụngBước 2: Thiết kế màn hình thực đơn với tính tiện dụng đơn giản là phân nhóm các công việc.Các cách phân nhómCách 1: Phân nhóm theo chức năng tin học.Hệ thốngLưu trữ, Cập NhậtTra cứuTính toánBáo biểuCách 2: phân nhóm theo đối tượngCách 3: phân nhóm theo nghiệp vụ, quy trình.Ứng dụngHãy thiết kế màn hình thực đơn cho đề tài quản lý thư việnBước 1: Thiết kế màn hình thực đơn với tính đúng đắn.Yêu cầu công việc nghiệp vụ: 1. Lập thẻ độc giả 2. Tiếp nhận sách 3. Cho mượn sách 4. Trả sách 5. Tra cứu sách 6. Lâp báo cáo thống kê tình hình cho mượn sách. 7. Gia hạn thẻ 8. Tra cứu độc giả 9. Báo cáo thống kê độc giả 10. Thanh lý sách 11. Lập báo cáo thống kê sáchBước 1: Thiết kế màn hình thực đơn với tính đúng đắn (tt)Yêu cầu chất lượng-Tính tiến hóa 12. Cập nhật bảng tham số 13. Cập nhật loại độc giả 14. Cập nhật thể loại sách 15. Cập nhật lý do thanh lý sáchYêu cầu chất lượng-Tính hiệu quả 16. Giá trị định sẵnYêu cầu chất lượng-Tính tương thích 17. Chuyển dữ liệu độc giả sang tập tin Excel 18. Chuyển dữ liệu sách sang tập tin Excel 19. Import dữ liệu độc giả từ tập tin Excel 20. Import dữ liệu sách từ tập tin ExcelBước 1: Thiết kế màn hình thực đơn với tính đúng đắn (tt)Yêu cầu hệ thống-Tính bảo mật 21. Cập nhật phân quyền 13. Đăng ký sử dụngYêu cầu hệ thống-Tính an toàn 23. Sao lưu dữ liệu 24. Phục hồi dữ liệu 25. Quản lý dữ liệu được tạm xóaYêu cầu hệ thống-Các công việc đặc trưng tin học (không làm trong thế giới thực)26. Cấu hình thiết bị27. Cấu hình phần mềm28. ThoátBước 2: Cải tiến màn hình thực đơn với tính hiệu quả và tiện dụng.Cách 1:Bước 2: Cải tiến màn hình thực đơn với tính hiệu quả và tiện dụng (tiếp).Cách 1:Bước 2: Cải tiến màn hình thực đơn với tính hiệu quả và tiện dụng (tiếp).Cách 2:Bước 2: Cải tiến màn hình thực đơn với tính hiệu quả và tiện dụng (tiếp).Cách 3:Hãy thiết kế màn hình thực đơn cho đề tài mà các anh chị đang thực hiện..