Thiết kế tương tác đa phương tiện

Xác định được tầm quan trọng của việc hiểu cách người dùng hành động và phản ứng trước sự kiện và cách họ liên lạc và tương tác với nhau sẽ cho phép con người sử dụng các tri thức từ tâm

HỌC VIỆN CÔNG NGHỆ BƯU CHÍNH VIỄN THÔNG

*****

BÀI GIẢNG (Phương pháp đào tạo theo tín chỉ)

TÊN MÔN HỌC: THIẾT KẾ TƯƠNG TÁC ĐA PHƯƠNG TIỆN

(02 tín chỉ)

Biên soạn KHOA THIẾT KẾ VÀ SÁNG TẠO ĐA PHƯƠNG TIỆN

PGS TS ĐỖ TRUNG TUẤN

Hà Nội, 5/2014

PTIT

2

Lời nói đầu

Giáo trình “Thiết kế tương tác đa phương tiện” dùng cho sinh viên tham khảo, trong chuyên ngành truyền thông đa phương tiện, thuộc lĩnh vực Tin học Điện tử Viễn thông”, với hai đơn vị học trình Nội dung của tài liệu đề cập (i) thiết kế tương tác đa phương tiện; (ii) quy trình thiết kế tương tác đa phương tiện; và (iii) đánh giá tương tác đa phương tiện

Trong vài năm lại đây, giáo trình về tương tác đa phương tiện được trình bày cho sinh viên đại học về công nghệ thông tin, viễn thông và học viên cao học về công nghệ thông tin Nội dung giáo trình liên quan đến cả hệ thống đa phương tiện, lẫn kĩ thuật tương tác người-máy

Tài liệu được đánh số chương mục theo chữ số Ả rập Một số hình vẽ và bảng biểu trong các chương có giá trị minh hoạ Một số hình vẽ được trích từ các tài liệu tham khảo, để tiện đối chiếu và có thông tin sâu hơn

Do nội dung cần trình bày bao quát nhiều vấn đề về kĩ thuật, liên quan đến phần mềm, phần cứng công nghệ thông tin và các thiết bị tương tác đa phương tiện, nên một số khái niệm mới chỉ trình bày sơ lược, chưa có những cơ sở lí thuyết Theo các đề mục trong giáo trình, người ta có thể đọc thêm các tài liệu lí thuyết để trang bị cơ sở lí thuyết Trong các chương có một số thuật ngữ được nhắc lại, để tiện cho việc theo dõi quá trình xử lí dữ liệu đa phương tiện Một số thuật ngữ cần chú thích bằng tiếng Anh sẽ được đặt trong cuối trang

Nội dung đa phương tiện gắn liền với công nghệ Một số thông tin liên quan đến kĩ thuật, thiết bị chỉ có ý nghĩa thời đoạn, mang tính minh họa Sinh viên có thể sử dụng các thiết bị và phần mềm tương đương để thực hiện xử lí các dữ liệu đa phương tiện

Tác giả xin chân thành cám ơn các cán bộ Viện Công nghệ thông tin và truyền thông CDIT, Học viện Công nghệ bưu chính viễn thông PTIT đã trợ giúp để hoàn thành tài liệu này Đặc biệt giáo trình được nhiều góp ý chỉnh sửa của PGS TS Đỗ Năng Toàn, Ths Phí Công Huy và Ths Bùi Thị Thu Huế Các ý kiến đóng góp này đã giúp điều chỉnh nội dung giáo trình, để phù hợp đối với các giáo trình khác đang được sử dụng PTIT

Mục lục

Lời nói đầu ··· 2

Mục lục ··· 3

Chương 1 Thiết kế tương tác đa phương tiện ··· 6

1.1 Giới thiệu về thiết kế tương tác và thiết kế tương tác đa phương tiện ··· 6

1.1.1 Định nghĩa thiết kế tương tác ··· 6

1.1.2 Định nghĩa thiết kế tương tác đa phương tiện ··· 8

1.1.3 Mối liên hệ giữa thiết kế tương tác và thiết kế đa phương tiện ··· 10

1.2 Những yếu tố, qui tắc để nhận biết giao diện tốt ··· 11

1.2.1 Thế nào là một giao diện tốt ··· 12

1.2.2 Hiểu được người dùng ··· 13

1.2.3 Giao diện ảnh hưởng tới người dùng ra sao ··· 14

1.2.4 Yếu tố tạo nên giao diện tốt ··· 15

1.2.5 Những bài học ví dụ ··· 20

1.3 Những hoạt động và đặc tính khi thực hiện thiết kế tương tác ··· 21

1.3.1 Bốn hoạt động bắt buộc khi thực hiện thiết kế tương tác ··· 22

1.3.2 Ba đặc tính chủ chốt trong qui trình thiết kế tương tác ··· 24

1.3.3 Bài học vận dụng ··· 25

1.4 Vai trò của thiết kế tương tác trong phát triển sản phẩm đa phương tiện và khả năng sử dụng ··· 26

1.4.1 Thiết kế tương tác trong kinh doanh ··· 26

1.4.2 Mục tiêu của thiết kế tương tác: khả năng sử dụng và thói quen người dùng ··· 29

1.4.3 Mối liên hệ giữa thiết kế tương tác và những thành phần đa phương tiện: màu sắc, văn bản, biểu tượng ··· 31

1.5 Các phương tiện tương tác ··· 49

1.5.1 Giới thiệu các phương tiện tương tác ··· 50

1.5.2 Những bài học thí dụ ··· 51

1.6 Một số dạng tương tác cơ bản ··· 53

1.6.1 Giới thiệu các dạng tương tác ··· 53

1.6.2 Giao diện hướng thực đơn ··· 53

1.6.3 Giao diện ngôn ngữ từ khoá ··· 70

1.6.4 Điền khuôn dạng và bảng tính ··· 71

1.6.6 Hệ thống các cửa số ··· 79

PTIT

4

1.7 Thao tác trực tiếp và ngữ cảnh tương tác ··· 85

1.7.1 Ngữ cảnh tương tác ··· 85

1.7.2 Thao tác trực tiếp··· 87

Chương 2 Qui trình thiết kế tương tác ··· 111

2.1 Tổng quan về qui trình thiết kế tương tác ··· 111

2.1.1 Các khái niệm ··· 111

2.1.2 Các mô hình qui trình của thiết kế tương tác ··· 116

2.1.3 Bài học vận dụng ··· 120

2.2 Phương pháp xác định nhu cầu tương tác của người dùng ··· 121

2.2.1 Lí do xác định và hình thành nhu cầu của người dùng ··· 121

2.2.2 Các kĩ thuật thu thập dữ liệu ··· 122

2.2.3 Giải thích và phân tích dữ liệu ··· 126

2.2.4 Bài học vận dụng ··· 131

2.3 Phương pháp tiếp cận người dùng trong thiết kế tương tác ··· 132

2.3.1 Các khái niệm ··· 132

2.3.2 Các kĩ thuật trong việc tiếp cận người dùng ··· 133

2.3.3 Bài học vận dụng ··· 138

2.4 Phương pháp xây dựng bản thiết kế phác thảo ··· 140

2.4.1 Các loại thiết kế phác thảo ··· 141

2.4.2 Xây dựng bản thiết kế phác thảo ··· 143

2.4.3 Bài học vận dụng ··· 145

Chương 3 Giới thiệu về việc đánh giá trong thiết kế ··· 149

3.1 Tầm quan trọng của việc đánh giá trong thiết kế ··· 150

3.1.1 Giới thiệu về những ví dụ của việc đánh giá trong thiết kế ··· 150

3.1.2 Ảnh hưởng của đánh giá trong thiết kế ··· 158

3.2 Những phương pháp đánh giá··· 159

3.2.1 Phương pháp “quick dirty”··· 159

3.2.2 Phương pháp kiểm thử khả năng sử dụng ··· 160

3.2.3 Phương pháp nghiên cứu thực tế ··· 161

3.2.4 Phương pháp dự đoán ··· 161

3.3 Những kĩ thuật đánh giá ··· 162

3.3.1 Các kĩ thuật đánh giá ··· 162

3.3.2 Đặc điểm của từng kĩ thuật đánh giá ··· 163

3.3.3 Quan hệ giữa phương pháp đánh giá và những kĩ thuật đánh giá ··· 164

PTIT

3.3.4 Kĩ thuật DECIDE trong việc hướng dẫn đánh giá ··· 165

3.4 Môi trường đánh giá ··· 167

3.4.1 Yêu cầu theo ngữ cảnh ··· 167

3.4.2 Đánh giá hợp tác ··· 168

3.4.3 Khác nhau giữa các phương pháp ··· 169

3.4.4 Một số nhân tố trong đánh giá giao diện tương tác ··· 169

Danh sách các hình và bảng ··· 173

Tài liệu tham khảo··· 179

PTIT

Vấn đề chính trong thiết kế tương tác là cách thức tối ưu tương tác của người dùng với hệ thống, môi trường hay sản phẩm, để chúng khớp với hoạt động của người dùng Người ta có thể

sử dụng nhiều nguyên lí để chọn ra phương án thuận tiện để hiểu người dùng Khi đó người ta cần xem xét:

 Xác định sự phù hợp của người dùng;

 Xác định phương thức có thể trợ giúp người dùng;

 Nghĩ về những thứ đảm bảo kinh nghiệm người dùng có chất lượng;

 Sử dụng các kĩ thuật thử của trí tuệ nhân tạo, để có hệ thống tốt trong quá trình thiết kế

Định nghĩa: Thiết kế tương tác là thiết kế các sản phẩm tương tác để trợ giúp con người trong cuộc sống thường ngày và trong công việc của họ

Trong hệ thống có tương tác, người dùng có thêm kinh nghiệm khi truyền thông, làm việc với hệ thống Người ta cũng mô tả thiết kế tương tác như công việc thiết kế không gian truyền thông và tương tác có tính người Việc thiết kế nhắm vào người dùng, trái với công nghệ phần mềm Công nghệ phần mềm tập trung chính vào sản phẩm của giải pháp phần mềm đối với ứng

PTIT

dụng đã biết

1.1.1.2 Quá trình thiết kế tương tác đa phương tiện

Quá trình thiết kế tương tác cần đến tri thức của nhiều lĩnh vực Xác định được tầm quan trọng của việc hiểu cách người dùng hành động và phản ứng trước sự kiện và cách họ liên lạc và tương tác với nhau sẽ cho phép con người sử dụng các tri thức từ tâm lí học đến xã hội học… Tương tự như vậy, việc xác định được hiểu biết về cách thiết kế các kiểu tương tác khác nhau và cách lựa chọn thẩm mĩ khác nhau sẽ cho phép nhiều kiểu thiết kế tương tác đa phương tiện, ứng với những người (i) thiết kế đồ họa; (ii) nghệ sĩ; (iii) hoạt náo viên; (iv) nhiếp ảnh; (v) chuyên gia điện ảnh; hay (vi) thiết kế sản phẩm

Vài mốc phát triển của thiết kế tương tác đa phương tiện có thể thấy qua phát triển của ngôn ngữ lập trình:

 Ngôn ngữ máy;

 Hợp ngữ;

 Ngôn ngữ lập trình cấp cao;

 Ngôn ngữ đồ họa;

 Ngôn ngữ hướng đối tượng…

