Bài giảng môn Công nghệ phần mềm - Chương 7: Thiết kế giao diện người dùng

Nội dung text: Bài giảng môn Công nghệ phần mềm - Chương 7: Thiết kế giao diện người dùng

1. Chương 7 Thiết kế giao diện người dùng
2. Giới thiệu Nguyên tắc quan trọng khi xây dựng một hệ thống phần mềm - Người sử dụng không quan tâm đến cấu trúc bên trong của hệ thống, - Người dùng đánh giá hệ thống thông qua giao diện - Nếu cảm thấy giao diện không thích hợp, khó sử dụng => không sử dụng cả hệ thống => dự án thất bại.
3. Giao diện người dùng - Giao diện người dùng cần phải được thiết kế sao cho phù hợp với kỹ năng, kinh nghiệm và sự trông đợi của người sử dụng nó. Mục tiêu: - Nắm được sự ảnh hưởng của người sử dụng tới giao diện - Một số nguyên tắc khi thiết kế giao diện người dùng - Phân loại các khả năng tương tác giữa người và máy để thiết kế giao diện cho phù hợp - Biết cách biểu diễn thông tin cho phù hợp với người sử dụng
4. Giao diện người dùng (tt) Một số đặc điểm của người sử dụng có liên quan đến giao diện hệ thống: Khả năng nhớ tức thời của con người bị hạn chế: con người chỉ có thể nhớ ngay một số loại thông tin. Nếu ta biểu diễn nhiều hơn thì có thể khiến người sử dụng không nhớ hết và gây ra các lỗi.
5. Giao diện người dùng (tt) Người sử dụng có thể gây ra lỗi: khi người sử dụng gây ra lỗi khiến hệ thống sẽ hoạt động sai, những thông báo không thích hợp có thể làm tăng áp lực lên người sử dụng và càng xảy ra nhiều lỗi hơn. Người sử dụng là khác nhau: con người có những khả năng khác nhau => không nên chỉ thiết kế giao diện phù hợp với những khả năng của chính họ.
6. Giao diện người dùng (tt) - Thiết kế giao diện phải phụ thuộc vào yêu cầu, kinh nghiệm và khả năng của người sử dụng hệ thống. -Người thiết kế cũng nên quan tâm đến những giới hạn vật lý và tinh thần của con người và nên nhận ra rằng con người luôn có thể gây ra lỗi. - Không phải tất cả các nguyên tắc thiết kế giao diện đều có thể được áp dụng cho tất cả các giao diện.
7. Giao diện người dùng (tt) Các nguyên tắc thiết kế giao diện: Sự quen thuộc của người sử dụng: sử dụng thuật ngữ và các khái niệm quen thuộc với người sử dụng hơn là những khái niệm liên quan đến máy tính. - Ví dụ: hệ thống văn phòng nên sử dụng các khái niệm như thư, tài liệu, cặp giấy mà không nên sử dụng những khái niệm như thư mục, danh mục
8. Giao diện người dùng (tt) Thống nhất: hệ thống nên hiển thị ở mức thống nhất thích hợp. Ví dụ: các câu lệnh và menu nên có cùng định dạng -Tối thiểu hoá sự bất ngờ: nếu một yêu cầu được xử lý theo cách đã biết trước thì người sử dụng có thể dự đoán các thao tác của những yêu cầu tương tư.
9. Giao diện người dùng (tt) - Khả năng phục hồi: hệ thống nên cung cấp một số khả năng phục hồi từ lỗi của người sử dụng và cho phép người sử dụng khôi phục lại từ chỗ bị lỗi. - Hướng dẫn người sử dụng: như hệ thống trợ giúp, hướng dẫn trực tuyến - Tính đa dạng: hỗ trợ nhiều loại tương tác cho nhiều loại người sử dung khác nhau. Ví dụ: nên hiển thị phông chữ lớn với những người cận thị.
10. Giao diện người dùng (tt) Biểu diễn thông tin -Biểu diễn thông tin có liên quan tới việc hiển thị các thông tin trong hệ thống tới người sử dụng. Thông tin có thể được biểu diễn một cách trực tiếp hoặc có thể được chuyển thành nhiều dạng hiển thị khác như: dạng đồ hoạ, âm thanh
11. Giao diện người dùng (tt) Thông tin cần biểu diễn được chia thành hai loại: - Thông tin tĩnh: được khởi tạo ở đầu của mỗi phiên. Nó không thay đổi trong suốt phiên đó và có thể là ở dạng số hoặc dạng văn bản. - Thông tin động: thay đổi trong cả phiên sử dụng và sự thay đổi này phải được người sử dụng quan sát.
12. Giao diện người dùng (tt) - Các nhân tố ảnh hưởng tới việc hiển thị thông tin: - Người sử dụng thích hiển thị một phần thông tin hay quan hệ dữ liệu? - Thông tin thay đổi nhanh như thế nào? - Sự thay đổi đó có cần phải thể hiện ngay lập tức hay không? - Người sử dụng có phải thực hiện các hành động để đáp ứng với sự thay đổi không? - Thông tin ở dạng văn bản hay dạng số?
13. Giao diện người dùng (tt) - Nếu cần hiển thị số lượng lớn thông tin thì nên trực quan hoá dữ liệu. Ví dụ: thông tin về thời tiết được hiển thị dưới dạng biểu đồ, trạng thái của mạng điện thoại nên được hiển thị bởi các nút có liên kết với nhau. - Sử dụng màu trong khi thiết kế giao diện -> giúp cho người sử dụng hiểu được những cấu trúc thông tin phức tạp.
14. Giao diện người dùng (tt) - Tuy nhiên, khi sử dụng màu để thiết kế giao diện có thể gây phản tác dụng -> một số hướng dẫn: - Giới hạn số lượng màu được sử dụng và không nên lạm dụng việc sử dụng màu. - Thay đổi màu khi thay đổi trạng thái của hệ thống.
15. Giao diện người dùng (tt) - Sử dụng màu để hỗ trợ cho những nhiệm vụ mà người dùng đang cố gắng thực hiện. - Sử dụng màu một cách thống nhất và cẩn thận. - Cẩn thận khi sử dụng các cặp màu.
16. Giao diện người dùng (tt) Thông báo lỗi: - Nếu thông báo lỗi nghèo nàn có thể làm cho người sử dụng từ chối hơn là chấp nhận hệ thống. - thông báo lỗi nên ngắn gọn, xúc tích, thống nhất và có cấu trúc. - Việc thiết kế thông báo lỗi nên dựa vào kỹ năng và kinh nghiệm của người sử dụng.
17. Quy trình thiết kế UI - Thiết kế giao diện người dùng là một quy trình lặp lại bao gồm sự cộng tác giữa người sử dụng và người thiết kế. - Trong quy trình này gồm 3 hoạt động cơ bản: Phân tích người sử dụng: tìm hiểu những gì người sử dụng sẽ làm với hệ thống. Lập mẫu thử hệ thống: xây dựng một tập các mẫu thử để thử nghiệm Đánh giá giao diện: thử nghiệm các mẫu thử cùng với người sử dụng.
18. Quy trình thiết kế UI (tt)
19. Quy trình thiết kế UI (tt) Phân tích người sử dụng - Nếu không hiểu rõ những gì người sử dụng muốn làm với hệ thống sẽ không thể thiết kế được một giao diện hiệu quả. - Phân tích người sử dụng phải được mô tả theo những thuật ngữ để người sử dụng và những người thiết kế khác có thể hiểu được.
20. Quy trình thiết kế UI (tt) -Các kỹ thuật phân tích: - Phân tích nhiệm vụ: mô hình hoá các bước cần thực hiện để hoàn thành một nhiệm vụ. - Phân tích nhiệm vụ phân cấp. - Phỏng vấn và trắc nghiệm: hỏi người sử dụng về những gì mà họ làm. Khi phỏng vấn, nên dựa trên những câu hỏi có kết thúc mở -> người sử dụng cung cấp những thông tin mà họ nghĩ rằng nó là cần thiết; nhưng không phải tất cả các thông tin đó là có thể được sử dụng.
21. Quy trình thiết kế UI (tt) Mô tả: quan sát người sử dụng làm việc và hỏi họ về những nghiệp vụ mà chưa được biết tới. Nên nhớ rằng có nhiều nhiệm vụ của người sử dụng thuộc về trực giác và rất khó để mô tả và giải thích chúng. Dựa trên kỹ thuật này ta có thể hiểu thêm về các ảnh hưởng xã hội và tổ chức tác động tới công việc đó.
22. Quy trình thiết kế UI (tt) Lập mẫu thử giao diện người dùng - Mẫu thử cho phép người sử dụng có được những kinh nghiệm trực tiếp với giao diện. - Lập mẫu thử là một quy trình gồm 2 trạng thái: Lập các mẫu thử trên giấy. Tinh chỉnh mẫu thử và xây dựng chúng
23. Quy trình thiết kế UI (tt) Đánh giá giao diện người dùng - Nên đánh giá bản thiết kế giao diện người dùng để xác định khả năng phù hợp của nó. Tuy nhiên, việc đánh giá trên phạm vi rộng tốn nhiều chi phí và không thể thực hiện được đối với hầu hết các hệ thống.
24. Quy trình thiết kế UI (tt) - Các kỹ thuật đánh giá đơn giản: - Trắc nghiệm lại các phản hồi của người sử dụng Ghi lại quá trình sử dụng mẫu thử của hệ thống và đánh giá nó. - Lựa chọn những thông tin về việc sử dụng dễ dàng và các lỗi của người sử dụng. - Cung cấp mã lệnh trong phần mềm để thu thập những phản hồi của người sử dụng một cách trực tuyến.