THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG VÀ CÁC HOẠT ĐỘNG PHÁT TRIỂN PHẦN MỀM ThS. Phan Thanh Toàn

BÀI GIỚI THIỆU CHUNG VỀ THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG VÀ CÁC HOẠT ĐỘNG PHÁT TRIỂN PHẦN MỀM ThS Phan Thanh Tồn TÌNH HUỐNG DẪN NHẬP Giả sử dùng chương trình đồ hoạ để vẽ hình vng Mơ hình thơng tin đầu vào đầu cho bảng sau:  Thiết kế giao diện cho người dùng dễ sử dụng, đáp ứng nhanh? MỤC TIÊU Trình bày quy tắc thiết kế giao diện Trình bày vấn đề công nghệ phần mềm NỘI DUNG Khái niệm giao diện người dùng Các quy tắc thiết kế giao diện người dùng Kĩ nghệ phần mềm Mơ hình vịng đời cổ điển Mơ hình làm mẫu KHÁI NIỆM GIAO DIỆN NGƯỜI DÙNG • Tương tác người máy tương tác xảy người hệ thống máy tính • Giao diện người dùng mặt, hay gọi thành phần trung gian để thực giao tiếp, người với máy tính • Giao diện sử dụng để nhập thông tin vào hệ thống máy tính (đầu vào) nhận thơng tin phản hồi từ máy tính (đầu ra) CÂU HỎI THẢO LUẬN Con người thường tương tác với hệ thống máy tính qua thiết bị nào? CÁC QUY TẮC THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG • Hướng dẫn tương tác chung; • Hướng dẫn việc hiển thị thơng tin; • Hướng dẫn việc vào liệu 2.1 HƯỚNG DẪN TƯƠNG TÁC CHUNG Hướng dẫn tương tác chung bao hàm hiển thị thơng tin, vào liệu điều khiển tồn hệ thống:  Tính qn;  Cho thơng tin phảm hồi có nghĩa;  Yêu cầu kiểm chứng hành động phá huỷ không tầm thường;  Cho phép dễ dàng lần ngược nhiều hành động;  Giảm thiểu khối lượng thông tin phải ghi nhớ hành động;  Tìm kiếm tính hiệu đối thoại, vận động ý nghĩ;  Dung thứ cho sai lầm;  Phân loại hoạt động theo chức tổ chức hình hài hồ theo vùng;  Cung cấp tiện nghi trợ giúp ngữ cảnh;  Dùng động từ đơn giản hay cụm động từ ngắn để đặt tên lệnh 2.2 HƯỚNG DẪN VỀ VIỆC HIỂN THỊ THƠNG TIN • Thơng tin “hiển thị” theo nhiều cách khác • Các hướng dẫn sau tập trung vào hiển thị thông tin:  Chỉ hiển thị thơng tin có liên quan tới ngữ cảnh tại;  Hãy dùng định dạng trình bày cho phép hấp thụ nhanh chóng thơng tin;  Dùng nhãn quán, cách viết tắt chuẩn mầu sắc dự kiến trước;  Cho phép người dùng trì ngữ cảnh trực quan;  Đưa thơng báo lỗi có nghĩa;  Dùng chữ hoa, chữ thường, thụt lề gộp nhóm văn để giúp cho việc hiểu 2.3 HƯỚNG DẪN VỀ VIỆC VÀO DỮ LIỆU Những hướng dẫn sau tập trung vào việc đưa vào liệu: • Tối thiểu việc số hành động đưa vào mà người dùng cần thực hiện; • Duy trì qn hiển thị thơng tin liệu đầu vào (cái vào); • Cho phép người dùng làm phù hợp vào; • Tương tác nên mềm dẻo nên hòa hợp với mốt đưa vào ưa thích; • Khử kích hoạt lệnh khơng thích hợp hồn cảnh hành động tại; • Để cho người dùng kiểm sốt luồng tương tác; • Cung cấp trợ giúp cho hành động đưa vào 10 CÂU HỎI THẢO LUẬN Anh (Chị) hiểu ngun tắc “Tìm kiếm tính hiệu đối thoại, vận động ý nghĩ “? 11 KĨ NGHỆ PHẦN MỀM • Cơng nghệ phần mềm lĩnh vực để hiểu trình thiết kế hay vịng đời phần mềm • Thiết kế đạt tính dùng diễn suốt q trình hệ thống, không dành riêng cho giai đoạn • Đầu đặc tả yêu cầu người dùng, phân tích nhiệm vụ tài liệu, sơ đồ hay dạng chuẩn khác Các nguyên tắc cho tính dùng • Việc biểu diễn có tính cấu trúc áp dụng cho trình thiết kế hệ thống giao tiếp:  Tính dễ học (learnability): áp dụng cho người từ việc giao tiếp có hiệu  hoàn thành với hiệu suất tối đa  Mềm dẻo (flexibility): người dùng hệ thống giao tiếp với theo nhiều cách thức 12 KĨ NGHỆ PHẦN MỀM (tiếp theo)  Vững (robustness): mức độ hỗ trợ cho người dùng để xác định việc thực thành công đánh giá hành vi điều khiển  Tính dự đốn (predictability): xác định hiệu hành động tương lai dựa vào lịch sử giao tiếp qua  Tính thân thiện (familiarity): có cần tri thức sử dụng hệ thống  Tính tổng hợp: thay đổi màu sắc dẫn đến thay đổi trạng thái số thành phần hệ thống  Tính khái quát (generalizability): mở rộng tri thức riêng cho tình  Tính quán (consistency): tương tự trạng thái vào cho tình giống hay nhiệm vụ đích  Tính khái qt hố ổn định: tính ổn định thường tương đối số đặc trưng khác tương tác người dùng hệ thống 13 MƠ HÌNH VỊNG ĐỜI CỔ ĐIỂN 14 MƠ HÌNH VỊNG ĐỜI CỔ ĐIỂN (tiếp theo) “Trong thực tế, giai đoạn trình phát triển phủ phản hồi cho Trong thiết kế , vấn đề đặc tả yêu cầu người dùng xác định; cài đặt, vấn đề thiết kế làm Q trình phần mềm khơng đơn tuyến tính bao gồm chuỗi lặp hoạt động phát triển”: • Đặc tả yêu cầu người dùng; • Thiết kế kiến trúc; • Thiết kế chi tiết; • Lập trình kiểm thử; • Tích hợp kiểm thử; • Khai thác bảo trì 15 MƠ HÌNH LÀM BẢN MẪU Thiết kế lặp nhằm khắc phục vấn đề cố hữu đặc tả không đầy đủ • Mẫu thử (Prototypes)  Mẫu thử bắt chước hay mơ hình, thường dùng cho hệ thống cịn chưa tồn tại;  Mơ hay minh hoạ số đặc trưng hệ thống;  Nhiều kiểu mẫu thử:   Tung gia (Throw - away);  Gia tăng (incremental);  Tiến hoá (evolutionary) Tại dùng?  Làm mịn đặc tả;  Làm mịn thiết kế;  So sánh thiết kế;  Tự thiết kế;  Chứng minh cho ý tưởng;  Thực kinh nghiệm 16 MƠ HÌNH LÀM BẢN MẪU (tiếp theo)  Ai dùng? khách hàng, người dùng,  Hạn chế:  Dáng vẻ;  Chức năng;  Tính vững  Mẫu thử tốt:  Khơng cần thời gian;  Không cần tài nguyên  Chuẩn bị kịch (Walkthrough) nhằm kiểm tra người dùng thấy, phải biết làm  Hình thức: Mỗi kịch gồm số hình Mỗi hình gồm phần: phần mơ tả text phần hình Minh họa qua thí dụ kết hợp menu phím lệnh 17 MƠ HÌNH LÀM BẢN MẪU (tiếp theo) • Các vấn đề quản lý:  Thời gian;  Kế hoạch;  Các đặc tính phi chức năng;  Hợp đồng • Các kỹ thuật:  Storyboards:  Là kỹ thuật minh hoạ hình ảnh chụp nhanh hệ thống có nguồn gốc từ hoạt hình cơng nghiệp làm phim Thường dùng để minh hoạ kịch với lựa chọn cố định hạn chế  Ưu điểm: o Khơng thiết cần máy tính; o Có thể kích hoạt; o Minh hoạ nhanh ý tưởng  có ích giai đoạn đầu thiết kế; o Hình dung ý tưởng không hỗ trợ cơng cụ có hay cơng nghệ cịn chưa tồn  cần vai trò giám sát người thiết kế; o Bỏ qua đặc trưng không liên quan 18 MƠ HÌNH LÀM BẢN MẪU (tiếp theo)  Nhược điểm: mô chức hạn chế Một vài chức hệ thống người thiết kế cung cấp  Công cụ: HyperCard [Goodman87, MillerD88], ngôn ngữ lập trình: VB, VC, Hypercard hỗ trợ:  Siêu văn bản;  Cơ sở liệu;  Thiết kế giao tiếp  Mơ hình sở HyperCard chồng (stack) card điện tử Mỗi card gồm:  Phần đồ hoạ: đường, mặt, ;  Các trường chứa văn bản;  Các phím lệnh để liên kết với card khác 19 TĨM LƯỢC CUỐI BÀI • Các quy tắc thiết kế giao diện • Các vấn đề cơng nghệ phần mềm 20