1.1.1.3 Đặc tính của thiết kế tương tác

Khi Internet xâm nhập rộng khắp, các máy tính cá nhân mang nhiều phát minh trong trò chơi, phần mềm giải trí… hội tụ rất nhiều công nghệ Việc thiết kế tương tác có vai trò quan trọng Nó có các đặc tính:

1 Thiết kế đòi hỏi thay đổi tình huống bằng cách tạo dạng và sử dụng các phương tiện Nói cách khác, thiết kế nhằm chuyển hóa các phương tiện sẵn có để thiết kế thay đổi đầu tiên, trong điều kiện cụ thể;

2 Thiết kế nhằm bộc lộ các khả năng mới;

3 Thiết kế đưa ra các vấn đề song song với tạo dựng các giải pháp Đặc tính này yêu cầu phát triển hệ thống truyền thống và quá trình công nghệ không được xem như quá trình thiết kế;

4 Yêu cầu đưa ra phác thảo và các cách thể hiện khác;

5 Liên quan đến các khía cạnh công cụ, kĩ thuật, mỹ học và đạo đức

PTIT

8

1.1.2 Định nghĩa thiết kế tương tác đa phương tiện

Để hiểu biết về thiết kế tương tác đa phương tiện, người ta cần xét (i) đa phương tiện; (ii) quá trình thiết kế; (iii) tương tác người-máy

1.1.2.1 Về đa phương tiện

Trước khi xét các khái niệm về đa phương tiện, cần giải nghĩa theo cách đơn giản1

? Đa phương tiện là tích hợp của văn bản, âm thanh, các loại hình ảnh và các phần mềm, trong một môi trường thông tin số Phần mềm này được coi là phần mềm cho phép người dùng điều chỉnh, đặt các tùy chọn, hay “phần mềm điều khiển được” Người ta thấy đều nhất trí rằng dữ liệu đa phương tiện gồm dữ liệu về (i) văn bản; (ii) hình ảnh; (iii) âm thanh; và (iv) hình động

Tập các điểm ảnh tạo nên ảnh tĩnh Không có màu sắc, chỉ với chấm đậm, nhạt, hình vẽ mang thông tin Tuy nhiên nếu có màu, người ta thấy dễ chịu hơn Để vẽ, người ta dùng bảng màu với 255 phần Tùy theo người dùng mà bảng màu được tinh chỉnh, theo một số chuẩn mỹ thuật

Hình 1.1 Tranh hội họa ảnh ảnh chụp thuộc về hình tĩnh

Có thể xem đa phương tiện là kỹ thuật mô phỏng và sử dụng đồng thời nhiều dạng phương tiện chuyển hoá thông tin và các tác phẩm từ các kỹ thuật đó

Liên quan đến định nghĩa đa phương tiện, người ta cần lưu ý những khía cạnh (i) Thông tin cần phải được số hoá, phù hợp với xu thế và rẻ; (ii) Phải dùng mạng máy tính, để đảm bảo truyền

bá, hay truyền tải tốt; (iii) Sử dụng phần mềm có tương tác, cho phép người dùng trao đổi với phần mềm và thay đổi theo ý người dùng; và (iv) Phải thiết kế giao diện người máy phù hợp với phát triển của đa phương tiện, tức giao diện người dùng đa phương tiện được lưu ý nhiều trong các năm gần đây

Tương tác thể hiện rõ trong các hệ thống công nghệ cao như hệ thống hiện thực ảo Hiện thực ảo là một thuật ngữ áp dụng cho máy tính mô phỏng môi trường mà có thể mô phỏng sự

1

multimedia

PTIT

hiện diện thể chất ở những nơi trong thế giới thực, cũng như trong thế giới tưởng tượng

Từ năm 1990, liên quan đến tương tác người-máy, người ta tập trung nghiên cứu về đa hình thái1 Các nghiên cứu này sử dụng công nghệ của đa phương tiện ở mức nâng cao Để triển khai các đề án đa phương tiện, người ta cần giải quyết một số vấn đề về nhận thức: (i) Khi dùng đa phương tiện, vì các phần mềm đa phương tiện là các phần mềm dẫn dắt người dùng nên cần có quan điểm nào đấy về sử dụng đa phương tiện; (ii) Phần mềm đa phương tiện viết ra rất tốn kém, trong khi nhu cầu luôn luôn thay đổi vì thế cần phải có một số công cụ để sửa đổi nhanh, rẻ; (iii) Trong lĩnh vực đa phương tiện cần phải luôn sáng tạo, và đòi hỏi người lập trình đa phương tiện phải có cái nhìn tổng thể

Đa hình thái được sử dụng cho khái niệm (i) phân bố xác suất đa dạng; (ii) tương tác máy với nhiều kiểu thông tin vào/ ra; (iii) nhiều kiểu vận chuyển

người-Việc thực hiện hệ thống đa phương tiện cần tuân theo phương pháp khoa học về quản lí đề

án công nghệ thông tin, và quản lí đề án đầu tư nói chung Ngoài việc tổ chức đề án, quản lí đề

án, các dữ liệu đa phương tiện cần được tổ chức tốt Phần sau sẽ đề cập một số yêu cầu đối với dữ liệu đa phương tiện phục vụ quá trình sản xuất đa phương tiện

Người ta triển khai công việc với hệ thống đa phương tiện, tức quá trình đa phương tiện, theo kịch bản đặt ra Kịch bản là câu chuyện hư cấu, mô tả các hành vi của các nhân vật trong câu chuyện, có sự kiện gắn với nhân vật

Tạo hình cần tuân theo các nguyên tắc mỹ thuật Cho dù dữ liệu đa phương tiện ở dạng hình ảnh, tạo nên bằng phần mềm vẽ hay bằng chụp ảnh, hay ở dạng video, gồm nhiều ảnh tĩnh, mỗi khung hình cần có (i) bố cục; (ii) nội dung

Cũng cần đề cập khái niệm về nghệ thuật trong thiết kế, sáng tác tương tác Nghệ thuật là sản phẩm hoặc quá trình cố ý sắp xếp các mục, thường là các biểu tượng, theo cách ảnh hưởng đến một hoặc nhiều giác quan, cảm xúc, và trí tuệ Nó bao gồm một loạt hoạt động đa dạng của sáng tạo và thể hiện, gồm âm nhạc, văn học, điện ảnh, nhiếp ảnh, điêu khắc, và hội hoạ

1.1.2.2 ố cục trong thiết kế đa phương tiện

Khi thiết kế tương tác đa phương tiện, cần lưu ý một số khía cạnh về đường nét, về sắp xếp các đối tượng trong hình Lấy thí dụ về bố cục thể hiện ý tương, quan điểm của người chụp ảnh, trong quá trình tạo hình tĩnh

Khác biệt giữa sản phẩm của người thiết kế sử dụng công cụ công nghệ thông tin với sản phẩm của người làm tin học là khả năng bố cục theo góc nhìn nghệ thuật, theo mĩ học Bố cục là

sự sắp xếp các đồ vật để nổi bật chủ đề mà mình muốn nhấn mạnh sao cho hợp lý

1

Multimodal

PTIT

Các thành phần trong giao diện đáp ứng một số yêu cầu Các yêu cầu này được nêu khi thiết kế giao diện

 Biểu tượng, thể hiện sản phẩm đa phương tiện;

 Đôi nét về ý đồ thiết kế biểu tượng;

 Hiểu biết về khán giả đa phương tiện;

 Thử nghiệm tính đúng đắn của thiết kế giao diện;

 Xác định môi trường tương tác;

 Khả năng dùng âm thanh;

 Việc dùng màu sắc;

 Việc đóng gói các tư liệu liên quan

Như vậy có thể xem thiết kế tương tác đa phương tiện là thiết kế tương tác trong môi

trường đa phương tiện, cụ thể với các phương tiện văn bản, hình ảnh, âm thanh và hình động

1.1.3 Mối liên hệ giữa thiết kế tương tác và thiết kế đa phương tiện PTIT

Thiết kế tương tác

Các lĩnh vực hàn lâm

Giao diện học Tâm lí học nhận thức

Tin học Công nghệ Khoa học máy tính

Khoa học xã hội

Thực hành thiết kế

Thiết kế đồ họa Thiết kế sản phẩm Thiết kế nghệ thuật Thiết kế công nghiệp Công nghiệp điện ảnh

Nhân tố Con người

Công nghệ Nhận thức

Tương tác Người-máy

Khoa hoc Nhận thức

Hệ thống Thông tin

Lao động hợp tác Với trợ giúp của máy tính

Thiết kế tương tác là công việc căn bản đối với tất cả các lĩnh vực, tiếp cận liên quan đến nghiên cứu và thiết kế các hệ thống máy tính cho người dùng Lĩnh vực được biết nhiều là tương tác người-máy, liên quan đến thiết kế, đánh giá và thực hiện các hệ thống tính toán tương tác cho

sử dụng của người dùng và nghiên cứu các hiện tượng xung quanh

Về mối liên quan giữa thiết kế tương tác và thiết kế đa phương tiện, có những lưu ý sau:

1 Thiết kế đa phương tiện dùng nhiều phương tiện khác nhau, để hướng đến tương tác người dùng Thiết kế tương tác tập trung vào người dùng, vào các đối tượng trong quá trình tương tác; việc sử dụng các phương tiện không đặt ra như yêu tố đầu tiên;

2 Cả thiết kế đa phương tiện và thiết kế tương tác đều tuân theo những nguyên tắc chung về nghe, nhìn và các nguyên tắc thẩm mĩ, thuộc mĩ học Nói khác đi, hai quá trình thiết kế này đều chung nền tảng, nên đôi khi người ta lẫn lộn hai khái niệm này;

3 Thiết kế đa phương tiện và thiết kế tương tác đều thuộc vào lĩnh vực rộng hơn; đó là thiết

kế tương tác người-máy Từ năm 1985, lĩnh vực này được biết đến một cách rộng rãi, như tương tác người-máy, viết tắt là HCI1

1.2 Những yếu tố, qui tắc để nhận biết giao diện tốt

Giao diện tương tác người-máy được thiết kế hướng người dùng Nó đáp ứng nhu cầu

1

HCI Human-Computer Interaction

PTIT

12

người dùng đa dạng, từ người dùng bình thường đến những người dùng đặc biệt, như người thiệt thòi Bản thân giao diện có những tính chất riêng Những tính chất và khả năng của giao diện tạo nên chất lượng của nó

1.2.1 Thế nào là một giao diện tốt

Để xác định giao diện tốt, cần điểm lại các khái niệm về giao diện người dùng, và nhấn mạnh khía cạnh mà người ta cho là “tốt”:

 Giao diện người dùng Thiết kế giao diện người dùng là lĩnh vực nhỏ, thuộc tương tác

người-máy HCI1 Tương tác người-máy là công việc nghiên cứu, lập kế hoạch, thiết

kế cách người dùng và máy tính làm việc với nhau để những nhu cầu của con người được thỏa mãn theo cách hiệu quả Giao diện người dùng là một phần của máy tính

