(Luận văn thạc sĩ) ứng dụng các yếu tố con người vào trong tổ chức HCI

ĐẠI HỌC QUỐC GIA HÀ NỘI ĐẠI HỌC CÔNG NGHỆ Lê Trung Hiếu ỨNG DỤNG YẾU TỐ CON NGƯỜI VÀO TRONG TỔ CHỨC HCI LUẬN VĂN THẠC SĨ Hà Nội – 2009 i MỤC LỤC MỤC LỤC i Danh mục kí hiệu viết tắt iii Danh mục hình bảng v MỞ ĐẦU Chƣơng I VAI TRÒ CỦA CON NGƢỜI TRONG HỆ THỐNG TƢƠNG TÁC 1 Nhận thức ngƣời đa dạng nhận thức 1 Nhận thức ngƣời 1 Sự đa dạng nhận thức ngƣời 10 Vai trò ngơn ngữ hình ảnh q trình hình thành nhận thức 12 Các yếu tố hình ảnh tác động lên não ngƣời 12 2 Mối quan hệ hình ảnh ngôn ngữ 19 Đặc điểm hình ảnh ba chiều 28 Hoạt động ngƣời trình hình thành nhận thức 29 Sự suy nghĩ ngƣời 31 Tƣơng tác ngƣời ngƣời 42 Cách tiếp cận HCI vấn đề ngƣời 50 Kết luận 57 Chƣơng II TƢƠNG TÁC NGƢỜI MÁY 59 Lựa chọn thực đơn, mẫu điền, hội thoại 60 1 Giới thiệu 60 2 Các kiểu thực đơn 61 Trình diễn thƣ mục theo chuỗi 69 Thời gian phản hồi tốc độ hiển thị 71 Sự di chuyển nhanh thực đơn 71 Bố cục thực đơn 73 Các mẫu điền có sẵn 76 Kết luận 81 2 Sử dụng câu lệnh 81 2 Giới thiệu 81 2 Chức hỗ trợ nhiệm vụ ngƣời dùng 83 2 Lợi ích cấu trúc 86 2 Tên viết tắt 88 2 Thực đơn câu lệnh 89 2 Ngôn ngữ tự nhiên máy tính 89 2 Kết luận 92 Tƣơng tác với thiết bị 92 Giới thiệu 92 Bàn phím phím chức 93 3 Các thiết bị trỏ 97 Nhận dạng giọng nói số hóa .102 Hình ảnh hiển thị đoạn phim 107 Máy in 108 Kết luận 109 Chƣơng III CÁC LỖI TRONG HCI VÀ THIẾT KẾ MỘT TRANG WEB CỤ THỂ .111 ii Các lỗi HCI 111 1 Lỗi phím điều khiển 111 Lỗi hộp thoại 123 3 Các lỗi khác 132 Thiết kế giao diện cụ thể 144 Cách thiết kế cho trang chủ 145 2 Cách thiết kế cho trang địa khó khăn 147 3 Cách thiết kế cho trang đóng góp 151 Cách thiết kế cho trang lòng nhân 153 Cách thiết kế trang tìm kiếm 153 Cách thiết kế trang diễn đàn 154 Cách thiết kế trang liên hệ 157 3 Kết luận 157 KẾT LUẬN .159 TÀI LIỆU THAM KHẢO 161 iii Danh mục kí hiệu viết tắt Tên Tiếng Anh Tên Tiếng Việt Algol Tên ngơn ngữ lập trình Alzhemeir Bệnh đãng trí (thƣờng xuất tuổi cao) Camera Thiết bị để ghi hình Colbol Tên ngơn ngữ lập trình Cone Là phận thu nhận quan thị giác võng mạc đƣợc kích hoạt ánh sáng mạnh mầu sắc DNA Acid deoxyribonucleic (viết tắt DNA) phân tử acid nucleic mang thông tin di truyền Edit Chỉnh sửa hay thay Font Phông Fortran Ngơn ngữ lập trình FORMULA TRANSLATOR Ftp Giao thức truyển tải liệu HCI Human Computer Interaction – Tƣơng tác ngƣời máy Help Trợ giúp Html Ngôn ngữ đánh dấu siêu văn Http Giao thức truyền siêu văn Hypothalamus Vùng não điều khiển thân nhiệt, đói, khát Icon Biểu tƣợng Logic Đảm bảo tính có hệ thống NLI Giao diện ngôn ngữ tự nhiên NLQ Ngôn ngữ truy vấn tự nhiên Nơron Là phận hệ thống thần kinh Rod Là phận thu nhận quan thị giác đƣợc kích hoạt bới ánh sáng yếu Scrollbar Cuộn ngang Scrolling Cuộn dọc iv Video Thiết bị để ghi hình View Hiển thị Web Là hệ thống mạng phức tạp đƣợc đan xen vào với Window Cửa sổ World Wide Web Mạng lƣới tồn cầu v Danh mục hình bảng Hình 1 Liệu âm ngơn ngữ có giúp q trình nhận thức so với thị giác không Hình 1 Cấu tạo mắt ngƣời Hình 1 Khơng có não liệu thị giác hiểu đƣợc hình ảnh Hình 1 Nhiều giả thuyết đƣợc nêu lên hình Hình 1 Hình ảnh giúp cho loài vật tăng cƣờng khả nhận thức Hình 1 Hiểu biết thông qua trạng thái suy nghĩ khác Hình 1 Lồi vật có cần biết quy luật để sinh tồn 10 Hình 1 Hình ảnh thu nhận phụ thuộc nhiều vào nhận thức ngƣời 12 Hình Mắt ngƣời cần có yếu tố đặc biệt để xử lý thông tin 13 Hình 2 Những hình ảnh đƣợc thu 14 Hình Quá trình tổng hợp diễn hình ảnh đơn sơ 15 Hình Tác dụng mầu sắc 15 Hình Bố cục độ sâu giúp ngƣời xử lý dễ dàng 16 Hình Hoạt động bán cầu não phải 20 Hình Hoạt động bán cầu não trái 20 Hình Bộ não xử lý hết thông tin thời gian ngắn 25 Hình Tác dụng chữ viết 26 Hinh Hình âm dƣơng qua thời kỳ đƣợc hiểu theo nhiều cách khác 31 Hình Não 32 Hình Tế bào thần kinh 32 Hình Tế bào đệm 33 Hình 4 Bán cầu não trái 33 Hình Cấu tạo não 33 Hình Tiểu não 34 Hình Các loại nhớ 35 Hình Giới hạn não ngƣời 36 Hình Sự thuận tiện trình xử lý thông tin 37 Hình 10 Cách thức tổ chức liệu 38 Hình 11 Hoạt động trao đổi thông tin não 39 Hình 12 Dữ liệu bên ngồi chiếm ƣu thế, nỗi sợ hãi che lấn tất 40 Hình 13 Mơi trƣờng bên ngồi khơng ảnh hƣởng tới ngƣời 40 Hình 14 Nhận thức ngƣời bị đảo lộn 41 Hình Các yếu tố ảnh hƣởng đến ngƣời 46 Hình L S Vygotsky, nhà xã hội học Liên xô cũ 50 Hình Immanuel Kant, nhà triết học Đức 50 Hình C Marx, nhà triết học, tƣ tƣởng 51 Hình Sơ đồ lý thuyết hoạt động 52 Hình Mối liên hệ ngành 56 Hình 1 Giao diện Pulldown 60 Hình 2 Mỗi thực đơn có nhiều lựa chọn cho ngƣời sử dụng 63 Hình Nhiêu lựa chọn lựa chọn đƣợc lúc 63 Hình Thực đơn dạng pop up 64 Hình Một dạng thực đơn hai chiều 65 Hình Một dạng thực đơn tìm kiếm theo thứ tự 65 vi Hình Các đƣờng dẫn (mầu xanh) đƣợc gắn đoạn văn 66 Hình Nhiều thực đơn đƣợc đặt giao diện 67 Hình Một thực đơn đồ World Wide Web 68 Hình 10 Một mẫu bảng điền 76 Hình 11 Một mẫu kết hợp danh sách hộp combo 78 Hình 12 Một dạng hộp hội thoại 79 Hình Bàn phím Microsoft với đầy đủ tính 94 Hình Máy vi tính bỏ túi với bàn phím đƣợc thu gọn 94 Hình 3 Bàn phím đƣợc thiết kế lõm 95 Hình Bàn phím điều khiển trỏ dạng chữ T ngƣợc 97 Hình Bàn phím điều khiển trỏ theo dạng hình 97 Hình Bút điện tử 99 Hình Màn hình tiếp xúc 99 Hình Chuột nút bấm chuột hai nút bấm 100 Hình Joystick giúp cho ngƣời sƣ dụng di chuyển chuột dễ dàng 101 Hình 1 Lỗi phím mũi tên 111 Hình Lỗi chƣơng trình xếp 112 Hình 3 Lỗi chƣơng trình Visual Studio 112 Hình Sự giới hạn lựa chọn 112 Hình Lỗi thông báo thời gian tải cho ngƣời dùng 113 Hình Dùng công cụ để hiển thị thực đơn 113 Hình Lỗi chọn giá trị .113 Hình Lỗi q trình tích lựa chọn .114 Hình Lỗi khơng hiển thị đƣờng dẫn .114 Hình 10 Khơng có hƣớng dẫn kiểu trƣờng .115 Hình 11 Lỗi thực đơn 115 Hình 12 Lỗi thứ tự trƣờng .115 Hình 13 Lỗi khơng quán phần mềm 116 Hình 14 Các trợ giúp không cần thiết 116 Hình 15 Lỗi cách xác định đƣờng dẫn .117 Hình 16 Lỗi sử dụng trƣợt ngang 118 Hình 17 Lỗi hiển thị 118 Hình 18 Lỗi thể danh sách 118 Hình 19 Lỗi xuất nhiều nút 119 Hình 20 Xuất hỗ trợ lâu 119 Hình 21 Tổ chức không theo cấu trúc .120 Hình 22 Lỗi nhập số lƣợng nhiều 120 Hình 23 Lỗi lãng phí nhớ .120 Hình 24 Lỗi chƣơng trình duyệt Web 121 Hình 25 Lỗi khơng xuất phím điều khiển 121 Hình 26 Lỗi lựa chọn dựa vào chuột .122 Hình 27 Lỗi lựa chọn dựa vào chuột 122 Hình 28 Lỗi lựa chọn dựa vào chuột 122 Hình 29 Lỗi thao tác với thực đơn 123 Hình 30 Lỗi chƣơng trình lịch 123 Hình 31 Thiết kế thiếu định hƣớng .123 Hình 32 Lỗi chƣơng trình Microsoft Word 124 Hình 33 Lỗi thể Font 124 vii Hình 34 Lỗi khơng quán lỗi chọn lựa 125 Hình 35 Lỗi số lƣợng nhiều hộp thoại 125 Hình 36 Lỗi số lƣợng nhiều hộp thoại 125 Hình 37 Lỗi số lƣợng nhiều hộp thoại 126 Hình 38 Lỗi số lƣợng mầu sắc nhiều 126 Hình 39 Một giao diện đƣợc thiết kế tốt 126 Hình 40 Lỗi thiết kế ẩn hộp thoại 126 Hình 41 Lỗi khơng hiển thị đầy đủ thông tin 127 Hình 42 Lỗi khơng rành mạch chức .127 Hình 43 Lỗi khơng rành mạch chức .128 Hình 44 Lỗi chức 128 Hình 45 Lỗi sách địa IBM 129 Hình 46 Lỗi hộp thoại Sounds Properties .129 Hình 47 Lỗi khơng hỗ trợ ngƣời dùng 130 Hình 48 Lỗi đặt tên hộp thoại .130 Hình 49 Lỗi đặt tên hộp thoại .130 Hình 50 Lỗi cách thiết kế chức 131 Hình 51 Lỗi ngăn cản ngƣời sử dụng 132 Hình 52 Lỗi gán nhãn .132 Hình 53 Lỗi phím Start 132 Hình 54 Thơng báo mang tính khó hiểu 133 Hình 55 Thơng báo mang tính khó hiểu 133 Hình 56 Lỗi chƣơng trình xử lý ảnh .134 Hình 57 Sự khơng qn chƣơng trình phần mềm 134 Hình 58 Chuột có nút bấm .134 Hình 59 Nút điều khiển chuột 135 Hình 60 Che chức điều khiển 135 Hình 61 Lỗi thiết kế trƣợt 136 Hình 62 Một số trƣợt đƣợc thiết kế tốt 137 Hình 63 Bố trí mầu sắc khơng hợp lý .138 Hình 64 Lỗi mầu sắc đƣờng dẫn 139 Hình 65 Lỗi cách bố trí chƣơng .140 Hình 66 Lỗi đƣợc khắc phục 140 Hình 67 Lỗi thiết kế thực đơn 141 Hình 68 Lỗi đƣợc khắc phục 141 Hình 69 Sự khơng quán bố cục 142 Hình 70 Thật khó để phân biệt hình ảnh 144 Hình Giao diện trang chủ 146 Hình 2 Thanh cơng cụ tìm kiếm mạng .147 Hình 3 Giao diện thực đơn địa khó khăn .148 Hình Giao diện trang địa khó khăn 148 Hình Giao diện hình ảnh đƣợc xem 149 Hình Nội dung chữ trang địa khó khăn 150 Hình Giao diện trang đóng góp 151 Hình Giao diện trƣờng chọn tỉnh, thành phố 152 Hình Giao diện trƣờng quyên góp 153 Hình 10 Giao diện thực đơn trang lòng nhân 153 Hình 11 Giao diện trƣờng từ khóa trang tìm kiếm 153 viii Hình 12 Giao diện thực đơn cho trang diễn đàn 154 Hình 13 Giao diện trang đăng ký thành viên 155 Hình 14 Giao diện trang thảo luận 156 Hình 15 Nội dung trang thảo luận .156 Hình 16 Bình luận ngƣời dùng 157 Hình 17 Giao diện trang liên hệ .157 MỞ ĐẦU Công nghệ thông tin lĩnh vực hấp dẫn nhiều ngƣời trình học tập nghiên cứu nhằm phát điều thú vị lĩnh vực Tuy nhiên hấp dẫn lại có nhiều thách thức chờ đợi nhiêu Kiến thức khoa học vô tận ngƣời không nắm bắt đƣợc hết Cứ qua thời kỳ kiến thức khoa học lại tăng theo cấp số nhân Công nghệ thông tin ngoại lệ Dù phát triển năm gần nhiên yêu cầu thực tế gần ln địi hỏi kiến thức ngành khác cần phải đƣợc liên kết lại để giải đáp yêu cầu ngƣời Công nghệ thông tin ngày phải liên kết với ngành khoa học khác để phát huy hết đƣợc vai trị cho ứng dụng thực tiễn sống với ngƣời trung tâm phục vụ Tƣơng tác ngƣời máy môn nhƣ đòi hỏi phải kết hợp với ngành khác để tự hồn thiện mình, trƣớc hết ngành tâm lý nhận thức thần kinh để hiểu rõ hoạt động ngƣơi, sau ngành kĩ thuật để thực hóa ý tƣởng đó, ngồi cần có số ngành khác nhƣ tơn giáo, triết học, tâm lý đám đơng, văn hóa, kinh tế, trị, luật pháp để giải mã hành động ngƣời theo cấp độ tập thể Khoa học cơng nghệ nói chung cơng nghệ thơng tin bƣớc vào giai đoạn nhanh chóng mạnh mẽ Sức mạnh khoa học kỹ thuật điều đƣợc giới thừa nhận, từ lâu tiềm thức ngƣời hình thành nên suy nghĩ: kĩ thuật sức mạnh ngƣời Bắt đầu từ kỷ 18 số nƣớc văn minh Châu Âu sau lan sang nƣớc khác giới, khoa học kĩ thuật có nhiều đóng góp to lớn vào phát triển tồn loài ngƣời, từ chỗ phụ thuộc hoàn toàn vào tự nhiên đến chỗ ngƣời, chƣa thể làm chủ hoàn toàn nhƣng ngƣời tự đáp ứng đƣợc nhu cầu tồn phát triển Những thành tựu mà khoa học kĩ thuật đem lại vòng kỷ qua lớn tất mà lồi ngƣời trƣớc làm đƣợc Mặc dù kỷ qua dân số loài ngƣời tăng lên nhanh nhƣng đại phận loài ngƣời có sống chất lƣợng cao nhiều so với trƣớc đó, từ việc đảm bảo nhu cầu thực phẩm, quần áo, điện nƣớc sinh hoạt tất dồi phong phú, đảm bảo cho loài ngƣời tiếp tục tồn phát triển Trong đóng góp to lớn khoa học kĩ thuật cơng nghệ thơng tin đóng vai trò quan trọng Mặc dù sinh sau đẻ muộn nhƣng cơng nghệ thơng tin có đóng góp to lớn, làm thay đổi lớn sống loài ngƣời từ phƣơng thức hoạt động sản xuất tƣ cấu trúc tổ chức xã hội theo hƣớng tích cực Thông qua công nghệ thông tin ngƣời tăng suất lao động nhờ rút ngắn thời gian hồn thành cơng việc tăng tính hiệu làm việc Lồi ngƣời tiếp tục tồn phát triển, không đƣợc mãi, khoa học kĩ thuật nói chung nhƣ cơng nghệ thơng tin nói riêng công cụ vô hữu hiệu để ngƣời thực đƣợc điều Và mong chờ nhiều điều tốt đẹp mà khoa học kĩ thuật mang lại cho loài ngƣời 148 đâu thực đơn Ví dụ dƣới minh họa cho thấy nhƣ ngƣời dùng muốn tìm kiếm địa khó khăn Lạng Sơn Hình 3 Giao diện thực đơn địa khó khăn Cách tổ chức trang gần giống tƣơng tự với cách thức tổ chức mà mầu sắc, bố cục quán cách thức chủ đạo để thiết kế đƣợc giao diện tốt Tuy nhiên mục đích phần có khác so với trƣớc nên cách thức tổ chức có khác Trong phần nhằm mục đích kêu gọi lòng hảo tâm, phải làm bật lên khó khăn Khơng có diễn tả tốt hình ảnh to rõ ràng trƣờng hợp bất hạnh Những cảnh thƣơng tâm nhƣ có thuyết phục đáng kể việc động viên ngƣời giúp đỡ hồn cảnh khó khăn Các đƣờng dẫn đƣợc tơ mầu xanh có tác dụng đáng kể việc giúp ngƣời dùng dễ nhận vị trí để tiếp tục đọc đƣợc trọn vẹn Nội dung trang đƣợc bố trí theo cách hình ảnh đại diện nằm bên phải Phía bên dƣới ảnh có nút Album để ngƣời dùng xem xét tồn tập ảnh hồn cảnh bất hạnh Bên dƣới dịng chữ có đƣờng dẫn để ngƣời dùng xem tồn nội dung viết Hai đƣờng dẫn đƣợc thiết kế vị trí rõ ràng để ngƣời dùng nhìn thấy dễ dàng Hình dƣới giao diện địa khó khăn Hình Giao diện trang địa khó khăn 149 Trong phần có tập ảnh để ngƣời sử dụng hiển thị tồn ảnh Một tập ảnh đƣợc bố trí phía bên trái Các hình ảnh tƣơng đồng đƣợc hiển thị bên phải.đƣợc phóng to Cách bố trí nhƣ giúp cho ngƣời sử dụng có đƣợc nhìn tồn cảnh tất hình ảnh có Album bỏ qua số hình ảnh khơng cần thiết Hình Giao diện hình ảnh đƣợc xem Tiếp theo xem nội dung trang địa khó khăn Cách bố trí trang địa khó khăn phải đảm bảo tính sang sủa dễ đọc để ngƣời dùng đọc dễ dàng đọc đƣợc Các vấn đề liên quan tỉ lệ phơng chữ cách bố cục khoảng không chữ Tỷ lệ font chữ tiết kiệm đƣợc không gian dễ đọc so với font chữ có tỷ lệ cố định Kích cỡ font vấn đề cần phải xem xét Thơng thƣờng 10 pt đọc đƣợc, 11 pt 12 pt đọc đƣợc tốt Sự khác biệt font size phải pt, nhỏ mắt thƣờng khơng thể phân biệt đƣợc Sau xem xét số ví dụ cụ thể sau: a 12 pt dành cho đoạn văn hội thoại 150 b 10 pt dành cho ký hiệu c 14 pt dành cho đoạn tiêu đề d 16 pt hay lớn dành cho mục lục hay tiêu đề lớn Chữ viết hoa viết thƣờng: sử dụng chữ viết hoa viết thƣờng có tác dụng tốt so với dùng riêng chữ hoa Một vấn đề việc nhận dạng chữ viết thƣờng dựa nhiều vào hình dáng chúng Các chữ viết thƣờng khơng có hình dáng cố định nhƣ chế độ viết hoa, việc nhận biết chữ thƣờng thƣờng dễ dàng Ví dụ nhƣ sau SHAPE khó đọc so với shape  Ký tự, chữ khoảng cách dòng: Khoảng cách ký tự phụ thuộc lớn vào font, thông thƣờng phơng khác có khoảng cách khác Khoảng cách chữ xấp xỉ với độ rộng chữ n Sau thấy có số cách viết mà khoảng cách khác Word spacing : khoảng cách hẹp Word spacing : khoảng cách chữ n Word spacing : khoảng cách chữ m Khoảng cách dòng quan trọng Q nhiều khơng gian dịng cách xa tạo cảm giác khơng có gắn kết Q khơng gian dịng làm cho đoạn text trở nên khó đọc cách thoải mái Ngày phần mềm soạn thảo văn có chế độ cho phép thiết lập khoảng cách cho dòng cho phù hợp Khoảng cách dòng ngắn hay dài khó khăn cho ngƣời đọc Hình Nội dung chữ trang địa khó khăn 151  Độ dài dịng: Thơng thƣờng ngƣời ta quy định 10 chữ (60 ký tự) cho dòng sách, chữ (30 chữ) cho dòng tờ báo Nếu nhƣ dòng dài, ngƣời đọc khó khăn việc tìm kiếm đâu bắt đầu cho đoạn dịng Ngồi nên sử dụng bảng liệu để giúp cho việc định dạng xác định vị trí đƣợc dễ dàng nhờ có việc đảm bảo tính quán Hơn việc lề trái lề phải giúp cho việc đọc đoạn văn trở nên dễ dàng thuận tiện  Cách thể phơng chữ: Đây kiểu dáng giao diện phông chữ Thông thƣờng cỡ phông chữ đƣợc thể thông qua printers‟ point (pt) pt = / 72 inch = 35 mm pica = 1/6 inch = mm Tiếp theo kiểu chữ có móc kiểu chữ khơng có móc chữ có móc kiểu trang trí tơ điểm vào đằng cuối nét chữ Ví dụ nhƣ T, kiểu chữ hai phông Times New Roman Georgia , chữ khơng có móc khơng có đƣờng nét trang trí vào đằng cuối nét chữ Ví dụ nhƣ T, phơng chữ nhƣ Arial, Helvetical Verdana phông thuộc kiểu Thông thƣờng đọc đoạn viết giấy chữ có móc dễ đọc chữ khơng có móc nhiên điều chƣa đƣợc kiểm chứng cách rõ ràng 3 Cách thiết kế cho trang đóng góp Hình Giao diện trang đóng góp Đây trang mà nhà hảo tâm đăng ký theo mẫu điền sẵn để đăng ký tên mình, nhƣ thơng tin liên quan nhƣ năm sinh nhƣ địa điểm nơi hình thức đóng góp Trong phần nhập ngày tháng năm sinh vấn đề phức tạp 152 việc điền ngƣời dùng khơng hợp lệ nhƣ nhầm lẫn trình nhập nhƣ ngày 30/2 Do cách tiếp cận tạo nên bảng để ngƣời dùng chọn chuột Khi sang tức ngày tháng năm đƣợc chọn Nếu nhƣ trỏ chuột di đến đâu trang tƣơng ứng sang lên đồng thời phía ngày tháng tƣơng ứng đƣợc lên Dƣới giao diện phần nhập ngày tháng năm sinh Địa điểm ngƣời quyên góp phần gây nên nhầm lẫn, cách tổ chức để ngƣời dùng lựa chọn chuột Những nhà hảo tâm thƣờng hai thành phố lớn Hồ Chí Minh Hà Nội Do hai thành phố đƣợc xếp đầu để làm giảm thời gian tìm kiếm Tƣơng tự nhƣ vậy, hình thức đóng góp đƣợc tổ chức nhƣ để giúp ngƣời dùng tránh đƣợc sai sót Tiếp theo xem xét đến trƣờng nhập vào địa ngƣời sử dụng Do có không quán cách gọi tên vùng miền nên gây nên nhầm lẫn định ví dụ nhƣ Sài Gịn Thành phố Hồ Chí Minh Do cách thức tốt cung cấp hộp combo ngƣời dùng lựa chọn đƣợc địa điểm Cách thức bố trí thực đơn địa điểm có nhiều ngƣời đóng góp thƣờng xun đƣợc chọn đƣợc bố trí lên đầu Trong vùng miền cịn lại đƣợc xếp theo bảng chữ Với cách bố trí nhƣ Thành phố Hồ Chí Minh Hà Nội hai địa điểm đƣợc xếp vị trí đầu tiên, sau ĐBSCL Bắt đầu từ An Giang trở sau địa danh đƣợc xếp theo vần chữ Việc xếp theo vần giúp cho ngƣời sử dụng nhanh chóng dễ dàng chọn đƣợc địa điểm mà khơng nhiều thời gian Hơn trình chọn ƣớc lƣợng đƣợc vị trí cần phải chọn Hình Giao diện trƣờng chọn tỉnh, thành phố Tiếp theo xem xét đến trƣờng cuối Đó hình thức qun góp Ngƣời dùng cảm thấy bối rối mà khơng biết hình thức quyên góp nhƣ Thay 153 vào đƣa cho ngƣời dùng lựa chọn để ngƣời dùng có lựa chọn cho Khi lựa chọn đến đâu có vệt mầu xanh chạy đến để giúp cho ngƣời dùng xác định đƣợc hình thức lựa chọn Sau tất lựa chọn đƣợc hồn tất ngƣời dùng có chọn hai nút Đóng góp Huỷ để tiếp tục thực thao tác Hình Giao diện trƣờng quyên góp Cách thiết kế cho trang lòng nhân Trang nhằm mục đích cung cấp cho ngƣời dùng long nhân ái, việc tốt ngƣời tốt đời thƣờng Tuy nhiên có nhiều lĩnh vực cần thể nên cách tốt phân chia thành danh mục nhỏ đồng thời danh mục nhỏ lại phân chia thành danh mục nhỏ Hơn cách bố trí theo chức nhƣ giúp cho ngƣời tìm kiếm có đƣợc định dạng dễ dàng Sau xem xét giao diện thực đơn cho trang lịng nhân Hình 10 Giao diện thực đơn trang lòng nhân Ngƣời dùng lựa chọn mục thơng qua trỏ chuột di chuyển vệt sang Nội dung cách bố trí phần thực đơn tƣơng tự nhƣ phần khác Cách thiết kế trang tìm kiếm Mục đích trang tìm kiếm hình ảnh hay hoạt động trang Web Ngƣời dùng điền thơng tin theo u cầu để có đƣợc kết nhƣ mong muốn Yêu cầu tìm kiếm đƣợc cung cấp thêm hai phần nhỏ giúp cho ngƣời sử dụng đến gần với kết tìm kiếm Ngƣời dùng lựa chọn hai hình thức cách nháy chuột vào cần tìm Nếu nhƣ phần đƣợc chọn có chấm nhỏ lên bên cạnh phần đƣợc chọn Hình 11 Giao diện trƣờng từ khóa trang tìm kiếm 154 Sau cịn có hai trƣờng khác bao gồm trƣờng địa điểm ngày tháng cách thức thiết kế tuân theo nhƣ có trƣờng Cả hai trƣờng thiết kế theo hộp Combo để tránh đƣợc sai sót từ phía ngƣời dùng, đồng thời hỗ trợ trình tìm kiếm trƣờng đƣợc nhanh Trƣờng ngày tháng đƣợc thiết kế để cho ngƣời dùng cần sử dụng chuột để có đƣợc kết nhƣ mong muốn Trỏ chuột chạy đến đâu có đốm nhỏ chạy theo đến đó, đồng thời chọn kết bên Trƣờng trƣờng địa điểm địa điểm hay đƣợc sử dụng đƣợc xếp lên đầu tiên, địa điểm đƣợc xếp theo vần Cách làm nhƣ vừa rút ngắn thời gian tìm kiếm cho ngƣời dùng vừa tránh đƣợc sai sót có Cách thiết kế trang diễn đàn Đây trang có chức ngƣời sau xem qua trang Web đăng ký làm thành viên nơi thành viên cũ thảo luận trao đổi chia sẻ Thông thƣờng phần diễn đàn có nhiều thơng tin nhƣ mục khác Tuy nhiên thiết kế danh mục thực đơn dài nhƣ làm cho ngƣời dung bao quát đƣợc hết nội dung thực đơn thực đơn dài làm nội dung phần dƣới Theo cách bố cục cho trang chủ nhƣ thực đơn bao gồm khoảng mục, mục chung Con trỏ chuột di chuyển đến đâu có vệt sáng di chuyển đến Hình 12 Giao diện thực đơn cho trang diễn đàn Tiếp theo xem xét phần trang diễn đàn Trƣớc hết vào phần đăng ký mục diễn đàn Phần có chức giúp cho ngƣời sử dụng trang Web muốn đăng nhập để trở thành thành viên diễn đàn Do cách thiết kế thiết kế thành mẫu điền để ngƣời dung điền thơng tin Trong bao gồm có trƣờng sau họ tên, ngày tháng năm sinh, địa hộp thƣ Cuối phần khả năng, dạng thực đơn có nhiều lựa chọn lúc Ngƣời dùng vào khả chọn hay đồng thời vài lựa chọn lúc 155 Các trƣờng họ tên, địa hộp thƣ đoạn chữ nên ngƣời dung phải nhập từ bàn phím Trƣờng ngày tháng năm sinh đƣợc thiết kế nhƣ để đảm bảo tránh sai sót cho ngƣời dùng Đối với trƣờng mà yêu cầu ngƣời dung nhập từ bàn phím nhƣ ngƣời dùng khơng nhập hay nhập sai có dịng thông báo lỗi bên cạnh để nhắc nhở ngƣời sử dụng Nếu nhƣ khơng có thơng báo q trình nhập ngƣời dùng xác Dịng chữ thông báo đƣợc thiết kế mầu đỏ nằm bên cạnh trƣờng khơng có xác q trình nhập để ngƣời dung xác định nhanh chóng lỗi cần tìm q trình nhập Thơng báo lên nơi nhƣ trƣờng khơng thỏa mãn Nếu nhƣ có hai trƣờng khơng thoả mãn lên đồng thời hai thơng báo Hình 13 Giao diện trang đăng ký thành viên Tiếp theo phần thảo luận Nội dung trang thảo luận đƣợc bố trí thành mục tin, có hình ảnh nội dung viết Nếu nhƣ ngƣời dung muốn vào thảo luận vấn đề ấn vào đƣờng dẫn vào đƣờng dẫn xem thêm để lên tồn nội dung trang cần 156 Hình 14 Giao diện trang thảo luận Sau nhƣ ngƣời dung ấn vào đƣờng dẫn tồn thơng tin chi tiết đƣợc Cùng với nội dung viết tồn lời bình luận hay góp ý trang đƣợc phía dƣới Các lời bình luận đƣợc xếp theo thứ tự từ cũ đến để giúp cho ngƣời sử dụng theo dõi cách dễ dàng qn lời bình luận Ngồi phần nội dung trang có số phần có liên kết trang khác để tiện cho ngƣời sử dụng có thiết kế số đƣờng dẫn ngƣời dùng tiện khảo cần thiết Cách gắn đƣờng dẫn vào nội dung trang Web nhƣ đảm bảo tính đầy đủ dễ đọc cho ngƣời dung Hình 15 Nội dung trang thảo luận Cuối trang phần ngƣời dùng gửi bình luạn nhƣ phản hồi Cách thức nhƣ làm tăng tính tƣơng tác ngƣời dùng trang Web 157 Hình 16 Bình luận ngƣời dùng Cách thiết kế trang liên hệ Đây phần cuối diễn đàn với mục đích cung cấp cho ngƣời dùng thông tin cần thiết để liên hệ với ngƣời quản trị Do thông tin phải đƣợc trình bày cách ngắn gọn đọng cách để cung cấp cho ngƣời dùng nhiều thông tin khoảng thời gian ngắn Trong trang có thiết kế thành trƣờng khác để ngƣời dùng điền thơng tin cần thiết sau gửi Hình 17 Giao diện trang liên hệ 3 Kết luận Các lỗi HCI nói riêng nhƣ ngành khác nói riêng nói lên điều cịn nhiều vấn đề cách thức thiết kế Các lỗi thiết kế nhƣ tính khó hiểu, khơng rõ nghĩa hay nhầm lẫn xuất đâu lặp lại nhiều lần Hậu nhầm lẫn tùy thuộc vào trƣờng hợp từ đơn giản nhƣ mở tủ lạnh hay phím chức vấn đề nhƣ điều khiển máy bay 158 Thiết kế giao diện tốt phải bao gồm có nhiều vấn đề khác từ phông chữ, khoảng cách chữ dòng, biểu tƣợng ảnh hƣởng nhiều đến q trình tƣong tác Các thiết kế khơng đơn giản mặt kĩ thuật mà cịn có nhiều yếu tố khác Điều địi hỏi cần có nhiều nỗ lực để kết hợp yếu tố lại với 159 KẾT LUẬN Những kết đạt được: Cách thức xử lý thông tin não ngƣời ln ln vấn đề vơ khó khăn Để hiểu đƣợc chế hoạt động não, phải cần nhiều phối hợp liên ngành môn khoa học khác Giải đƣợc vấn đề thực không đơn giản nhiên kết đem lại giúp ích cho nhiều.Giác quan ngƣời ln ln đóng vài trò quan trọng nhận thức ngƣời, tất trình tƣơng tác với xã hội Giác quan ngƣời nhạy bén khả hấp thụ thơng tin lớn nhiêu tăng cƣờng khả nhận thức Trong q trình tìm tịi nghiên cứu, tơi hồn thiện luận văn với mục tiêu đặt ban đầu, cụ thể đạt đƣợc kết sau đây: - Giải thích chế xử lý thông tin não tăng cƣờng nhận thức ngƣời thông qua thị giác Việc giải đƣợc vấn đề giúp hiểu dƣợc phần cách thức hoạt động não trình nhận thức ngƣời Mối quan hệ thị giác não hoạt động ngƣời - Giải thích đa dạng nhân thức ngƣời hai cấp độ cá nhân đám đông Cá nhân thƣờng liên quan đến vấn đề sinh học, đám đông thƣờng liên quan đến vấn đề xã hội Điều giúp cho có đƣợc lý giải cho hành động khác ngƣời - Nghiên cứu dạng tƣơng tác thơng qua máy tính nhƣ thực đơn, câu lệnh hay thiết bị Thông qua cách tƣơng tác hiểu rõ kiểu tƣơng tác cách thiết kế giao diện phù hợp Việc thiết kế giao diện tốt đòi hỏi nỗ lực lớn nhà thiết kế để thu đƣợc kết tốt - Chỉ lỗi HCI thiết kế giao diện chƣơng trình phần mềm Các lỗi thiết kế nhƣ tính khó hiểu, khơng rõ nghĩa hay nhầm lẫn xuất đâu lặp lại nhiều lần Hậu nhầm lẫn tùy thuộc vào trƣờng hợp từ đơn giản nhƣ mở tủ lạnh hay phím chức vấn đề nhƣ điều khiển máy bay - Thiết kế giao diện cụ thể để minh họa kết đạt đƣợc Việc thiết kế giao diện tốt phải bao gồm có nhiều vấn đề khác từ phông chữ, khoảng cách chữ dòng, biểu tƣợng ảnh hƣởng nhiều đến trình tƣong tác Các thiết kế không đơn giản mặt kĩ thuật mà cịn có nhiều yếu tố khác Điều địi hỏi cần có nhiều nỗ lực để kết hợp yếu tố lại với Hướng nghiên cứu đề tài: Về lý thuyết: 160 - Tiếp tục xem xét kĩ lƣỡng cách thức xử lý thông tin não ngƣời có liên kết ngành khoa học khác để giải mã hành động ngƣời hai cấp độ cá nhân tập thể Mở rộng để nghiên cứu thực nghiệm cụ thể để rút đƣợc kết luận cụ thể - Nghiên cứu kiểu tƣơng tác ngƣời-máy thơng qua sử dụng máy vi tính Mở rộng sang kiểu tƣơng tác khác trở nên phổ biến Có liên kết hoạt động ngƣời trình tƣơng tác với chế hoạt động trao đổi thông tin diễn não ngƣời Về chương trình demo: - Hồn thiện trang Web thơng qua phần lý thuyết trên, ứng dụng nhiều kết lý thuyết thu đƣợc để thiết kế đƣợc giao diện tốt than thiện với ngƣời dùng 161 TÀI LIỆU THAM KHẢO Tiếng Anh [1] Alejandro Jaimes and Nicu Sebe, DIAP (2006), Multimodal human–computer interaction, published by Mathias Kolsch, University of Amsterdam, The Netherlands [2] Ben Shneiderman (1998), “Designing the User Interface, Strategies for Effective Human - Computer Interaction”, Third Edition [3] B Shneiderman (1993), Spark of Innovation in Human-Computer Interaction, Ablex Publ, Norwood, NJ [4] Brad Myer, Jim Hollan, Isabel, Steve Bryson, Dick Bulterman (1995), Strategic direction in human-computer interaction, publisher ACM, New York, USA [5] Daisy Mwanza (MSc HCI; BSc (Hons) IT) (2006), Toward an Activity-Oriented Design method for HCI research and practice, thesis submitted in partial fulfilment of the requirement for the degree of Doctor of Philosophy [6] Elspeth Mckey, Rmit, Australia (2002), Enhance learning through Human Computer Interaction, Ideal Group Reference, Library Congress Cataloging in Published Data, United State of America [7] Eva Hudlicka, Psychometrix Associates, Inc (1805) The role of affect in human– computer interaction, Azalea Drive, Blacksburg, VA 24060, USA [8] John F Roesler, Richard A Yetter and Frederick L Dryer, Mechanical and Aerospace Engineering, Pricnciple activity theory for HCI, Princeton University, Princeton, NJ 08544, USA [9] Lawrence Shao-Hsien Chen, B S, (1996), Joint Processing of Audio-Visual Information for the Recognition of Emotional Expressions in Human-Computer Interaction, Thesis Submitted in partial fulfillment of the requirment for the degree of Doctor of Philosophy in Elictrical Enggineering in the Graduate College of the University of Illinois at UrbanaChampion, University of Illinois at Urbana-Champion, 1992 [10] Mathew I Brad (2004), User Modeling in Human-Computer Interaction, publisher Springer Netherlands [11] Maja Pantic, Nicu Sebe, Jeffrey F Cohn, Thomas Huang (1997), Affective multimodal human-computer interaction, Source International Multimedia Conference, Proceedings of the 13th annual ACM international conference on Multimedia 162 [12] Sari Kujala (2004), A Practical Approach to User Involvement for Gathering User Needs and Requirement, Dissertation for the degree of Doctor of Philosophi to be presented with due permission of the Department Computer Scicence [13] Suhanya Gunarajah, Bachelor of Engineering (2004), Hardware involved in HCI problem, a thesis submitted to the school of Information and Electrical Engineering, the University of Queensland [14] Tonya Barrier (2005), Human Computer Interaction Development and Management, Second Edition [15] Vladimir I Pavlovic, Rajeev Sharma, Thomas S Huang (2003), Visual Interpretation of Hand Gesture for Human-Computer Interaction, Department of Elictrical and Computer Engineering and the Beckman Institute for Advance Science and technology, University of Illinois at Urbana-Champion 405 N Mathew Avenue, Urbana H, 61801, USA [16] V V Alexandrov & N D Gorsky (1991), “From Humans to Computers, Cognition Through Visual Perception”,World Scientific Series in Computer Science – Vol 22, World Scientific Publish Co Pte Ltd [17] Zhihong Zeng, Jilin Tu, Ming Liu, Tong Zhang (2001), Bimodal HCI-related affect recognition, Source International Conference on Multimodal Interfaces Proceedings of the 6th international conference on Multimodal interfaces, Publisher ACM, NY, USA ... tƣợng nên đƣợc tổ chức lại cho có mối quan hệ gần Sau xem xét số cách thức tổ chức biểu tƣợng nhƣ tổ chức theo đƣờng thẳng, tổ chức theo hình sao, tổ chức theo thƣ mục 38 ● Sử dụng cách thức để... luận sau Con ngƣời sở hữu khả tập hợp thông tin thị giác yếu tố nhƣ chiều sâu, kết cấu mầu sắc yếu tố ảnh hƣởng mạnh mẽ nhìn ngƣời hay nói cách khác ngƣời bị thu hút vào yếu tố Các yếu tố nhƣ bố... diện phần mềm cụ thể Trong hoạt động ngƣời bị chi phối ba yếu tố: yếu tố xã hội (văn hóa, tơn giáo, kinh tế, trị) yếu tố ngƣời (tâm lý học, sinh lý học, thần kinh học ) yếu tố mơi trƣờng xung