và người dùng có thể thấy, sử dụng phần mềm của nó Quá trình làm việc cần đến (i) nhập vào; (ii) xuất ra, thông qua nhiều dạng thiết bị Giao diện được thiết kế tốt là giao diện phù hợp, hòa trộn được các cơ chế nhạp, xuất đã được thiết kế tốt, nhằm đáp ứng nhu cầu người dùng Nhu cầu này tính đến những khả năng, hạn chế theo mọi cách Giao diện tốt là giao diện cho phép người ta chú trọng vào thông tin và nhiệm vụ, thay vì chú trọng vào cơ chế mang thông tin và thực hiện nhiệm vụ

Hình 1.3 Giao diện tốt đối với người dùng trong môi trường sử dụng máy vi tính

toàn có thể tạo nên giao diện phù hợp, hiệu quả Tuy nhiên có người vẫn sử dụng giao diện không hiệu quả, chưa xác định được giao diện tốt, do vài lí do (i) người ta không quan tâm đến giao diện; (ii) không hành động theo lẽ thường; (iii) thiếu thời gian; (iv)

1

Human Computer Interaction

PTIT

chưa rõ thiết kế tốt hơn Một giao diện thiết kế tốt là rất quan trọng đối với người dùng Nó cho phép người dùng thấy được hệ thống, nối kết thuận tiện với phần mềm Đối với vài người dùng, giao diện là cả hệ thống, do họ xem hệ thống như là thành phần hiển thị mà người phát triển đã tạo nên Một giao diện thiết kế tồi sẽ tốn kém cho người dùng và tổ chức của họ

Thí dụ về giao diện tốt có thể là:

1 Chương trình viết bằng ngôn ngữ cấp cao, như Pascal hay C++, cũng tạo được liên

hệ thích hợp giữa hệ thống máy với người dùng Người dùng chỉ cần nhập dữ liệu và nhận kết quả Các bài toán loại này thuộc lớp các bài toán khoa học kĩ thuật Người dùng, tức những người làm công tác khoa học, không yêu cầu gì nhiều; vậy nên đối với họ, giao diện như vậy là tốt, tức đáp ứng yêu cầu người dùng;

2 Bài toán quản lý cần trợ giúp người làm công tác quản lý; nó cần có giao diện phù hợp Giao diện này thường là (i) hướng thực đơn; (ii) hướng khuôn dạng Các loại giao diện này phù hợp với người dùng hơn chương trình bằng ngôn ngữ cấp cao Đối với người quản lý, giao diện này được coi là tốt;

3 Trong điều kiện truyền thông rộng rãi và ứng dụng công nghệ thông tin trở nên phổ biến, người dùng không chỉ là người biết về kĩ thuật hay công nghệ, giao diện cần có dạng thích hợp Trẻ em hay người già dễ sử dụng giao diện đồ họa hơn là giao diện với từ khóa; thông qua các biểu tượng, người dùng dễ truy cập đến các dịch vụ mong muốn Giao diện Web là thí dụ điển hình của giao diện đồ họa trong bối cảnh hiện nay

 Người dùng được phép nhận dạng, chẩn đoán và sửa lỗi;

 Giao diện mềm dẻo và sử dụng có hiệu quả;

 Giao diện có thẩm mĩ;

 Giao diện có trợ giúp và có tư liệu đi kèm

1.2.3 Giao diện ảnh hưởng tới người dùng ra sao

Người dùng trong giao diện được thỏa mãn, ứng với các trạng thái sau:

8 Người dùng được khen ngợi, được thưởng;

9 Giao diện giúp khơi nguồn sáng tạo

Để rõ hơn về tác động của giao diện người-máy đến người dùng, cần xem xét một số vấn đề sau:

Xác định khía cạnh tác động Khái niệm “tác động được” hướng đến phản hồi tình cảm,

chẳng hạn người ta cười khi thỏa mãn Người ta đề xuất xây dựng hệ thống máy nhận thức và thể hiện được tình cảm con người, liên quan đến tiếp cận “tính toán tác động”

Các giao diện biểu hiện Một giải pháp trong giao diện biểu hiện là sử dụng các biểu tượng

PTIT

và các đồ họa ứng với trạng thái tình cảm Hơn nữa, hệ thống máy tính còn sử dụng (i) biểu tượng chuyển động; (ii) các hoạt hình; (iii) thông báo qua âm thanh, với các loại giọng; (iv) âm thanh chỉ thị hành động và sự kiện

Bảng 1.1 Vài loại tình cảm được dùng rộng rãi

Cảm xúc Biểu hiện Kí hiệu cảm xúc Ý nghĩa

Hạnh phúc Cười  hay:D Hạnh phúc hay bình luận trước đây

không nghiêm trọng Buồn Miệng mở  hay:-< Thất vọng, không hạnh phúc

Táo tợn Hấp háy ;) hay;-) Bình luận trước có ý táo tợn

Ngây thơ Như tre em < Cười duyên, ngu ngơ

Thất bại của người dùng Người ta có thể đôi lần thất bại khi dùng máy tính Trạng thái tâm

lí người dùng thường là bực tức Lí do có thể là (i) ứng dụng chạy không như mong muốn; (ii) hệ thống không thực hiện như người dùng nghĩ; (iii) người dùng không cung cấp đủ thông tin; (iv) không đạt được mong muốn; (v) thông báo không rõ ràng; (vi) giao diện không sáng sủa; (vii) hệ thống đòi hỏi người dùng thực hiện nhiều bước nhỏ

Các tác nhân ảo Trên màn hình máy tính có thể là đoạn phim hoạt hình về nhân vật như

thật Nhờ các nhân vật ảo ấy mà người dùng có thể thực hiện một số công việc với máy tính Liên quan đến vấn đề này, người ta xét các loại tác nhân (i) nhân vật tổng hợp; (ii) nhân vật hoạt hình; (iii) tác nhân tình cảm; (iv) tác nhân giao diện hội thoại Để thiết kế tác nhân ảo, cần đề cập (i) tin cậy nhân vật ảo; (ii) hiện diện; (iii) hành vi; (iv) kiểu tương tác

1.2.4 Yếu tố tạo nên giao diện tốt

Giao diện người-máy được thiết kế theo phương pháp khoa học, hướng người dùng, sẽ có

xu hướng tạo nên phần mềm tốt Người ta cần nhiều kiến thức đa ngành trong quá trình thiết kế giao diện Giao diện thỏa mãn nhiều tính chất, trong đó tính sử dụng được là quan trọng hơn cả

PTIT

16

Thiết kế về Kinh nghiệm người dùng

Thiết kế giao diện người dùng

Tương tác người-máy Kiến trúc thông tin

Thiết kế tương tác

Tính sử dụng

Công nghệ mang nhân tố người

Hình 1.4 Các kiến thức thiết kế giao diện tốt

Các nguyên tắc thiết kế tạo nên giao diện người dùng tốt Trước khi thiết kế, người ta quan sát thấy (i) không ai thấy đúng lần đầu; (ii) việc phát triển đầy những ngạc nhiên; (iii) thiết kế tốt cần đến nhiều thay đổi; (iv) tạo tương phản để tránh thay đổi không bao giờ xóa được nhu cầu thay đổi; (v) cho dù đã có hệ thống tốt, không loại trừ vẫn còn lỗi; (vi) người thiết kế cần công cụ tốt; (vii) cần có đích về hành vi thiết kế, cũng như đích về hiệu năng

Kinh nghiệm người dùng

Hình 1.5 Kinh nghiệm người dùng

Việc thiết kế giao diện tốt sẽ gặp nhiều trở ngại, sẽ gặp các lỗi về thiết kế, về cải tiến về sau, hay về tổ chức thiết kế Các trở ngại thường là (i) thiếu phân tích sớm và thiếu hiểu biết về nhu cầu và mong muốn của người dùng; (ii) tập trung vào khía cạnh thiết kế sử dụng hay thành phần cơ bản; (iii) ít hay thiếu sáng tạo trong mẫu thiết kế; (iv) không thử về tính sử dụng; (v)

PTIT

thiếu tầm nhìn bao quát về đích thiết kế giao diện; (vi) việc liên lạc giữa những thành viên của nhóm phát triển là không thường xuyên

Trong phần sau, đề cập các qui trình thiết kế giao diện người dùng, người ta đề cập những công nghệ thiết kế, tuân theo công nghệ phần mềm Tuy nhiên để xác định giao diện người dùng tốt, người ta có thể thấy trước các bước thiết kế sau:

ước 1: hiểu người dùng (i) Giao diện cần hiểu cách người dùng tương tác với máy tính,

liên quan đến con người và các nhiệm vụ của họ (ii) Cần xác định các đặc tính quan trọng của người dùng trong quá trình thiết kế Các đặc tính này gồm việc nhận thức, việc nhớ, khả năng xử

lí thông tin, mô hình thần kinh, việc học, và các kĩ năng (iii) Khả năng của con người trong thiết

kế hệ thống kinh doanh Khi đó cần xét khả năng về kinh nghiệm, tâm lí, sinh lí và nhu cầu về nhiệm vụ (iv) Tốc độ tương tác của người dùng Tốc độ này thể hiện qua hiệu năng xử lí, thu thập thông tin của người dùng

ước 2: hiểu chức năng nghiệp vụ (i) Giao diện cần có phân tích nhu cầu và xác định

nghiệp vụ (ii) Cần xác định các chức năng cơ bản về nghiệp vụ Vậy người ta dùng đến mô hình khái niệm, mô hình thần kinh (iii) Quá trình thiết kế tuân theo chuẩn thiết kế và có các hướng dẫn cần thiết Tuy vậy các chuẩn cần được làm phù hợp với hoàn cảnh riêng Người ta có thể dùng đến trợ giúp thiết kế (iv) Xác định nhu cầu về tư liệu và đào tạo về hệ thống Các tư liệu và công tác đào tạo, huấn luyện là khâu hay bị xem thường

ước 3: nhận thức được các nguyên tắc của giao diện tốt và thiết kế màn hình tương tác

(i) Quá trình thiết kế cần biết khả năng của con người trong thiết kế giao diện và màn hình tương tác Người ta cần xác định đích của giao diện, tổ chức các thành phần giao diện theo cách sáng sủa và có ý nghĩa Trong giao diện có điểm cần tập trung và nhấn mạnh hơn phần khác Thông tin trong màn hình cần đơn giản và có nghĩa Bên cạnh giao diện có hướng dẫn theo cấu trúc, tiện cho đối chiếu và làm theo (ii) Liên hệ với công nghệ trong thiết kế tương tác Những yếu tố về

hệ thống đồ họa, hệ thống web, cách sử dụng công nghệ cần được tính đến

ước 4: phát triển thực đơn hệ thống và lược đồ dò tìm (i) Để phát triển giao diện loại này,

người ta cần biết về cấu trúc thực đơn Có các thực đơn khác nhau, như loại đơn, tuyến tính, đồng thời, phân cấp, theo sự kiện… (ii) Các chức năng của thực đơn Liên quan đến chức năng thực đơn, có cách dò tìm trong thực đơn, kích hoạt hành động hay thủ tục gắn với các thành phần thực đơn, hiện thông tin, nhập dữ liệu và tham số cho thực đơn (iii) Nội dung thực đơn, với ngữ cảnh, nhan đề và các lệnh đi kèm thực đơn (iv) Tạo dạng thực đơn Liên kết với thực đơn là các khía cạnh về bền vững, hiển thị, thể hiện, tổ chức, tính phức tạp, trật tự các lựa chọn của thực đơn (v) Văn bản gắn với thực đơn, gồm có nhan đề, mô tả lựa chọn, các chỉ thị và phím gõ tắt (vi) Kích hoạt lựa chọn của thực đơn Việc này liên quan đến định vị con trỏ màn hình, lựa chọn mặc định (vii) Thực đơn đồ họa bao gồm thực đơn ngang, thực đơn thả xuống, thực đơn từng tầng, thực đơn ấn; thực đơn xé ra, thực đơn biểu tượng, thực đơn khoanh

PTIT

18

Hình 1.6 Cửa sổ

ước 5: chọn loại cửa sổ phù hợp (i) Xác định đặc tính cửa sổ, liên quan đến vai trò của hệ

thống cửa sổ và những ràng buộc mà thiết kế cửa sổ cần tuân theo (ii) Các thành phần của cửa

sổ Những thành phần chính gồm có khung cửa sổ, thanh nhan đề, biểu tượng ứng với thanh nhan

đề, thanh cuộn cửa sổ, các hộp trong cửa sổ, các công cụ, vùng lệnh trong cửa sổ, vùng làm việc trong cửa sổ (iii) Phong cách thể hiện cửa sổ Người ta chọn các kiểu thông dụng, như cửa sổ chồng nhau, của số theo từng tầng, cửa sổ căng hết màn hình (iv) Các dạng cửa sổ Nhiều loại cửa sổ, với ngữ nghĩa sử dụng khác nhau Có thể phân loại, thành lớp các cửa sổ sơ cấp, thứ cấp, hộp hội thoại, hộp thông báo… (v) Tổ chức các chức năng trong cửa sổ Giao diện cho phép người dùng tổ chức cửa sổ riêng, đánh số chúng, lựa chọn cửa sổ

ước 6: chọn thiết bị tương tác phù hợp (i) Chọn các thiết bị nhập Trong trường hợp này,

người thiết kế biết đặc tính của thiết bị nhập, các loại thiết bị nhập cần thiết và đề ra lựa chọn phù hợp (ii) Chọn các thiết bị xuất Có nhiều thiết bị xuất dữ liệu, đặc biệt trong môi trường đa phương tiện Tuy nhiên thiết bị hiển thị, tức màn hình, và hệ thống âm thanh, chẳng hạn loa cần tính đến trước tiên

ước 7: chọn điều khiển trên màn hình tương tác (i) Điều khiển các lệnh, ứng với hộp câu

lệnh (ii) Điều khiển nhập văn bản; (iii) Các điều khiển lựa chọn Nhiều thành phần giao diện cho phép lựa chọn, gồm hộp radio, hộp đánh dấu, bảng màu, hộp danh sách, hộp kéo thả (iv) Điều khiển hỗn hợp cả nhập dữ liệu lẫn lựa chọn (iv) Điều khiển tự cắt may (v) Các điều khiển thể hiện Việc thể hiện thông tin có thể thực hiện thông qua trường văn bản cố định, nhóm các hộp, nhan đề, lời nhắn, hộp mẫu (vi) Lựa chọn điều khiển phù hợp, nhờ giao diện đồ họa Người ta có thể sử dụng giao diện hướng khuôn dạng để chọn chức năng điều khiển

ước 8: viết thông báo và văn bản sáng sủa (i) Người thiết kế xác định các văn bản, từ,

câu, thông báo Các yếu tố liên quan của các đối tượng này là dễ đọc, loại thông báo, tính thể

PTIT

hiện của văn bản (ii) Nội dung và văn bản đối với trang web Người ta quan tâm đến các dòng nhan đề, các chỉ thị và các thông báo lỗi

ước 9: đảm bảo phản hồi hiệu quả, hướng dẫn và trợ giúp (i) Phản hồi có ý nghĩa trong

quá trình tương tác Liên quan tới phản hồi là thời gian phản hồi, trễ, tín hiệu chú ý và sử dụng

âm thanh để nhấn mạnh (ii) Giao diện cần có hướng dẫn và trợ giúp Trong hệ thống đa phương tiện, việc hướng dẫn thông qua công cụ đồ họa là thuận tiện Việc hướng dẫn và trợ giúp liên quan tới việc tránh lỗi, quản trị vấn đề, nhắc câu lệnh, trợ giúp theo ngữ cảnh, trình hướng dẫn từng bước cho người dùng

ước 10: đảm bảo quốc tế hóa và dễ truy cập (i) Giao diện để phổ dụng nên được thiết kế

ngay ban đầu theo các chuẩn Liên quan đến vấn đề này, người ta quan tâm đến tính bản địa, khía cạnh văn hóa, ngôn ngữ, hình ảnh và kí hiệu đặc thù, màu sắc và tính biểu hiện của màu (ii) Tính truy cập dễ dàng đề cập thiết kế truy cập, đến các dạng tiện cho truy cập

ước 11: tạo đồ họa, biểu tượng và hình ảnh mang ý nghĩa (i) Giao diện hướng biểu tượng

đã được dùng từ những năm 80 Liên quan đến biểu tượng là các đặc tính của biểu tượng, tác động của sử dụng biểu tượng, vẽ và tạo biểu tượng, các biểu tượng chuyển động, quá trình thiết

kế giao diện hướng biểu tượng (ii) Giao diện đa phương tiện cần tổng hợp các công cụ và thành phần đa phương tiện (iii) Giao diện đồ họa sử dụng các khía cạnh đa phương tiện Các phương tiện thường gặp là hình ảnh, video, hình động, biểu đồ, hình vẽ, phương tiện hỗ hợp

ước 12: chọn màu phù hợp (i) Trước hết giao diện xác định lược đồ màu, chẳng hạn

RGB, HSV (ii) Xác định vai trò của màu sắc; màu dùng để trợ giúp tạo dạng; màu dùng để hiển thị… (iii) Những vấn đề liên quan đến màu sắc màu có ngữ nghĩa khi hiện trong môi trường cụ thể của màn hình Màu có tác dụng gây chú ý người dùng Với màu sắc, nhận thức của người dùng thay đổi, tùy độ nhạy với màu của mắt con người (iv) Màu sắc với thị giác người dùng, liên quan đến hệ thống quang học, nhãn cầu mắt người dùng (v) Lựa chọn màu trong giao diện Việc chọn này tùy vào nhiều yếu tố Người ta chọn màu theo phạm trù thông tin, ngữ cảnh giao diện, nhu cầu thể hiện, tính hài hòa, tùy theo vị trí Màu sắc đối tượng đi đôi với màu nền, khung cảnh nhiều chiều, loại màn hình máy tính Ngoài ra lựa chọn màu còn do văn hóa, chuyên môn của người dùng (vi) Chọn màu cho màn hình đồ họa kiểu văn bản Lúc này cần lưu ý đến màu văn bản với màu nền Trước tiên cần lựa chọn màu nền Việc chọn màu văn bản có thể có công cụ trợ giúp (vii) Chọn màu cho màn hình đồ họa có nhiệm vụ thống kê Trường hợp này cần lưu ý đến điều cần nhấn mạnh, số các màu sử dụng, kích thước và trạng thái của vùng Ngoài ra, nên quan tâm đến ấn tượng vật lí của màu (viii) Chọn màu cho trang web Trên trang tin, màu sắc cũng có thông tin Bố cục màu là cần thiết

ước 13: tổ chức và hiện các cửa sổ và các trang thông tin Màn hình được tổ chức để hiển

thị hợp lí Người ta sử dụng các hướng dẫn thông dụng về thông số cửa sổ, về tổ chức Nên có công cụ tìm chọn điều khiển

PTIT

20

ước 14: Thử nghiệm nhiều lần (i) Thử tính sử dụng Cần xác định mục đích của thử tính

sử dụng của giao diện, và xác định tầm quan trọng của việc này Người dùng và người thiết kế định ra phạm vi thử nghiệm (ii) Thử mẫu Có nhiều công cụ dùng như mẫu, cho phép thử nghiệm giao diện Có dạng mẫu chương trình hóa, mẫu tương tác, theo các kịch bản đa dạng (iii) Các kiểu thử nghiệm Người ta có thể đánh giá may rủi, theo kinh nghiệm, có hướng dẫn theo chuẩn Một kiểu thử nghiệm là đi theo logic tự nhiên của nhiệm vụ (iii) Phát triển và dẫn dắt thử nghiệm Việc thử nghiệm có thể theo kế hoạch, kịch bản định sẵn Trong quá trình đó, hệ thống

có thể thu thập dữ liệu (iv) Một số công việc khác, như phân tích, thử lại, đánh giá hệ thống…

1.2.5 Những bài học ví dụ

Các trò chơi là thí dụ minh họa đầy thuyết phục về (i) thẩm mĩ của giao diện; (ii) sử dụng kiến thức của trí tuệ nhân tạo; (iii) tương tác Tương tác ở đây được chú trọng vào (i) tương tác giữa hai đối tượng, thường giữa người và máy; (ii) tương tác giữa nhiều đối tượng

Hình 1.7 Trò giải trí, cần đến trí tuệ người chơi, đáp ứng trí tuệ máy đã xác định

Trong trò giải trí, người dùng cần tung, xếp bóng Máy đặt ra các tình huống, được coi như một người chơi khác Hai đối tượng có hành động qua, lại Hệ thống cho phép:

 Đánh giá điểm;

 Tạm nghỉ;

 Lựa chọn các chế độ chơi, ứng với độ khó của trò chơi

PTIT

Hình 1.8 Trò chơi cờ, cần tương tác giữa hai đối thủ

1.3 Những hoạt động và đặc tính khi thực hiện thiết kế tương tác

Có nhiều phạm trù thiết kế, chẳng hạn thiết kế đồ họa, thiết kế kiến trúc, thiết kế phần mềm, thiết kế công nghiệp Mỗi phạm trù đều có diễn giải riêng về việc thiết kế Người ta có thể xác định việc thiết kế như kế hoạch hay lược đồ nhận thức được và nhằm tới dãy các khai thác

Trong thiết kế tương tác, người ta điều tra việc sử dụng các phương tiện và lĩnh vực đích nhờ tiếp cận phát triển hướng người dùng Điều này có nghĩa con người trực tiếp thực hiện, chứ không chỉ kĩ thuật Công việc thiết kế cần đáp ứng nhiều tham số, tức cần cân đối các yêu cầu xung đột nhau Người ta có thể sử dụng nhiều kĩ thuật, sao cho hiệu quả Quá trình thiết kế cũng cần đến người dùng; vậy nên việc nắm bắt và diễn giải thiết kế dưới dạng phù hợp là đặc biệt quan trọng, do người dùng không hiểu vấn đề như các chuyên gia thiết kế

Thiết kế tương tác đòi hỏi phát triển kế hoạch nhằm vào sản phẩm, lĩnh vực đích, hiện ra những điều thực tế Người ta đưa ra nhiều thiết kế, thuận tiện cho người dùng nắm bắt, đánh giá

Để đánh giá thành công, thiết kế nên thể hiện dưới dạng thích hợp với tương tác của người dùng PTIT

22

Hình 1.9 Phác thảo ý chính trên lịch điện tử

1.3.1 Bốn hoạt động bắt buộc khi thực hiện thiết kế tương tác

Bốn hoạt động căn bản đối với thiết kế tương tác gồm:

1 Xác định nhu cầu và thiết lập các yêu cầu;

2 Phát triển các giải pháp thiết kế đáp ứng yêu cầu;

3 Xây dựng các thế hệ tương tác để người ta có thể liên lạc, lưu lại;

4 Đánh giá các giải pháp, tức đo mức đáp ứng nhu cầu của các giải pháp;

Đó là những hoạt động chung nhất, cho các loại thiết kế khác Việc thiết kế có thể theo các mẫu, hướng dẫn khách hàng phát triển bản thiết kế mẫu Thiết kế chi tiết sẽ xác định tất cả những thành phần; việc sản xuất sẽ cho ra sản phẩm Khi công việc đã được triển khai, người ta tính đến thương mại

1.3.1.1 Xác định nhu cầu và thiết lập các yêu cầu

Để thiết kế trợ giúp con người, cần biết người dùng cuối cùng là ai và loại trợ giúp mà sản phẩm tương tác có thể đáp ứng Các nhu cầu này tạo nên cơ sở của các yêu cầu về sản phẩm và dẫn đến dãy các thiết kế và phát triển

PTIT

Hình 1.10 Doanh nghiệp đề nghị thiết kế trang Web

Hoạt động này là căn bản trong tiếp cận hướng người dùng; là rất quan trọng trong thiết kế tương tác

Chẳng hạn, người thiết kế khảo sát tình hình doanh nghiệp, lên kế hoạch tìm hiểu nhu cầu xây dựng trang Web Chính doanh nghiệp là bên đặt ra những yêu cầu cho trang Web, về nội dung và hình thức

1.3.1.2 Phát triển các giải pháp thiết kế

Đây là hoạt động trung tâm của quá trình thiết kế, tức đề xuất các ý tưởng đáp ứng các yêu cầu Hoạt động này được chia nhỏ thành các hoạt động nhỏ (i) thiết kế khái niệm; và (ii) thiết kế vật lí

Thiết kế khái niệm cần cho ra mô hình khái niệm cho sản phẩm; mô hình khái niệm mô tả điều mà sản phẩm cần thực hiện, dạng sản phẩm Thiết kế vật lí xét chi tiết sản phẩm này, từ màu sắc, âm thanh, hình ảnh sử dụng, đến thiết kế thực đơn, thiết kế biểu tượng Mỗi hoạt động nhỏ cho ra nhiều giải pháp

Chẳng hạn, đối với thiết kế trang Web, người thiết kế đề xuất các giải pháp kĩ thuật liên quan đến nhu cầu của doanh nghiệp Một vài phương án thiết kế có thể đưa ra để điều chỉnh thỏa thuận trong phiên làm việc trước với doanh nghiệp

PTIT

24

Hình 1.11 Minh họa về chọn một mẫu đáp ứng nhu cầu về trang Web

1.3.1.3 Xây dựng thế hệ tương tác của thiết kế

Thiết kế tương tác cho ra các sản phẩm tương tác Đối với các thiết kế này, người dùng cần tương tác với chúng Điều này có nghĩa một thế hệ thiết kế được dựng nên, tuy không nhất thiết phải có thế hệ phần mềm Có các kĩ thuật khác nhau với tính năng tương tác, nhưng không phải tất cả chúng cần phải có phần mềm Chẳng hạn mẫu thiết kế trên giấy là rất tiện lợi và hiệu khi cần xác định công việc

1.3.1.4 Đánh giá thiết kế

Đánh giá là quá trình xác định tính sử dụng và tính đáp ứng của sản phẩm hay của thiết kế, được đo bằng các tiêu chí Các tiêu chí này có thể là số các lỗi người dùng mắc khi sử dụng, cách thông báo, cách đáp ứng các yêu cầu…

Thiết kế tương tác yêu cầu mức đáp ứng người dùng cao hơn thông qua quá trình phát triển,

và việc này tăng cường các thay đổi của sản phẩm chấp nhận được đã được đưa ra Trong hầu hết hoàn cảnh thiết kế, người ta có thể thấy một số những hoạt động liên quan đến đảm bảo chất lượng và thử nghiệm, để tin chắc sản phẩm cuối cùng sẽ là khớp với mục tiêu Việc đánh giá không thay thế các hoạt động này, nhưng bổ sung và tăng cường

Những hoạt động phát triển thiết kế thay thế, xây dựng thế hệ tương tác của thiết kế, và đánh giá quện vào nhau, theo nghĩa các giải pháp được đánh giá thông qua các thế hệ tương tác của thiết kế và kết quả được đưa trở lại thiết kế tiếp theo Quá trình lặp này là tính chất quan trọng trong quá trình thiết kế tương tác

1.3.2 Ba đặc tính chủ chốt trong qui trình thiết kế tương tác

Người ta tin rằng có ba đặc tính tạo nên phân quan trọng của quá trình thiết kế tương tác

PTIT

1 Chú trọng vào người dùng Nhu cầu chú trọng vào người dùng được nhấn mạnh

trong tiếp cận hướng người dùng, mà thiết kế tương tác tuân theo Người dùng tham gia vào quá trình thiết kế, tạo cơ hội để thiết kế có ý kiến phản hồi Việc đánh giá được thực hiện ngay trong bất kì lúc nào của quá trình

2 Xác định tính sử dụng và đích của người dùng Việc xác định nên thực hiện dưới

dạng văn bản, thực hiện ngay đầu đề án thiết kế Việc này giúp người thiết kế chọn phương án thiết kế thay thế và kiểm tả quá trình khi phát triển sản phẩm

3 Thiết kế lặp Yêu cầu về lặp lại các pha, hay các bước, trong chu trình phát triển

phần mềm là chính đáng, nhưng khó được đáp ứng Với tiếp cận hướng người dùng, theo mô hình hình sao, người ta dễ dàng lặp lại các pha thiết kế Việc lặp lại cho phép tinh chỉnh và thu nhận phản hồi Khi người dùng và người thiết kế cùng cam kết về lĩnh vực và bắt đầu trao đổi về những yêu cầu, nhu cầu, ý tưởng, cũng có những chi tiết cần được bổ sung Việc lặp cho phép tinh chỉnh các yêu cầu Tuy rằng người thiết kế giỏi và người dùng nhìn rõ những vấn đề, vẫn nên đưa các kết quả ra xem lại, để chắc chắn tốt Điều này thực sự cần thiết, khi người ta sáng tạo Việc sáng tạo không hợp nhất mọi thứ, mà tiến hóa, thử và chỉnh lí, với mức kiên nhẫn cao Việc lặp là không tránh khỏi do người thiết kế chưa bao giờ đạt được giải pháp đúng ngay lần đầu

2 Xác định nhu cầu, các dạng nhu cầu và mức độ cần thiết;

3 Cách thức tạo các giải pháp thay thế, tức giải pháp phụ, bên cạnh giải pháp đạt được;

4 Cách lựa chọn một giải pháp trong số nhiều giải pháp thiết kế tương tác

Bốn khía cạnh trên được làm rõ qua thí dụ vận dụng tại công ty thiết kế tương tác Công ty thiết kế IDEO đã yêu cầu thiết kế nhiều dạng khác nhau của cùng loại thiết bị Chẳng hạn, nhiều dạng chuột được thiết kế để chọn ra mẫu phù hợp Người ta đã sử dụng phòng thí nghiệm TechBox với khoảng 200 mẫu và các vật liệu phù hợp; chúng được chia thành (i) các vật liệu đáng ngạc nhiên; (ii) cơ chế hay; (iii) quá trình sản xuất lí thú; (iv) công nghệ điện tử; và (v) nhiệt

và quang học

PTIT

26

Hình 1.12 Hộp công cụ TechBox

Với các công cụ của TechBox, việc xác định các giải pháp đối với nhu cầu người dùng là thuận tiện hơn Chẳng hạn người ta có thể nghĩ ngay ra giải pháp, tức sáng tạo trong thiết kế, khi đối mặt với các dụng cụ trước mặt Với nhiều công cụ, người thiết kế dễ dàng đưa ra các giải pháp khác, tức giải pháp phòng hờ hay thay thế

1.4 Vai trò của thiết kế tương tác trong phát triển sản phẩm đa phương tiện và khả năng

sử dụng

Liên quan đến sản phẩm đa phương tiện, người ta đề cập quá trình sản xuất ra sản phẩm, được thực hiện dưới dạng đề án công nghệ thông tin Đề án này có thể được gọi là đề án đa phương tiện Quá trình triển khai đề án được gọi là quá trình đa phương tiện

Định nghĩa: Quá trình đa phương tiện là quá trình thực hiện đề án công nghệ thông tin, nhằm sản xuất ra sản phẩm đa phương tiện

Lưu ý thuật ngữ đa phương tiện có thể được dùng như danh từ, chỉ các phương tiện, hay tính từ, liên quan đến các đối tượng sử dụng, tác động… đến sản phẩm đa phương tiện

Không phải tất cả những dữ liệu đa phương tiện đều có tương tác Tương tác nhằm vào hành vi, hoạt động giữa nhiều chủ thể, chẳng hạn giữa người dùng và thiết bị Các thiết bị hay nói chung các sản phẩm đa phương tiện cần được thiết kế để đảm bảo quá trình tương tác giữa người dùng và chúng trở nên thuận tiện

1.4.1 Thiết kế tương tác trong kinh doanh

Liên quan đến vấn đề thiết kế tương tác trong kinh doanh, người ta muốn thể hiện những điểm lợi ích mà thiết kế tương tác đem lại, chứ không chỉ biết một số nguyên tắc về thiết kế Người ta muốn xem nếu thiết kế không tốt sẽ thiệt hại ra sao đối với những doanh nhân, trong đó lợi ích tiền bạc là trọng

PTIT

Hình 1.13 Nơi thiết kế của Swim

Đáp ứng nhu cầu ngày càng tăng về thiết kế tương tác, người ta đã lập nên nhiều cơ sở tư vấn, với nhiều chuyên gia tư vấn Một trong nhiều công ty như vậy, xem như thí dụ của việc thiết

kế tương tác, là Swim, do Gitta Salomon lập nên, trợ giúp khách hàng trong việc thiết kế các sản phẩm tương tác Công ty sẽ cho khách hàng biết cách thực hiện thiết kế tương tác quan trọng, mà

tự học không hiểu lí do thực hiện Rồi khách hàng phát triển từng phần sản phẩm và yêu cầu công

ty trợ giúp Điều này có thể giống như dạng chuyên gia xem xét, hỗ trợ từng công đoạn, xem lại tính sử dụng được của sản phẩm

Hình 1.14 Cửa cắm USB hợp lí và không hợp lí, nếu thiết kế tương tác không tốt

Tương tác là tâm điểm của khung tham chiếu trong thị trường kinh doanh Vậy nên người

ta muốn tìm ra cách thức tương tác trong quá trình của công việc Năm 1983, Terry Winograd và đồng nghiệp đã phát triển mô hình tương tác kinh doanh, làm cơ sở cho phần mềm quản trị quá

trình kinh doanh Mô hình điều phối tương tác giữa khách hàng, tức cá nhân hay nhóm đặt yêu cầu, với bên thực hiện, tức nhóm người đáp ứng yêu cầu Quá trình tương tác qua 4 pha:

1 Chuẩn bị: khách hàng lên kế hoạch và các chi tiết yêu cầu;

2 Thương thuyết: khách hàng và bên thực hiện thương thuyết cho đến khi đạt được

thỏa thuận về công việc;

3 Thực hiện: bên thực hiện hoàn thiện thỏa thuận và các báo cáo;

4 Chấp thuận: khách hàng đánh giá công việc và thông báo đã thỏa mãn hay chỉ ra vài

PTIT

28

điều cần thực hiện tiếp

Chuẩn bị

Khách hàng xác định công việc

Thương thuyết

Khách hàng và bên thực hiện đi đến cam kết

Chấp thuận

Khách hàng đánh giá công việc và thông báo

Thực hiện

Bên thực hiện đáp ứng công việc và báo cáo

Yêu cầu

Cam kết

Thông báo hoàn thành

Thông báo thỏa mãn

Hình 1.15 Các điều kiện thỏa mãn hoàn thành cam kết

Việc ứng dụng mô hình tương tác kinh doanh sẽ thuận tiện đối với (i) tốc độ; (ii) thanh toán; (iii) hiển thị; (iv) thỏa mãn khách hàng Ngoài ra, không bước nào trong quá trình được xem

là hoàn thành cho đến khi khách hàng thỏa mãn với kết quả của bước này Khi một bước hoàn thành, chu trình khép kín và quá trình lại tiếp tục Phương pháp luận đảm bảo mỗi bước của công việc sẽ dẫn đến kết quả cuối cùng theo ý muốn Ngoài ra, người ta thấy được tính hiển thị, khả năng thanh toán xuất hiện trong toàn bộ quá trình, nên thời gian tiêu tốn để lặp lại được giảm nhiều

Liên quan đến tương tác trong kinh doanh, người ta đề cập quá trình con người điều hành công việc thay đổi liên tục và phức tạp Tương tác người dùng được xem là trái tim hay linh hồn của quản trị quá trình kinh doanh Vấn đề này đòi hỏi kiến thức về sinh học, tâm lí học, lí thuyết

hệ thống xã hội, lí thuyết học… với hiểu biết sâu về phân tích quá trình kinh doanh Đích cuối cùng là một dạng của lí thuyết hoàn chỉnh về công việc của con người Những khía cạnh đề cập là (i) công việc và những vấn đề liên quan; (ii) lí thuyết về các vai1; (iii) mô hình hóa tương tác mang tính người; (iv) tăng cường tương tác người dùng; (v) hệ thống quản trị tương tác người dùng

Trợ giúp công nghệ cho tương tác trong kinh doanh là cần thiết, theo (i) truyền thông; (ii) mức độ tương tác của người dùng tham gia; (iii) tốc độ; (iv) mức quan hệ về con người với nhau

Về phía người thiết kế, thiết kế tương tác cần được xem là kinh doanh quan trọng Cụ thể

từ những người tư vấn về trang web đến công nghiệp tính toán di động đều có vai trò trong sản phẩm tương tác Trong những lĩnh vực đầy cạnh tranh, việc sử dụng sản phẩm cần dễ dàng và

1

Role, vai, vai trò

PTIT

hiệu quả

Đối với những sản phẩm đòi hỏi công nghệ cao như công nghệ ba chiều, hiện thực ảo… người ta thiết kế tương tác cẩn thận, do việc làm lại một công đoạn sản xuất sẽ gây tốn kém nhiều Người ta thấy rằng một khi người dùng không còn ưa chuộng sản phẩm đa phương tiện, do tương tác và lí do khác, họ sẽ không quay lại với sản phẩm đó nữa

Đáp ứng nhu cầu ngày càng tăng về thiết kế tương tác, nhiều đơn vị tư vấn sẵn sàng trợ giúp quá trình thiết kế tương tác Việc huy động chuyên gia không thể tránh khỏi Tuy nhiên, tính

sử dụng của sản phẩm còn liên quan đến sử dụng của người dùng cuối cùng; do vậy quá trình thiết kế tương tác còn có người dùng làm việc với chuyên gia

1.4.2 Mục tiêu của thiết kế tương tác: khả năng sử dụng và thói quen người dùng

Quá trình thiết kế tương tác luôn coi trọng việc xác định nhu cầu người dùng Việc xác định nhu cầu này liên quan đến xác định những mục tiêu của quá trình Mục tiêu về tính sử dụng, về kinh nghiệm của người dùng là những thứ người ta tính đến trước tiên

1.4.2.1 Tính sử dụng của sản phẩm

Nhìn chung, tính sử dụng của sản phẩm tương tác là (i) dễ học; (ii) sử dụng hiệu quả1

; (iii) thoải mái khi dùng Tương tác cũng cần hoàn thiện, tạo điều kiện cho người dùng thực hiện những hoạt động trong công tác, trong cuộc sống hàng ngày Mục tiêu về tính sử dụng có thể chi tiết dưới các mục tiêu nhỏ hơn:

1.4.2.2 Kinh nghiệm của người dùng

Công nghệ mạnh và công nghệ cao cho phép đáp ứng nhiều nhu cầu người dùng Người ta hay kể ra công nghệ hội tụ, chẳng hạn hiện thực ảo với tính toán di động, trong nhiều lĩnh vực ứng dụng, chẳng hạn giải trí với giáo dục Các công nghệ này cho phép mở rộng mối quan tâm,

1

Về khái niệm hiệu quả, nhiều tài liệu xác định hai khca, ứng vv hai mức độ (i) làm điều đúng; (ii) làm tốt điều đúng đó

PTIT

30

cũng như nhu cầu tương tác, sử dụng Việc tăng cường tính hiệu quả của công việc yêu cầu hệ thống tương tác tạo ra hệ thống đáp ứng người dùng về (i) nhu cầu vật lí của người dùng; (ii) nhu cầu về tình cảnh, tinh thần của người dùng; (iii) nhu cầu thẩm mĩ, mức cao hơn của người dùng Khi được đáp ứng các nhu cầu, từ nhu cầu vật chất đến nhu càu tình cảm, tâm sinh lí, người dùng sẽ cảm thấy thích sản phẩm Việc này đòi hỏi khơi dậy bản chất của kinh nghiệm của người dùng Mục tiêu về kinh nghiệm người dùng khác với mục tiêu về tính sử dụng ở chỗ cách người dùng trải nghiệm sản phẩm tương tác theo cách nhìn của họ, thay vì đi tìm cách thức hữu hiệu ứng với cách nhìn của riêng họ Mối quan hệ này được thể hiện qua hình vẽ

Các đích về tính sử dụng là trung tâm của thiết kế tương tác và được thực hiện theo các tiêu chí riêng.

Các đích về kinh nghiệm người dùng xuất hiện tại vòng tròn ngoài và được xác định kém sáng sủa

Các đích về tính sử dụng

Giải trí

Thích thú

Giải trí

Hình 1.16 Đích về tính sử dụng và kinh nghiệm người dùng

Nhận thức và hiểu biết mối quan hệ giữa tính sử dụng và kinh nghiệm người dùng là cần thiết Điều này khiến người thiết kế ý thức về tổ hợp các kĩ thuật để đáp ứng nhiều nhất nhu cầu người dùng Tuy nhiên, không phải mọi sản phẩm đa phương tiện đều có khả năng tương tác Ngoài ra, tổ hợp nhiều kĩ thuật tương tác nhiều khi không tương thích

Như vậy, thiết kế tương tác cần dựa vào người dùng, cụ thể là thói quen và khả ăng người dùng để đạt được sản phẩm Sản phẩm ở đây là (i) giao diện tương tác; (ii) sản phẩm đa phương tiện, cho phép tương tác nếu người dùng cần Một số thí dụ:

1 Đối với người khuyết tật, các công trình xây dựng, các trạm dịch vụ cần được thiết

kế đặc biệt Chẳng hạn lối đi cho người đi xe lăn là lối đi giành riêng, không phải leo bậc thang Những nhà vệ sinh công cộng cũng được thiết kế riêng đối với người khuyết tật;

PTIT

Hình 1.17 Giành riêng cho người khuyết tật

2 Ngôn ngữ trao đổi giữa những người khiếm thính hay có tật về phát âm được hình thức hóa và trở nên phổ biến Ngôn ngữ cử chỉ là một thí dụ Bộ chữ Braille1

là một trong những công cụ tương tác giữa người khiếm thị với môi trường

Hình 1.18 Bộ chữ Braille

1.4.3 Mối liên hệ giữa thiết kế tương tác và những thành phần đa phương tiện: màu sắc, văn bản, biểu tượng

Để thể hiện mối liên quan giữa thiết kế tương tác và các thiết bị đa phương tiện, cần biết rõ

về quá trình thiết kế tương tác người dùng Tiếp theo người ta thể hiện mối liên quan trong việc

sử dụng màu sắc, hình ảnh… trong giao diện người dùng

Nội dung phần này đề cập nhiều vấn đề liên quan đến đa phương tiện Người đọc có thể tham khảo thêm các tài liệu khác để thấy được mối liên quan giữa các thành phần đa phương tiện

và ứng dụng trong quá trình thiết kế tương tác

1

Louis Braille 1809 - 1852, sáng tạo ra bộ chữ cho người khiếm thị

PTIT

32

1.4.3.1 Quá trình thiết kế tương tác

Việc thiết kế đòi hỏi hiểu biết về người dùng, tiến đến công tác thiết kế hướng người dùng Trong những phần khác của chương này, tiếp cận hướng người dùng đã khẳng định những yêu cầu, kĩ thuật, đảm bảo đầu ra của quá trình thiết kế đáp ứng các nhu cầu người dùng

Liên quan đến tính sử dụng của giao diện tương tác, người ta xác định (i) các tiêu chí đáp ứng tính sử dụng của giao diện tương tác; (ii) các công cụ đo độ sử dụng được, theo định tính và định lượng; (iii) qui trình đo tính sử dụng và những trở ngại khi tiến hành đo Người ta chỉ ra các vấn đề chung liên quan đến tính sử dụng của giao diện tương tác; chẳng hạn theo Mandel, 1994, trong các hệ thống đồ họa có 10 vấn đề thường gặp

1 Các thực đơn và biểu tượng không rõ ràng;

2 Các ngôn ngữ mới chỉ cho phép theo một hướng trong hệ thống thông tin;

3 Việc nhập dữ liệu và xử lí trực tiếp còn hạn chế;

4 Còn hạn chế về chọn và đánh dấu dữ liệu;

5 Dãy các bước thực hiện chưa rõ ràng;

6 Người ta phải qua nhiều bước để thực hiện chỉ một vài nhiệm vụ;

7 Giữa các ứng dụng hay trong một ứng dụng còn xuất hiện nhiều liên kết;

8 Việc khẳng định và phản hồi thông tin chưa tương xứng;

9 Thiếu các dự báo về hệ thống và chưa có khả năng thông minh;

10 Các thông báo lỗi, trợ giúp, hướng dẫn và tư liệu chưa đầy đủ

Khi phát hiện được các nhược điểm của giao diện tương tác, cần có biện pháp tránh đối với các thiết kế sau Tuy nhiên không phải bao giờ cũng đáp ứng hết nhu cầu người dùng, và đôi khi giao diện vẫn chịu một số lỗi nào đó

Quá trình thiết kế tương tác có thể tuân theo nhiều bước Người ta chia các bước theo qui

mô của giao diện, phát triển tự nhiên của tư duy người thiết kế, và điều kiện của hạ tầng công nghệ thông tin và truyền thông Quá trình có 14 bước

1 Hiểu người dùng Bước này đề cập (i) hiểu biết về người dùng khi tương tác với hệ thống

máy tính; (ii) các đặc tính mang tính người trong thiết kế tương tác; (iii) quan niệm về thiết

kế của hệ thống kinh doanh; (iv) tốc độ tương tác của người dùng;

2 Hiểu các chức năng kinh doanh Để hiểu các chức năng kinh doanh, cần thiết (i) xác định

PTIT

vấn đề kinh doanh và phân tích các nhu cầu kinh doanh; (ii) xác định những chức năng cơ bản của kinh doanh; (iii) một số chuẩn thiết kế sẽ sử dụng; (iv) nhu cầu về tư liệu và huấn luyện cho người dùng và người thiết kế;

3 Hiểu các nguyên lí về giao diện tốt và việc thiết kế trang màn hình Giao diện người dùng

từ khi có các vi xử lí được sử dụng màn hình tương tác; đề cập giao diện tương tác tốt khiến người ta nghĩ đến tương tác màn hình tốt Liên quan đến vấn đề này là (i) quan niệm

về thiết kế giao diện và thiết kế giao diện màn hình tương tác; (ii) khía cạnh công nghệ trong thiết kế tương tác;

4 Phát triển hệ thống các thực đơn và các lược đồ dò tìm Phần khác trong chương sẽ đề cập

sâu về giao diện hướng thực đơn Nói chung bước này của quá trình cần (i) xác định cấu trúc, chức năng, nội dung, tạo dạng, cách thức tùy chọn… của các thực đơn; (ii) các công

cụ dò tìm trong hệ thống thông tin, đặc biệt trong hệ thống Web Thực đơn đồ họa là một khía cạnh được quan tâm;

5 Lựa chọn loại cửa sổ phù hợp Giao diện cửa sổ thông dụng trong nhiều phần mềm môi

trường Để thiết kế, sử dụng hệ thống các cửa sổ, cần trang bị những kiến thức về (i) đặc trưng của cửa sổ; (ii) các thành phần trong giao diện cửa sổ; (iii) những phong cách thể hiện và các loại cửa sổ; (iv) tổ chức các chức năng trong giao diện cửa sổ;

6 Lựa chọn các thiết bị tương tác phù hợp Trong giáo trình về giao diện tương tác người

dùng, các thiết bị kĩ thuật được xem như hạ tầng kĩ thuật của giao diện, hay khía cạnh công nghệ trong giao diện Nhiều thiết bị đi kèm công nghệ mới được sử dụng trong giao diện tương tác tiên tiến Tuy vậy, trước hết cần phân loại chúng theo (i) thiết bị nhập thông tin; (ii) thiết bị xuất thông tin Về thiết bị, chủ yếu là máy tính, người ta cần có lựa chọn theo giải pháp tổng thể Một phần để các thiết bị lẻ có thể tương hợp nhau, mặt khác tiện cho cài đặt các phần mềm chuyên dụng Các chủng loại máy vi tính được chọn có bộ vi xử lí Motorola hoặc Intel Ngoài ra cần có (i) máy tính chủ; (ii) máy in; (iii) máy quét; (iv) bìa

âm thanh, hoặc trên máy tính đã có chức năng như bìa âm thanh; (v) thiết bị ghi CD1

; (vi) thiết bị MIDI2

7 Chọn các điều khiển phù hợp trên màn hình Nhiều loại điều khiển trong giao diện tương

tác Đối với giao diện sử dụng màn hình, người ta đề cập (i) các điều khiển thao tác; (ii) điều khiển lựa chọn; (iii) các điều khiển chọn và nhập thông tin; (iv) các điều khiển tự xây dựng; (v) các điều khiển thể hiện thông tin;

8 Liệt kê văn bản và các thông báo rõ ràng Các thông tin xuất ở dạng văn bản là thông

dụng Liên quan đến dạng thông tin này, người ta quan tâm (i) các dạng câu, từ ngữ, văn

34

bản và thông báo; (ii) nội dung và văn bản trên trang Web;

9 Đảm bảo phản hồi hiệu quả và có hướng dẫn, trợ giúp người dùng Để tăng tương tác

người dùng, phản hồi về kết quả tương tác và các công cụ trợ giúp người dùng có ý nghĩa Nội dung này được đề cập trong phần khác của chương;

10 Đảm bảo tính toàn cầu và dễ truy cập Cần để giao diện (i) tuân theo chuẩn quốc tế; (ii)

cho phép người dùng dễ dàng truy cập;

11 Tạo nên những hình ảnh, đồ họa và các biểu tượng có ý nghĩa Liên quan đến khía cạnh

này có (i) các biểu tượng tĩnh và động; (ii) các đối tượng đa phương tiện; (iii) sử dụng đồ họa trong giao diện;

12 Lựa chọn màu phù hợp Người thiết kế cần có ý niệm về hội họa và đồ họa trong quá trình

thiết kế tương tác Ít nhất cần trang bị những kiến thức phổ thông về màu sắc (i) sử dụng màu; (ii) những vấn đề gặp phải khi sử dụng màu; (iii) màu sắc đối với nhận thức nhìn của người dùng; (iv) lựa chọn màu; (v) màu trên màn hình đồ họa dùng văn bản; (vi) màu trên màn hình đồ họa để thống kê; (vii) chọn màu trên trang Web;

13 Tổ chức và hiện các trang màn hình, cửa sổ Việc này liên quan đến (i) tổ chức hiện màn

hình; (ii) lược đồ lật các trang màn hình;

14 Thử nghiệm nhiều lần Người thiết kế xác định (i) tính sử dụng; (ii) các mẫu thử; (iii) các

loại thử nghiệm giao diện tương tác; (iv) các công cụ và thực hiện thử nghiệm

1.4.3.2 Tạo những hình ảnh, biểu tượng và các đồ họa có ý nghĩa

Từ khi trạm làm việc Star của hãng Xerox và máy tính Macintosh và Lisa của hãng Apple

sử dụng giao diện đồ họa, vào những năm 70 của thế kỉ XX, người ta bắt đầu quen với giao diện người dùng đồ họa GUI Sau này có nhiều ứng dụng trên Web, nhu cầu về GUI tăng cao Đồ họa trên màn hình là kĩ thuật đáng quan tâm; nó có ưu điểm về thân thiện với người dùng, có thẩm

mĩ, nhưng cũng yêu cầu những điều kiện hạ tầng tiên tiến và đôi khi cũng làm phân tán chú ý của người dùng về công việc chính

Liên quan đến thiết kế các công cụ đồ họa khi thiết kế giao diện tương tác người dùng GUI hay thiết kế màn hình trang Web, người ta xem xét:

 Các loại biểu tượng và những đặc trưng, tác động của các biểu tượng;

 Cách lựa chọn các biểu tượng và quá trình thiết kế biểu tượng;

 Hướng dẫn thiết kế đối với các phương tiện đồ họa khác, gồm các hình ảnh, ảnh chụp,

sơ đồ, hình vẽ, âm thanh và hình động

PTIT

1.4.3.3 Các biểu tượng trong giao diện tương tác

Định nghĩa: iểu tượng là hình ảnh thường sử dụng để thể hiện các đối tượng và các hành động, cho phép người dùng tương tác với nó hay xử lí công việc gắn với nó

Biểu tượng có thể nằm trong cửa sổ hay trên màn hình tương tác Tác động của biểu tượng

là gây chú ý của người dùng mạnh hơn Một số khía cạnh liên quan đến biểu tượng được trình bày làn lượt sau đây

1 Các loại biểu tượng Biểu tượng phản ánh các đối tượng, ý tưởng, hay hành động đã quen

thuộc Truyền thông thông qua biểu tượng cũng là kiểu tương tác giữa các nhóm người

Hình 1.19 Một số biểu tượng với ý nghĩa thông dụng

Những quan niệm về biểu tượng có thể là (i) biểu tượng: đại diện cho những thứ quen thuộc; (ii) chỉ mục: kí hiệu cho phép tham chiếu đến đối tượng; (iii) kí hiệu: dấu hiệu xuất hiện ngẫu nhiên Rogers, năm 1989, xác định biểu tượng theo những định nghĩa về (i) sự giống nhau; (ii) có tính kí hiệu; (iii) có tính thí dụ đại diện; (iv) xuất hiện ngẫu nhiên; (v) có tính tương tự Như vậy biểu tượng xuất hiện theo nhiều cách: cho các đối tượng như các tư liệu; các thuộc tính của đối tượng như màu sắc, mẫu; các trạng thái hệ thống như bận hay sẵn sàng; các dạng thông báo

2 Tác động và tính sử dụng của biểu tượng Một biểu tượng đơn thuần trên màn hình cũng

không mấy tác động nếu không được thiết kế để thể hiện mối quan hệ có ý nghĩa và tự nhiên giữa biểu tượng này với những thứ nó đại diện Vậy thiết kế biểu tượng phù hợp là quan trọng, cho phép người dùng chấp nhận, dễ học Người ta đề ra vài nguyên tắc liên quan đến thiết kế biểu tượng (i) để biểu tượng là quen thuộc, đơn giản và sáng sủa, bền vững, dễ phân biệt; (ii) quan tâm đến ngữ cảnh sử dụng biểu tượng, ý muốn người dùng và

độ phức tạp của công việc

3 Lựa chọn biểu tượng Các biểu tượng dễ nhận ra và có ý nghĩa làm người dùng học và nhớ

nhanh, đạt hiệu quả cao hơn Thiết kế không tốt dễ dẫn đến sai sót, trễ và lẫn lộn cho người

PTIT

36

dùng Chính vì vậy mà cần có vài hướng dẫn về thông số kĩ thuật cho các biểu tượng Một biểu tượng thành công hội tụ đủ (i) phân biệt với biểu tượng khác; (ii) thể hiện rõ cái cần đại diện; (iii) cho phép nhận ra khi không lớn hơn 16 pixel vuông; (iv) dễ nhìn, dù có màu hay không Năm 1995, Fowler và Stanwick đưa ra các hướng dẫn này, với những giải thích

về kĩ thuật (i) về kích thước: nên sử dụng ba kích thước chuẩn 16, 32 hay 48 pixel vuông;

tổ hợp hữu hiệu đối với một hình ảnh là 24x24 hay 26x26 trong biểu tượng 32 pixel vuông; (ii) về màu sắc: hãng Microsoft đề nghị khi dùng hệ thống 256 màu với biểu tượng nhỏ hơn

48 pixel vuông; nên sử dụng màu trong bảng màu chuẩn để biểu tượng có màu chuẩn; (iii)

sử dụng số chẵn các pixel đối với mỗi cạnh của biểu tượng, để đơn giản đối với thiết kế và

dễ nhìn; (iv) vùng lựa chọn biểu tượng: để dễ chọn biểu tượng, người ta xác định 15 pixel vuông đối với bút chọn, 20 pixel vuông đối với chuột, 40 pixel vuông đối với ngón tay; (v) vùng nóng của biểu tượng, tức miền cho phép lựa chọn biểu tượng, nên lớn nhất có thể

Hình 1.20 Các hình quen thuộc và cụ thể

4 Chọn hình ảnh cho biểu tượng Một số khuyến cáo liên quan (i) do hệ thống đã thiết kế

trước một số biểu tượng chuẩn, do vậy người thiết kế nên chọn các biểu tượng đã có sẵn; tổ chức chuẩn ISO cũng đã đưa các hình dạng chuẩn cho mục đích thiết kế; (ii) từ ngữ đi kèm biểu tượng nên là danh từ, chứ không nên là động từ; (iii) nên chọn biểu tượng với ý nghĩa quen thuộc, truyền thống, để người dùng dễ nhận ra; (iv) hình ảnh trong biểu tượng cần đáp ứng yêu cầu về thẩm mĩ, văn hóa và dân tộc PTIT

Hình 1.21 Các hình phân biệt về khái niệm

5 Tạo các hình ảnh cho biểu tượng Người ta (i) tạo biểu tượng với các hình quen thuộc và

cụ thể; (ii) tạo hình phân biệt về khái niệm và hình họa; vậy nên hình dạng phải tương xứng với ý nghĩa; không nên thể hiện trong hình đóng khung; (iii) phản ánh rõ các đối tượng cần thể hiện; (iv) phản ánh đơn giản các đối tượng thể hiện, tránh đi vào chi tiết; (v) tạo tập các biểu tượng, liên quan với nhau thông qua hình dạng chung; (vi) đảm bảo tính bền vững đối với dạng biểu tượng, theo góc cạnh, kích thước, hình dạng, tức mỗi loại ứng với một ý nghĩa riêng; (vii) tạo mỗi hình dạng ứng với mức tình cảm riêng

Hình 1.22 Khung viền làm hạn chế phân biệt giữa các biểu tượng

Hình 1.23 Tránh thể hiện chi tiết trên biểu tượng

6 Vẽ hình cho biểu tượng Khi vẽ các hình làm biểu tượng, người ta cần tuân theo nguyên tắc

hướng dẫn (i) đảm bảo bền vững về hình đối với các kích thước khác nhau; (ii) không nên

sử dụng mũi tên, góc tam giác trong thiết kế, để tránh lầm lẫn với các kí hiệu khác trong hệ thống; (iii) khi các biểu tượng phản ánh sự thay đổi của thuộc tính, nên diễn tả các thuộc tính theo cách có ý nghĩa; (iv) đảm bảo phù hợp về hướng và tỉ lệ; (v) nên tận dụng khả năng thể hiện chiều không gian; (vi) gắn biểu tượng với nhãn văn bản để nhấn mạnh ý nghĩa của biểu tượng

PTIT

38

Hình 1.24 Mối quan hệ truyền thông giữa các biểu tượng

Hình 1.25 Diễn tả các thuộc tính trong thiết kế biểu tượng

7 Hình động và âm thanh trong biểu tượng Hình trên biểu tượng có thể (i) tĩnh; hay (ii)

động Khái niệm biểu tượng tĩnh ứng với hình tĩnh; khái niệm biểu tượng động1

ứng với hình động trên biểu tượng Hình động là xâu các hình tĩnh nên đòi hỏi hạ tầng kĩ thuật để thể hiện Nó gây sự chú ý của người dùng hơn là hình tĩnh, nên có ưu điểm đối với người dùng sử dụng biểu tượng này, là nhược điểm phân tán chú ý người dùng không sử dụng biểu tượng này Âm thanh có tác động báo hiệu, gắn với sự kiện của hệ thống Biểu tượng với âm thanh là phù hợp để đảm bảo thông tin (i) về tương tác được phép hay tương tác trước đó; (ii) cho biết đang thực hiện quá trình; (iii) hữu dụng đối với quá trình dò tìm; (iv) trợ giúp công tác

8 Thể hiện biểu tượng trên màn hình Việc thể hiện các biểu tượng trên màn hình cần tuân

theo thiết kế riêng của màn hình này Người ta đưa ra vài hướng dẫn (i) nên hạn chế số các

kí hiệu trên màn hình là 12, tối đa là 20; (ii) sắp xếp các biểu tượng theo cách có nghĩa, thể hiện theo tổ chức của thế giới thực, tiện cho việc quan sát; (iii) đặt các biểu tượng đại diện cho đối tượng tách biệt với các biểu tượng hành động; (iv) thể hiện biểu tượng tương tác như tác nhân mở ra màn hình khác; (v) đảm bảo biểu tượng được chọn là phân biệt với những biểu tượng không được chọn; (vi) cho phép người dùng sắp xếp lại các biểu tượng trên màn hình; (vii) cho phép người dùng lựa chọn biểu tượng, với hình ảnh biểu tượng và nhãn biểu tượng tùy chọn

1

Micon

PTIT

1.4.3.4 Sử dụng đa phương tiện trong giao diện tương tác

Chương đầu đã giới thiệu sơ lược về đa phương tiện Đa phương tiện và đa hình thái tham gia nhiều trong tương tác người-máy Giao diện GUI là thí dụ về giao diện đa phương tiện Việc tương tác trong giao diện thể hiện nhiều qua giao diện xử lí trực tiếp và trong hệ thống hiện thực ảo Nhu cầu về tương tác người-máy luôn đặt ra trong hệ thống thông tin Vấn đề chính

về tương tác người-máy không là quan hệ giữa con người với máy tính mà là con người với con người Con người có vai trò quan trọng trong hệ thống thông tin

Các loại phương tiện chính như (i) văn bản; (ii) hình ảnh; (iii) âm thanh; và (iv) hình động

có thể kết hợp để tạo nên giao diện tích hợp Tuy nhiên việc này đòi hỏi nhiều công cụ kĩ thuật và

hạ tầng công nghệ thông tin và truyền thông tốt

1.4.3.5 Sử dụng đồ họa trong giao diện tương tác

Người ta sử dụng đồ họa để bổ sung nội dung văn bản, nhưng không thay thế văn bản, hay chuyển tải thông tin mà văn bản có hạn chế, hay tăng cường dò tìm trong thể hiện tổng quan, xác định các trang Web, định ra vùng thông tin Tuy nhiên việc sử dụng đồ họa khiến tiêu tốn tài nguyên về thời gian hay khả năng lưu trữ

Đối với trang Web, đồ họa có vài mục đích rõ ràng, về (i) dò tìm thông tin; (ii) thể hiện, minh họa; (iii) tổ chức, cho biết mối quan hệ giữa các chi tiết trong văn bản; (iv) giải thích, cho biết cách quá trình tiến hành; (v) trang trí, với ý nhấn mạnh

1.4.3.6 Hình ảnh trong giao diện tương tác

Với hình ảnh, người ta có thể chuyển tải thông tin định hướng Nói chung, hình ảnh được

sử dụng để mô phỏng đối tượng thực, mô tả văn bản, phân biệt các hình ảnh dò tìm với ảnh trang trí Kích thước hình ảnh trong giao diện tương tác nên giảm thiểu: ảnh đơ nên chỉ 5 KB, hình ảnh trên trang nên chỉ 20 KB Liên quan đến hình ảnh là (i) màu sắc; (ii) các chuẩn nén

Liên quan đến thể hiện hình ảnh trong giao diện đa phương tiện, người ta xét một số dạng thể hiện:

 Dạng GIF1: (i) do CompuServe phát triển, với đích là trao đổi hình ảnh, độc lập với hạ tầng; (ii) thành phần chính: đầu file, ứng dụng, dữ liệu, đuôi; (iii) kĩ thuật nén theo thuật toán Lempel Ziv, xác định các bit lặp lại;

 Dạng TIFF1

: (i) do hãng Aldus và Microsoft phát triển; (ii) chức năng: trợ giúp trao đổi ảnh độc lập với nền, sử dụng rộng cho máy quét và máy Fax, được chia ra thành

1

Graphics Interchange Format

PTIT

40

phần cơ bản và thành phần mở rộng; (iii) mô hình màu và kĩ thuật nén ảnh: có mô hình đa dạng, dùng ảnh nhị phân, mức xám, sử dụng thuật toán nén Lempel Ziv, JPEG;

 Dạng véc tơ: (i) các dạng CGM, WMF, PS; (ii) chức năng có cấu trúc từ thấp đến cao, dựa trên đồ họa 2D, cho phép chỉnh sửa; (iii) với tín hiệu tương tự, sử dụng giao diện MIDI với file âm thanh WAV; (iv) về MIDI: thực hiện bắt đầu/ kết thúc, cho phép chỉnh lí mức độ, có giao diện thuận tiện

Việc xử lí ảnh do phần mềm thực hiện sẽ đưa đối tượng ảnh sang dạng số hóa, sẵn sàng vào quá trình đa phương tiện Việc xử lí ảnh nhằm tích hợp các ảnh với các dữ liệu đa phương tiện khác tốt nhất Người dùng yêu cầu thực hiện công việc xử lí ảnh, nhờ các phần mềm sẵn có Một

số phần mềm vẽ cũng cho phép đưa ra ảnh bitmap và véc tơ, tiện cho ứng dụng

1.4.3.7 Ảnh chụp và hình ảnh trong giao diện tương tác

Một ảnh chụp cho phép thấy khía cạnh hiển hiện, thấy thông tin mà văn bản không thể hiện được Straube, 2003, đề nghị lưu ý một số điểm đối với ảnh chụp con người: (i) ảnh về con người tạo nên giao tác ảo thân thiện hơn, sống động hơn; (ii) ảnh chụp không có giá trị chức năng có thể làm giảm nhận thức đối với người dùng có kinh nghiệm, do làm nhiễu công việc

Chỉ dẫn thiết kế giao diện tương tác ở đây là (i) nên sử dụng dạng nén JPEG; (ii) do hiển thị ảnh chụp tốn thời gian, nên chia ra giai đoạn hiển thị biểu tượng, rồi hiển thị toàn bộ; (iii) bố trí không nhiều đối tượng trên ảnh, để nhấn mạnh chủ đề và có nền ảnh thông thoáng

1.4.3.8 Video trong giao diện tương tác

Máy quay video cho phép tạo đoạn video Người ta chia băng video thành (i) băng video được xem là video clip; (ii) mỗi video clip có nhiều cảnh; (iii) mỗi cảnh có nhiều lia2; (iv) mỗi lia

có nhiều khung hình3 Trong các khung, có thể định ra khung chính

Video đặc biệt phù hợp với thể hiện đối tượng chuyển động, hay thể hiện sự kiện mà không

dễ xem trực tiếp, như sự kiện thế giới hay sự kiện lịch sử

Nhược điểm của giao diện sử dụng video là tốn thời gian hiện thông tin Kích thước của đoạn video luôn là vấn đề đối với việc lưu trữ và xử lí

Người ta khuyến cáo (i) không nên tự động tải các đoạn video từ trang Web; (ii) nên tạo các đoạn video ngắn; (iii) sử dụng lại các đoạn video đã có; (iv) có thể thay video bằng các hình tĩnh kèm theo âm thanh