Luận văn Ứng dụng yếu tố con người vào trong tổ chức HCI

Giải thích cơ chế xử lý thông tin trong bộ não và sự tăng cường nhận thức của con người thông qua thị giác.Việc giải quyết được các vấn đề trên sẽ giúp chúng ta hiểu được phần nào cách thức hoạt động của bộ não trong quá trình nhận thức của con người. Mối quan hệ giữa thị giác và bộ não trong các hoạt động của con người.

pdf171 trang | Chia sẻ: lylyngoc | Lượt xem: 2422 | Lượt tải: 0download
Bạn đang xem trước 20 trang tài liệu Luận văn Ứng dụng yếu tố con người vào trong tổ chức HCI, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
khỏi chương trình, còn trong trường hợp thứ hai thì Ctl + Q lại là lưu đối tượng vào ổ đĩa. 4. Lỗi của chuột : Bây giờ chúng ta sẽ xem xét trường hợp con chuột không sử dụng hòn bi ở dưới mà thay vào đó sử dụng một thanh cuộn ở bên trên Hình 3. 1. 58 Chuột có 3 nút bấm Chuột có 3 chức năng để điều khiển bao gồm có nút điều khiển, nút cuộn và nút tròn dùng trong trường hợp giao diện nhỏ khi mà chuột không thể hoạt động. Với kiểu dáng thiết kế như 135 trên chúng ta sẽ rất khó nhận ra các phím chức năng của chuột. Liệu bạn có thể nhìn thấy chúng một cách dễ dàng được không? Hình 3. 1. 59 Nút điều khiển trên chuột Tuy nhiên đấy không phải là vấn đề lớn nhất. Việc thiết kế chuột không tuân theo quy tắc thông thường khiến xảy ra hai vấn đề quan trọng sau đây: nút power của chuột và nút chuyển trạng thái yêu cầu các thao tác khác nhau, hơn nữa thông tin thị giác phản hồi bị ngón tay che lấp đi. Hình 3. 1. 60 Che mất chức năng điều khiển 5. Lỗi khi sử dụng cuộn màn hình và thanh trượt : Mặc dù đã có nhiều ví dụ được đưa ra tuy nhiên các trang Web vẫn có nhiều lỗi trong việc thiết kế cuộn màn hình. Điều này gây nên sự khó chịu của người xem, khó khăn khi truy cập thông tin và mất nội dung. Sau đây chúng ta sẽ xem xét một số hướng dẫn cho việc thiết kế scrolling và scrollbars a. Sử dụng Scrollbar nếu như nội dung cần đọc cần phải được cuộn. Không nên dựa vào cuộn tự động hay kéo vì các công cụ này con người không để ý đến b. Sử dụng các Scrollbars ẩn nếu như tất cả nội dung được hiển thị. Nếu như người dùng nhìn thấy một thanh công cụ, họ sẽ giả định rằng có thêm nội dung thông tin và sẽ khó chịu nếu như không sử dụng được thanh trượt c. Tuân theo các quy tắc chuẩn thiết kế các thanh trượt sao cho thật giống các thanh trượt d. Tránh sử dụng các thanh trượt ngang trên các trang Web và hạn chế sử dụng ở các nơi khác 136 e. Hiển thị tất cả các thông tin quan trọng trên các nếp cuộn. Người dùng có thể quyết định cuộn hay không căn cứ trên các thông tin đã nhìn mà không cần phải sử dụng thanh cuộn Sau đây chúng ta sẽ xem xét một số vấn đề lỗi trong việc thiết kế các thanh trượt: o Các trang Web vãn còn hay sử dụng các thanh trượt ngang. Trong quá trình sử dụng máy tính người dùng thích sử dụng các thanh trượt dọc hơn là các thanh trượt ngang. o Các trang Web sử dụng cả thanh trượt ngang và dọc gây nhiều khó khăn cho người dùng do phải sử dụng vấn đề về thị giác trong không gian hai chiều. Điều đó gây ra sự khó khăn nếu như người dùng muốn đọc hết nội dung thông tin. Ngược lại khi sử dụng một thanh trượt người dùng sẽ cảm thấy thoải mái và dễ làm chủ hơn. Hình 3. 1. 61. Lỗi khi thiết kế thanh trượt Do vậy trong tất cả các trường hợp, các thông tin quan trọng nhất cần phải được hiển thị trên màn hình bởi vì sử dụng thanh cuộn sẽ gây nên cho sự khó khăn trong quá trình truy cập i. Các hành động cần thiết mà thanh trượt yêu cầu có thể gây khó khăn cho người dùng kém khả năng lướt Web ii. Người dùng sẽ khó xác định được vị trí cần thiết sau khi sử dụng thanh trượt Người cao tuổi sẽ gặp khó khăn trong việc xác định điểm ở trên thanh trượt thực đơn hay các thực đơn có kích cỡ nhỏ. Sau đây chúng ta sẽ nghiên cứu một số ví dụ cụ thể : i. Trong việc thiết kế các thanh trượt quen thuộc, người thiết kế sẽ gặp phải một số vấn đề về tinh hữu dụng. Do vậy người thiết kế sẽ không sử dụng các thiết kế thanh trượt phổ biến. Những hình sau đây sẽ chỉ cho chúng ta ba ví dụ về việc lỗi trong thiết kế scrollbar. Hình bên trái ngoài cùng đưa ra một loạt các biểu tượng. Tuy nhiên người sử dụng vẫn không quen sử dụng các biểu tượng ảo này do không thể biết được nếu kích vào các biểu tượng đó sẽ có những lựa chọn khác như thế nào. Hình ở giữa là cấu hình các sản phẩm, một số người dùng 137 không để ý đến các thanh trượt ngang do chúng bị pha trộn vào các sản phẩm và bị làm mờ đi do không có mầu sắc nổi bật. Do vậy làm hạn chế cho sự lựa chọn các sản phẩm khác. ii. Hình bên phải ngoài cùng một bản đồ tương tác, hầu hết người sử dụng đều không để ý đến thanh trượt ngang bởi vì chúng giống như mũi tên chỉ hướng Bắc/Nam cho bản đồ. Ngoài ra: thanh trượt còn nằm ngoài khu vực điều khiển, mũi tên bên trên và bên dưới giống như điểm giới hạn và thanh trượt thì không có sự chỉ dẫn. Sau đây chúng ta sẽ xem một số ví dụ tốt về thiết kế các thanh trượt Hình 3. 1. 62 Một số thanh trượt được thiết kế tốt Trong các trường hợp trên, người dùng có thể dễ dàng thấy các thanh trượt và sử dụng chúng một cách dễ dàng. Căn cứ vào các ví dụ trên chúng ta có thể rút ra các ví dụ về việc thiết kế các thanh trượt tốt đó là i. Sử dụng một thanh trượt rõ ràng và tách hẳn so với phần nền còn lại, ví dụ như sử dụng mầu sắc. ii. Sử dụng các mũi tên bên trên và bên dưới iii. Sử dụng các con trỏ trượt để người dùng có thể ước lượng được dung lượng của thực đơn iv. Cho phép người dùng cuộn bằng nhiều cách khác nhau, ví dụ như chuột, con trỏ trượt, sử dụng mũi tên... 6. Lỗi do thể hiện mầu sắc : Nhiều khi, trong một chương trình, nếu màu sắc không phù hợp sẽ khiến người dùng gặp phải khó khăn. Chẳng hạn như chương trình Paint Shop Pro, menu của chương trình này có màu quá xám nên dễ làm người sử dụng nhầm lẫn. Như chúng ta đã biết mầu sắc là một trong những yếu tố quan trọng trong việc thu hút thị giác của con người. Khi mắt chúng ta chưa thể nhìn toàn bộ hình ảnh thì mầu sắc đóng vai trò quan trọng để nhận biết được các hình ảnh và đường nét. Ví dụ như trong các biển báo cảnh cáo hay nguy hiểm thì mầu đỏ luôn được sử dụng. 138 Hình 3. 1. 63 Bố trí mầu sắc không hợp lý Tuy nhiên nếu như trong các chương trình chỉ sử dụng mầu sắc thì cũng sẽ không hiệu quả đặc biệt đối với những người mù mầu. Sau đây chúng ta sẽ xem xét vấn đề này một cách kĩ càng hơn. Mù mầu là vấn đề của một số người khi không có khả năng phân biệt mầu sắc ở nhiều cấp độ khác nhau. Cụ thể có ba loại khác nhau là không phân biệt được mầu sắc, độ sáng và độ quá đậm của mầu sắc. Mù mầu gây ra một số sự bối rối nhất định trong quá trình tương tác với máy tính, khi người dùng không thể phân biệt được các điểm cần lưu ý mà có sử dụng mầu sắc. Để tránh tình trạng trên, người thiết kế phải tránh các giao diện chỉ sử dụng mầu sắc, phải sử dụng thêm các công cụ hỗ trợ khác nữa. Nếu như không có cách nào khác khi chỉ sử dụng mầu sắc thì chúng ta phải làm tăng tính tương phản của các mầu sắc lên. Mầu sắc rất dễ nhận biết thông qua độ tương phản của chúng. Màu xanh đậm và đỏ đậm dễ phân biệt hơn là mầu xanh và đỏ có cùng độ sáng. Độ tương phản càng cao, mầu sắc càng dễ thể hiện. 7. Duyệt file PDF trực tiếp : Người dùng rất ghét khi thao tác trên các file PDF một cách trực tuyến bởi vì có sự gián đoạn nhất định trong quá trình chuyển các trang. Và trong nhiều các trường hợp thì máy in hay các file lưu cũng không hoạt động do lỗi xuất hiện trong các câu lệnh. Cách bố cục thường xuyên được làm tối ưu cho khuôn khổ trong một trang giấy và rất hiếm khi phù hợp với cửa sổ của người dùng. Tệ hại nhất đó chính là do các file PDF có các nội dung không được bố trị dễ nhìn do vậy rất khó khăn cho người dùng trong quá trình định hướng. Các file PDF rất tiện ích trong việc in và phân phát các bản viết tay. Việc lưu các file cho mục đích này và chuyển bất kỳ thông tin nào lên các trang mạng. 8. Không thay đổi mầu sắc đối với các đường dẫn đã ấn : Việc nắm được các đường đi cũ có thể giúp chúng ta trong việc định hướng ở hiện tại. Biết được các thông tin cũ và hiển thị các thông tin hiện tại làm cho sự quyết định kế tiếp được dễ dàng hơn. Các đường dẫn là một trong những yếu tố quan trọng trong việc định vị. Người dùng có thể loại trừ các đường dẫn mà không mang lại nhiều giá trị trong quá trình tìm kiếm trước đó. Ngược lại, người dùng có thể duyệt lại các đường dẫn mà đã mạng lại nhiều thông tin trong quá trình tìm kiếm trước đó. 139 Hình 3. 1. 64 Lỗi mầu sắc của các đường dẫn Nhưng điều quan trọng nhất chính là tránh cho người dùng khỏi lãng phí thời gian khi liên tục duyệt một đường dẫn lặp đi lặp lại. Lợi ích được đề cập trên chỉ có khi có một giả định sau đây: người dùng có thể nhận ra các đường dẫn đã duyệt và chưa duyệt thông qua mầu sắc gắn trên các đường dẫn. Khi mà các đường dẫn không thay đổi mầu sắc, người dùng cảm thấy mất phương hướng nhiều hơn trong quá trình tìm kiếm và có thể thặm lại các đường dẫn một cách liên tục. 9. Mọi thứ đều giống như một quảng cáo : Thu hút lựa chọn là một tính năng rất có hữu dụng, và người sử dụng Web luôn tìm cách lảng tránh đối với những thông tin không cần thiết trong quá trình tương tác. Thật không may, người sử dụng cũng không để ý đối với các thiết kế hợp lệ và có giá trị như các mẫu của việc quảng cáo. Sau đó, khi mà người dùng bỏ qua một cái gì đó, người dùng sẽ không xem xét một cách chi tiết đó là cái gì. Bởi vậy cần phải tránh tất cả các thiết kế mà giống như trang quảng cáo. Các ngụ ý chính xác của các hướng dẫn thường biến đổi với các dạng khác nhau, thường tuân theo các quy tắc sau i. Mất thị giác có nghĩa là người sử dụng không bao giờ dán con mắt vào bất cứ thứ gì giống như là những điều rất quan trọng bởi vì các yếu tố như hình dáng hay vị trí trên trang. ii. Không sử dụng các hình động sẽ làm cho người sử dụng bỏ qua các phần trong nháy mắt hay các đoạn chữ sáng hay các hình động ấn tượng khác. iii. Lọc từ dưới lên có nghĩa là đóng các cửa sổ kéo lên trước khi chúng có thể được thực hiện 10. Màn hình với quá nhiều chữ : Màn hình với quá nhiều chữ làm giảm đi hiệu quả trong quá trình tương tác. Để làm tăng hiệu quả chúng ta nên tuân theo một số các quy tắc sau : i. Phân chia các mục con ii. Sử dụng các dấu chấm (bullet) iii. Làm nổi các từ khóa iv. Các đoạn ngắn 140 v. Lối viết đơn giản 11. Lỗi trong cách bố trí chương trình : Trong bất kỳ một chương trình nào thì người dùng đều mong muốn nhìn thấy một cách tổng thể các vấn đề cần quan tâm. Người sử dụng thường không muốn nhìn các vấn đề một cách tuần tự, điều đó làm cản trở người dùng trong quá trình tương tác. Người dùng luôn cảm thấy không thoải mái khi không thể làm chủ được chương trình và băn khoăn tự hỏi không biết mình làm có đúng hay không, hay liệu còn cách lựa chọn nào tốt hơn hay không? Hình 3. 1. 65 Lỗi trong cách bố trí chương Sau đây chúng ta sẽ nhìn hai cách bố trí trong chương trình có tác dụng hoàn toàn khác nhau, chương trình đầu tiên có thực đơn dạng kéo chuột đến đâu thì hiện ra đến đấy, chương trình thứ hai cung cấp cho người dùng cái nhìn toàn diện hơn về các lựa chọn. Hình 3. 1. 66 Lỗi được khắc phục Lỗi khi thiết kế menu của chương trình Macintosh Guidelines : Như ta thấy, thanh menu của chương trình này rất ít chức năng, khoảng trống trên thanh menu còn rất nhiều, vì vậy ta không nên làm menu con. Khi đó ta nên tách menu Format thành 3 menu Font, Size, Style như hình sau 141 Hình 3. 1. 67 Lỗi trong thiết kế thực đơn Hình 3. 1. 68 Lỗi được khắc phục Như ta thấy, thanh menu của chương trình này rất ít chức năng, khoảng trống trên thanh menu còn rất nhiều, vì vậy ta không nên làm menu con. Khi đó ta nên tách menu Format thành 3 menu Font, Size, Style như hình trên. 12. Quá trình tìm kiếm nghèo nàn : Quá trình tìm kiếm bằng chữ làm giảm đi dáng kể tính hữu dụng bởi vì sự yếu kém trong các vấn đề về ngôn ngữ như số nhiều, dấu nối, từ thích hợp, lỗi in ấn và cuối cùng là các dòng chữ yêu cầu. Cách tìm kiếm như vậy gây rất nhiều khó khăn cho người già và gây trở ngại đối với những người khác. Một vấn đề liên quan trong quá trình tìm kiếm đó là các kết quả thường nghèo nàn và mang tính số lượng chứ không có được chất lượng cần thiết. Quá trình tìm kiếm lý tưởng đó chính là các mục yêu cầu quan trọng nhất được hiển thị ngay lên trên đầu, đặc biệt đối với những yêu cầu quan trọng ví dụ như là tên của các hãng sản phẩm. Tìm kiếm là một sự trợ giúp khi mà việc xác định phương hướng là không thể. Các sự trợ giúp tìm kiếm có thể giúp cho một số quá trình tìm kiếm đơn giản được thực hiện và quá trình tìm kiếm nên được trình diễn trên các hộp đơn khi mà người sử dụng đang tìm kiếm. Hơn nữa các kết quả tìm kiếm đều cho thấy đều rất nghèo nàn và thậm chí chẳng liên quan gì đến nội dụng cần tìm. Quá trình tìm kiếm hiệu quả thì yêu cầu cần phải có sự đầu tư đúng mức. 13. Lỗi không nhất quán : Đồ họa thường có vấn đề về tính nhất quán trong quá trình thiết kế. Các cách thiết kế khác nhau và cách sử dụng từ ngữ khác nhau đối với cùng một vấn đề là nguyên nhân chủ yếu. Hay sử dụng một từ giống nhau đối với các nhiệm vụ khác nhau. Do 142 vậy việc sử dụng các tên giống nhau đối với các nhiệm vụ như nhau làm cho sự việc trở nên dễ dàng hơn. Hình 3. 1. 69 Sự không nhất quán trong bố cục 14. Các lỗi trong quá trình đăng nhập : a) Đăng nhập tại vị trí đầu tiên Trong hầu hết các trang mạng hiện nay, người dùng có thể làm bất cứ việc gì mà không cần xác định danh tính. Cách tiếp cận lý tưởng đó chính là các trang Web phải biết được khách hàng là ai để có thể đưa ra các thông tin phù hợp. Người dùng thường không thích phải tạo nên tài khoản cho các nhiên vụ đơn giản. Tất nhiên trong quá trình giao dịch người dùng phải có tên nhưng không nhất thiết là phải có tài khoản và mật mã mới thực hiện được giao dịch. b) Yêu cầu đăng nhập quá sớm Một số các trang Web yêu cầu người dùng đăng nhập thông tin trước khi nhin thấy sản phẩm. Nếu như quá trình đăng nhập diễn ra chậm hơn hoặc là sau các đường dẫn như “mời bạn đăng nhập để mua sản phẩm” thì người dùng sẽ cảm thấy bớt khó chịu hơn. Amazon đã tạo nên một tập các quy tắc chuản bằng việc đợi đến khi nào lựa chọn cuối cùng được thực hiện để yêu cầu đăng nhập. Việc chọn vào “My Account” sẽ giúp cho người dùng có thể thấy được toàn bộ các sản phẩm của chúng trước khi lựa chọn. Trong một số trường hợp việc đăng nhập là không cần thiết thay vào đó việc có một thẻ làm việc cũng mang lại hiệu quả cần thiết. c) Gánh nặng của việc đăng ký lại Việc đăng ký luôn mang đến cho người dùng sự không thoải mái. Họ phải trả lời nhiều câu hỏi mà nhiều trong số chúng không liên quan đến nhiệm vụ hiện tại. Ngoài ra họ còn phải nhớ đến tên đăng nhập trong các lần sau và phải chọn mật khẩu dễ nhớ. Số lượng tên và mật khẩu có thể gánh nặng cho người dùng nếu như số lượng các giao dịch là lớn… Các thông tin mật cũng có thể bị phát tán trên mạng. d) Nút đăng nhập không hiển thị rõ ràng Thông thưòng người dùng có thể truy nhập trực tiếp các trang cần làm việc cũng như nhìn thấy các thông tin của mình và các trạng thái. Tuy nhiên khi mà không có thẻ làm việc và họ truy cập trên nhiều dịch vụ trên nhiều máy khác nhau thì họ phải đăng nhập. Thông tin của các sản phẩm cần được hiển thị rõ ràng đồng thời nút đăng nhập cũng cần phải hiển thị rõ ràng. Tuy nhiên các nút này 143 thường xuyên bị mờ đi hoặc không thể làm rõ. Có một số cải tiến về mầu sắc để giúp cho sự nhận biết được dễ dàng. e) Yêu cần quá nhiều thông tin của người dùng Việc yêu cầu nhiều thông tin mang đến sự không thoải mái cả về tâm lý và kỹ thuật. Khi mà người dùng liên tục bị hỏi các câu hỏi không thích và bắt buộc phải trả lời. Hơn nữa việc nhập nhiều thông tin cũng có thể mắc nhiều lỗi hơn và quá trình dò tìm lỗi cũng phức tạp hơn. f) Người dùng không biết các thông tin nên được sử dụng như nào Các thông tin như số điện thoại hay địa chỉ nhà luôn là điều băn khoăn của người dùng khi muốn tải chương trình về máy. Nên cần có thông báo cụ thể cho các thông tin của người dùng như là các dịch vụ cung ứng vé máy bay thông báo số điện thoại của khách hàng là cần thiết khi có sự thay đổi. 15. Các đường dẫn không có quy tắc chuẩn Thông thường các đường dẫn thường gặp phải những vấn đề sau đây: a. Sự không rõ ràng khi thể hiện đường dẫn này có mục đích gì, các đoạn chữ, mầu sắc, các đoạn gạch chân không làm nổi bật lên được các thông tin bên trong. b. Không có sự khác nhau giữa các đường dẫn đã thăm hay không Không thông báo cho người dùng biết được sẽ thu được những gì khi vào đường dẫn. Đồng thời không cung cấp một số từ khóa để có thể làm nổi bật nội dung cũng như định hướng cho quá trình tìm kiếm được tốt hơn như việc sử dụng các đường dẫn như “click here” hay các đường dẫn không có sự mô tả cần thiết. a. Sử dụng các đoạn Java hay các công nghệ khác làm chậm lại quá trình tương tác b. Các đường dẫn mới yêu cầu phải mở ra các cửa sổ mới. Việc mắc phải các lỗi trên làm cho quá trình tương tác kém đi hiệu quả, đồng thời cũng làm cho người dùng cảm thấy bối rối và khó chịu, trong khi đó thời gian trễ tăng lên và ngăn cản người sử dụng có thể sử dụng các đường dẫn của họ. 16. Thông tin quá tải trên các mẫu điền Người dùng khi sử dụng các trang Web thường gặp phải những vấn đề như sau: a) Quá nhiều câu hỏi không cần thiết, ví dụ như hỏi về tình trạng hôn nhân Miss hay Mrs... b) Quá nhiều các thông tin cần phải điền mặc dù không cần thiết c) Không hỗ trợ nhiều cho tính tự động lựa chọn d) Các trưòng dữ liệu thường được đặc tả nên không cho phép tính đa dạng trong kiểu của trường. 144 17. Lỗi về kích cỡ của các trang : Có hai vấn đề thường xuyên gặp phải trong vấn đề này là như sau a. Đối với các màn hình lớn, các trang Web khó sử dụng nếu như chúng ta không giới hạn lại kích cỡ của cửa sổ. Ngược lại nếu như người dùng sử dụng một cửa sổ cỡ nhỏ và không thể điều chỉnh được thì sẽ rất khó trong quá trình sử dụng. b. Các phần phía bên phải thường xuyên bị lược bỏ đi khi chúng ta in ấn, đặc biệt khi sử dụng các khổ giấy A4. 18. Các ô dữ liệu nhập quá dài: Việc chia các dữ liệu nhập vào thành nhiều các ô đồng nghĩa với việc phải thao tác với con chuột nhiều hơn. Đồng thời chỉ có một ô để nhập dữ liệu cũng không làm tăng tốc độ nhập. Cách lựa chọn tối ưu đó chính là các trường nhập nên được phân chia vừa đủ để tiện cho quá trình tương tác. Việc nhập các thông tin quá dài cũng đồng thời gây nên nhiều lỗi cho người dùng như việc nhâp vào số thẻ ATM 12356845445674456 nếu như có sự phân chia thành các ô hay sử dụng các dấu ngoặc đơn thì có thể giúp cho người dùng có thể kiểm tra được lỗi trong quá trình nhập liệu. 19. Các hình ảnh và chữ quá nhỏ : Một số các trang Web thu gọn hình ảnh từ các hình ảnh to. Như vậy vô tình có thể mất đi một số thông tin quan trọng trong hình ảnh ban đầu. Hơn nữa các hình ảnh ban đầu đều đã có rất nhiều các thông tin trong đó như số người, các yếu tố sắc nét.... Hình 3. 1. 70 Thật khó để phân biệt các hình ảnh trên Các trang Web mặc định cỡ của phông chữ và không cho phép chỉnh sửa các phông đó. Khoảng 95% thời gian sử dụng thì cỡ phông chữ là nhỏ, làm giảm đi tính dễ đọc đối với hầu hết những người trên 40 tuổi. Quan tâm tới sự ưa thích của người dùng và để cho họ có nhu cầu thay đổi lại phông nếu thấy cần thiết. 3. 2. Thiết kế một giao diện cụ thể Sau đây chúng ta sẽ xem xét các vấn đề cụ thể khi chúng ta thiết kế một giao diện cụ thể. Sau đây tôi xin giới thiệu trang Web do tôi thiết lập để minh họa một số vấn đề mà tôi đã nêu trong các phần trước. Trang Web nói lên những mảnh đời bất hạnh trong cuộc sống. Trang Web bao gồm có bảy phần: trang chủ, các địa chỉ khó khăn, đóng góp, tìm kiếm, những tấm lòng nhân ái, liên hệ, diễn đàn Trong đó nội dung của các phần là như sau: 145 1. Trang chủ là trang chính của trang Web, trong đó nói lên các hình ảnh, hoạt động của hội (nằm ở bên trái) và các tấm lòng nhân ái hảo tâm đóng góp giúp đỡ người nghèo. Trong mỗi phần thì đều có hình ảnh bên trái, đó là hình ảnh tiêu biểu của bài viết. Bên phải của mỗi hình ảnh là nội dung của bài viết. Nội dung của các bài viết đã bị thu gọn, người dùng có thể ấn trực tiếp vào đường dẫn hoặc là kích vào nút xem thêm để xem toàn bộ nội dụng 2. Trang tiếp theo đó chính là các địa chỉ khó khăn. Cách thức truy cập trang này bao gồm có các thực đơn kéo xuống. Trong đó các thực đơn được phân chia làm các vùng miền địa chỉ trên cả nước. Khi người sử dụng chọn một địa chỉ khó khăn thì lúc đó sẽ hiện ra một loạt các hình ảnh và bài viết địa chỉ khó khăn. Khi người sử dụng chọn ảnh Album thì toàn bộ hình ảnh của địa chỉ khó khăn sẽ hiện ra. Nếu người dùng chọn một ảnh nào đó thì ảnh đó sẽ được phóng to ở bên trái, bao gồm các hình ảnh và hoàn cảnh của những mảnh đời bất hạnh để mọi người có thể nhìn thấy. Cách bố cục trong trang này bao gồm có một số các tập ảnh, tuy nhiên khi xuất hiện thì chỉ có một ảnh làm đặc trưng. Nếu người dùng muốn nhìn thấy toàn bộ tập ảnh thì có thể chọn vào đường dẫn album ở phía dưới để có thể hiển thị toàn bộ hình ảnh. Bên phải của ảnh đó là những phần miêu tả những hoàn cảnh khó khăn, trong đó nêu lên hoàn cảnh gia đình, cuộc sống hiện tại, sự khó khăn trong cuộc sống mưu sinh và địa chỉ. 3. Trang tiếp theo đó chính là trang đóng góp để giúp những tấm lòng hảo tâm có thể có những hình thức hỗ trợ. Có một số loại hình hỗ trợ mà người dùng có thể chọn lựa cho phù hợp nhất với khả năng của mình. Trong trang này có cung cấp một số sự hỗ trợ để người dùng có thể tránh được các sai lầm có thể có. Các trường yêu cầu bao gồm có Họ và tên, ngày tháng năm sinh, địa chỉ và hình thức đóng góp. Mỗi một trường đều có cách đăng ký khác nhau. 4. Trang tiếp theo đó chính là trang những tấm lòng nhân ái. Trang này bao gồm có các thực đơn được thiết kế lồng nhau, có phân chia danh mục để người dùng có thể dễ dàng tìm đến danh mục cần tìm, 5. Trang tiếp theo đó chính là trang tìm kiếm. Trang này sẽ tìm kiếm theo hình ảnh và hoạt động. Từ khóa được yêu cầu để quá trình tìm kiếm được dễ dàng hơn. Ngoài ra còn thêm các ngày tháng để bổ trợ cho quá trình tìm kiếm. 6. Trang tiếp theo đó chính là trang diễn đàn. Trong trang này cũng có một thực đơn kéo xuống, bao gồm có các phần: đăng ký, thảo luận, trao đổi, đóng góp ý kiến, chia sẻ và các hoạt động. Trang đăng ký dưới dạng các mẫu điền có hỗ trợ thông báo lỗi nếu người dùng nhập sai. 7. Trang cuối cùng là trang liên hệ, giúp cho người sử dụng có thể liên hệ với các chủ của trang Web. Trong đó có nêu lên một số các thông tin cần thiết. Sau đây là một số ứng dụng vào cách thiết kế cho các trang trong trang những mảnh đởi bất hạnh. 3. 2. 1. Cách thiết kế cho trang chủ 146 Thứ nhất, lựa chọn cách hiển thị thông tin một cách đa dạng nhất có thể trong khi không thể đưa quá nhiều thông tin lên trên màn hình, tức là chúng ta phải thiết kế một cách nào đó để sao cho người dùng khi có thể thu nhận được nhiều nhất thông tin có thể, cách thể hiện ở đây có thể sử dụng các mầu sắc, hình ảnh, âm thanh, chữ viết và các cách bố cục trên đó. Các hình ảnh và chữ viết phải mang lại nhiều nhất các thông tin có thể, bởi vì đây chính là hai yếu tố mạnh mẽ nhất để mang thông tin đến cho người sử dụng máy tính. Một điều chúng ta có thể dễ dàng nhận ra đó chính là các thông tin mang tính trừu tương rất khó để có thể biểu đạt với một cách duy nhất ví dụ như hình ảnh hay chữ mà thay vào đó phải có sự kết hợp cả hai... Do vậy cần có sự kết hợp theo nhiều cách khác nhau để biểu đạt các thông tin mang tính trừu tượng, điều đó mang lại sự hiệu quả to lớn hay đó là phối hợp hoạt động của bán cầu não trái và bán cầu não phải. Trước hết ta có thể thấy được rằng, mầu sắc là yếu tố quan trọng nhất để thu hút thị giác, đặc biệt là mầu đỏ. Nội dung chính của tiêu đề cần đựoc hiển thị một cách rõ ràng nhất có thể. Hơn nữa chữ viết đỏ càng nổi bật hơn nếu như có độ tương phản nhất định đối với phông nền, do vậy có tác dụng mạnh mẽ trong việc chuyển các thông điệp đến cho người sử dụng. Thứ hai, như ta đã thấy ở trên, hình ảnh và chữ viết có mối quan hệ với nhau trong quá trình xử lý thông tin khi mà cả hai đều cùng mang đến một thông điệp giống nhau. Dòng chữ “Những mảnh đời bất hạnh” và ba hình ảnh phía dưới có sự phù hợp nhất định đối với nhau. Các hình ảnh ở dưới sẽ thể hiện tất cả những gì có thể có khi người dùng đọc được dòng chữ ở phía trên. Đây là điều quan trọng nhất khi thiết kế cho trang Web này, do vậy hai phần trên được đặt gân nhau để tăng sự tương tác đối với người dùng và thu hút được thị giác nhất. Hình 3. 2. 1 Giao diện của trang chủ 147 Thứ ba, hình ảnh ba chiều là yếu tố thu hút thi giác rất tốt. Đối với dòng chữ thì do có phông đen và chữ đỏ nên đã làm nổi bật lên dòng chữ ngay lập tức. Trong khi đó thì hình ảnh ba chiều có sự thu hút thị giác đặc biệt nên các hình ảnh ba chiều được bố trí trong trang Web, đặc biệt là hình ảnh ở bên trái ngoài cùng và hình ảnh ở giữa do con người trong quá trình đọc sẽ đọc từ trái sang phải. Tuy nhiên việc bố trí số lượng hình ảnh ba chiều không được quá nhiều vì điều đó có thể làm nhiễu loạn thị giác. Tóm lại đối với phần tiêu đề thì làm nổi bật lên chữ và bố trí cho hình ảnh ba chiều là vấn đề quan trọng nhất. Tiếp theo, chúng ta có thể thấy được rằng, việc thiết kế thanh thực đơn nằm ngay phía dưới. Trong đó các mầu chữ và phông nền có độ tương phản nhất định sẽ giúp làm nổi bật lên các vị trí trong thanh thực đơn. Sau đó dưới là một vị trí để người dùng có thể tìm kiếm được các thông tin ở trên mạng. Bên cạnh đó là hình kính lúp giúp cho người sử dụng Hình 3. 2. 2 Thanh công cụ tìm kiếm trên mạng Cuối cùng, chúng ta sẽ xem xét nội dung của trang chủ. Như đã trình bày ở trên, bộ nhớ ngắn hạn của con người chỉ có khả năng nhớ từ 5 đến 9 ký tự. Do vậy việc đưa vào quá nhiều danh mục cũng mang đến một sự quá tải đối với người dùng, thay vào đó nên tổ chức thành các phần có liên quan đến nhau, để giao diện có sự thống nhất nhất định đối với người dùng. Hơn nữa trong quá trình thao tác với trang chủ, hình ảnh và các tiêu đề bên luôn luôn có sự hỗ trợ cho nhau nhất định. Hình ảnh bên trái phải thể hiện rõ ràng nhất những gì có thể bên trong nội dung của bài viết. Cách thức tổ chức như vậy phải xuyên suốt trong quá trình thiết kế để đảm bảo tính nhất quán. Cố gắng hiển thị tất cả các thông tin liên quan một cách đồng thời. Quá trình tìm kiếm thị giác sẽ đạt hiệu quả cao nếu như các thông tin liên quan được hiển thị đồng thời ngay cả đối với những trường hợp có giao diện phức tạp. Nếu như các thông tin liên quan được hiển thị một cách không đồng thời trên các hình khác nhau quá trình tương tác sẽ suy giảm đáng kể. Với việc bố trí giao diện một cách hợp lý thì giao diện có thể mang lại nhiều thông tin hơn so với cách nhận biết một cách thông thường. 3. 2. 2. Cách thiết kế cho trang các địa chỉ khó khăn Trước hết chúng ta xem xét cách thức bố cục của thực đơn trong trang các địa chỉ khó khăn. Như chúng ta đã biết thực đơn nếu được bố trí phân cấp theo chức năng thì người dùng thao tác sẽ rất có hiệu quả. Các địa chỉ khó khăn được phân chia ra làm ba vùng: Bắc, Trung, Nam. Sau đó trong mỗi vùng thì lại phân chia làm hai: các vùng cao và đồng bằng. Trong mỗi vùng thì lại có tên các tỉnh tương ứng. Cách thức tổ chức như vậy giúp cho người sử dụng dễ dàng định vị được các tỉnh trong thanh thực đơn, qua đó làm giảm thời gian tương tác với thực đơn như mất phương hướng hay nhầm lẫn. Trong quá trình tìm kiếm khi con trỏ chuột chạy đến đâu sẽ có một vệt xám chạy theo cùng thanh thực đơn để báo cho người dùng biết được đang ở 148 đâu của thanh thực đơn. Ví dụ dưới đây minh họa cho thấy nếu như người dùng muốn tìm kiếm các địa chỉ khó khăn tại Lạng Sơn. Hình 3. 2. 3 Giao diện của thực đơn các địa chỉ khó khăn Cách tổ chức của trang này cũng gần giống tương tự với cách thức tổ chức ở trên khi mà mầu sắc, bố cục và sự nhất quán vẫn là một trong những cách thức chủ đạo để có thể thiết kế được một giao diện tốt. Tuy nhiên mục đích của phần này có khác so với trước nên cách thức tổ chức cũng có sự khác nhau. Trong phần này nhằm mục đích kêu gọi các tấm lòng hảo tâm, do vậy phải làm nổi bật lên sự khó khăn đó. Không có gì diễn tả tốt hơn bằng một hình ảnh to và rõ ràng của các trường hợp bất hạnh. Những cảnh thương tâm như vậy có sự thuyết phục đáng kể trong việc động viên mọi người giúp đỡ các hoàn cảnh khó khăn. Các đường dẫn được tô mầu xanh cũng có tác dụng đáng kể trong việc giúp người dùng dễ nhận ra vị trí để có thể tiếp tục đọc được trọn vẹn bài. Nội dung của 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 của ảnh có nút Album để người dùng có thể xem xét toàn bộ tập ảnh của hoàn cảnh bất hạnh đó. Bên dưới các dòng chữ có đường dẫn để người dùng có thể xem toàn bộ nội dung của bài viết. Hai đường dẫn được thiết kế vị trí rõ ràng để người dùng có thể nhìn thấy dễ dàng. Hình dưới đây là giao diện của các địa chỉ khó khăn. Hình 3. 2. 4 Giao diện của trang các địa chỉ khó khăn 149 Trong mỗi phần đều có một tập các ảnh để người sử dụng có thể hiển thị toàn bộ các ảnh. Một tập các ảnh con được bố trí phía bên trái. Các hình ảnh tương đồng sẽ được hiển thị bên phải.được phóng to hơn. Cách bố trí như vậy giúp cho người sử dụng có được cái nhìn toàn cảnh về tất cả những hình ảnh đang có trong Album và có thể bỏ qua một số các hình ảnh không cần thiết. Hình 3. 2. 5 Giao diện của hình ảnh khi được xem Tiếp theo chúng ta xem nội dung của trang địa chỉ khó khăn. Cách bố trí của trang các địa chỉ khó khăn phải đảm bảo tính sang sủa và dễ đọc để người dùng có thể đọc có thể dễ dàng đọc được nhất có thể. Các vấn đề liên quan đó chính là tỉ lệ phông chữ và cách bố cục khoảng không giữa các chữ. Tỷ lệ font chữ tiết kiệm được không gian và dễ đọc hơn so với các font chữ có tỷ lệ cố định. Kích cỡ của font là một trong những vấn đề cần phải xem xét. Thông thường thì 10 pt là có thể đọc được, 11 pt và 12 pt thì có thể đọc được tốt hơn. Sự khác biệt giữa các font size ít nhất phải là 2 pt, nếu nhỏ hơn thì mắt thường không thể phân biệt được. Sau đây chúng ta sẽ xem xét một số ví dụ cụ thể sau: a. 12 pt dành cho các đoạn văn hội thoại 150 b. 10 pt dành cho các ký hiệu c. 14 pt dành cho các đoạn tiêu đề d. 16 pt hay lớn hơn dành cho các mục lục hay tiêu đề lớn Chữ viết hoa và viết thường: sử dụng cả chữ viết hoa và viết thường có tác dụng tốt hơn so với chỉ dùng riêng chữ hoa. Một trong những vấn đề cơ bản đó chính là việc nhận dạng chữ viết thường dựa rất nhiều vào hình dáng của chúng. Các chữ viết thường không có hình dáng cố định như là trong chế độ viết hoa, do vậy việc nhận biết các chữ thường cũng thường dễ dàng hơn. Ví dụ như sau SHAPE khó đọc hơn so với shape...  Ký tự, chữ và khoảng cách dòng: Khoảng cách ký tự phụ thuộc rất lớn vào font, thông thường các phông khác nhau sẽ có khoảng cách khác nhau. Khoảng cách của các chữ thì xấp xỉ với độ rộng của chữ n. Sau đây chúng ta sẽ thấy có một số cách viết mà khoảng cách là khác nhau Word spacing : khoảng cách hẹp Word spacing : khoảng cách bằng chữ n Word spacing : khoảng cách bằng chữ m Khoảng cách của các dòng là rất quan trọng. Quá nhiều không gian và dòng cách xa nhau có thể tạo ra cảm giác không có sự gắn kết. Quá ít không gian và dòng làm cho đoạn text trở nên khó đọc một cách thoải mái. Ngày nay các phần mềm soạn thảo văn bản đều có các chế độ cho phép thiết lập khoảng cách cho các dòng sao cho phù hợp. Khoảng cách dòng quá ngắn hay quá dài đều rất khó khăn cho người đọc. Hình 3. 2. 6 Nội dung chữ của trang các địa chỉ khó khăn. 151  Độ dài của dòng: Thông thường thì người ta quy định là 10 chữ (60 ký tự) cho mỗi dòng trong một quyển sách, 5 chữ (30 chữ) cho mỗi dòng trong một tờ báo. Nếu như một dòng quá dài, người đọc có thể rất khó khăn trong việc tìm kiếm đâu là bắt đầu cho đoạn dòng tiếp theo. Ngoài ra chúng ta cũng nên sử dụng các bảng dữ liệu để giúp cho việc định dạng và xác định các vị trí được dễ dàng nhờ có việc đảm bảo tính nhất quán. Hơn nữa việc căn lề trái và lề phải cũng giúp cho việc đọc các đoạn văn bản trở nên dễ dàng và thuận tiện hơn.  Cách thể hiện phông chữ: Đây chính là kiểu dáng và giao diện của phông chữ. Thông thường cỡ phông chữ được thể hiện thông qua các printers’ point (pt) 1 pt = 1 / 72 inch = 0. 35 mm 1 pica = 1/6 inch = 4. 2 mm Tiếp theo sẽ là kiểu chữ có móc và kiểu chữ không có móc và chữ có móc là một kiểu trang trí hoặc tô điểm vào đằng cuối của mỗi nét chữ. Ví dụ như T, đây là kiểu chữ của hai phông nền Times New Roman và Georgia... , chữ không có móc không có các đường nét trang trí vào đằng cuối của nét chữ. Ví dụ như T, các phông chữ như Arial, Helvetical và Verdana là các phông thuộc kiểu này. Thông thường đọc các đoạn viết trên giấy thì chữ có móc dễ đọc hơn chữ không có móc tuy nhiên điều này vẫn chưa được kiểm chứng một cách rõ ràng. 3. 2. 3. Cách thiết kế cho trang đóng góp Hình 3. 2. 7 Giao diện trang đóng góp Đây là trang mà những nhà hảo tâm có thể đăng ký theo một mẫu điền sẵn để có thể đăng ký tên mình, cũng như các thông tin liên quan như năm sinh cũng như địa điểm nơi ở và hình thức đóng góp. Trong phần này thì nhập ngày tháng năm sinh là một vấn đề phức tạp nhất khi 152 việc điền của người dùng có thể không hợp lệ cũng như nhầm lẫn trong quá trình nhập như ngày 30/2... Do vậy cách tiếp cận ở đây chính là tạo nên một bảng để người dùng có thể chọn bằng chuột. Khi ô nào đang sang thì tức là ngày tháng năm đó đang được chọn. Nếu như con trỏ chuột di đến đâu thì các trang ô tương ứng sẽ sang lên đồng thời phía trên ngày tháng tương ứng cũng được hiện lên. Dưới đây là giao diện của phần nhập ngày tháng năm sinh Địa điểm của người quyên góp cũng có thể là phần có thể gây nên sự nhầm lẫn, do vậy cách tổ chức là để người dùng lựa chọn bằng chuột. Những nhà hảo tâm thường là ở hai thành phố lớn là Hồ Chí Minh và Hà Nội. Do vậy hai thành phố này được xếp trên đầ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ũng được tổ chức như vậy để giúp người dùng tránh được các sai sót. Tiếp theo chúng ta sẽ xem xét đến trường nhập vào địa chỉ của người sử dụng. Do có sự không nhất quán trong cách gọi tên các vùng miền nên cũng có thể gây nên một sự nhầm lẫn nhất định ví dụ như Sài Gòn và Thành phố Hồ Chí Minh. Do vậy cách thức tốt nhất đó chính là cung cấp một hộp combo để cho người dùng có thể lựa chọn được địa điểm của mình. Cách thức bố trí trong thực đơn đó chính là các địa điểm có nhiều người đóng góp nhất và thường xuyên được chọn thì sẽ được bố trí lên trên đầu. Trong khi đó thì các vùng miền còn lại sẽ được sắp xếp theo bảng chữ cái. Với cách bố trí như vậy thì Thành phố Hồ Chí Minh và Hà Nội là hai địa điểm được xếp ngay tại vị trí đầu tiên, tiếp theo sau đó chính là ĐBSCL. Bắt đầu từ An Giang trở về sau thì các địa danh được sắp xếp theo vần chữ cái. Việc sắp xếp theo vần sẽ giúp cho người sử dụng có thể nhanh chóng và dễ dàng chọn được địa điểm của mình mà không mất nhiều thời gian. Hơn nữa trong quá trình chọn sẽ ước lượng được vị trí cần phải chọn. Hình 3. 2. 8 Giao diện của trường chọn tỉnh, thành phố Tiếp theo chúng ta sẽ xem xét đến trường cuối cùng. Đó chính là hình thức quyên góp. Người dùng có thể cảm thấy bối rối khi mà không biết hình thức quyên góp sẽ là như nào. Thay 153 vào đó chúng ta đưa cho người dùng các lựa chọn để người dùng có thể có những lựa chọn cho mình. Khi các lựa chọn đến đâu sẽ có một 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 khi tất cả các lựa chọn đã được hoàn tất thì người dùng có thể có chọn một trong hai nút Đóng góp và Huỷ để tiếp tục thực hiện các thao tác của mình. Hình 3. 2. 9 Giao diện của trường quyên góp 3. 2. 4. Cách thiết kế cho trang những tấm lòng nhân ái Trang này nhằm mục đích cung cấp cho người dùng những tấm long nhân ái, những việc tốt và người tốt giữa đời thường. Tuy nhiên do có rất nhiều lĩnh vực cần thể hiện nên cách tốt nhất vẫn là phân chia thành các danh mục nhỏ đồng thời đối với mỗi danh mục nhỏ lại phân chia thành các danh mục nhỏ hơn. Hơn nữa cách bố trí theo chức năng như vậy có thể giúp cho người tìm kiếm có được một sự định dạng dễ dàng. Sau đây chúng ta sẽ xem xét giao diện thực đơn cho trang những tấm lòng nhân ái Hình 3. 2. 10 Giao diện thực đơn của trang những tấm lòng nhân ái Người dùng có thể lựa chọn các mục thông qua con trỏ chuột khi di chuyển các vệt sang. Nội dung và cách bố trí của các phần trong thực đơn cũng tương tự như các phần khác. 3. 2. 5. Cách thiết kế trang tìm kiếm Mục đích của trang này đó chính là tìm kiếm các hình ảnh hay hoạt động trong trang Web. Người dùng có thể điền các thông tin theo yêu cầu để có thể có được các kết quả 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 hơn với các kết quả tìm kiếm. Người dùng có thể lựa chọn một trong hai hình thức bằng cách nháy chuột vào ô cần tìm. Nếu như phần nào được chọn thì sẽ có một chấm nhỏ hiện lên bên cạnh phần đã được chọn. Hình 3. 2. 11 Giao diện trường từ khóa trong trang tìm kiếm 154 Sau đó còn có hai trường khác bao gồm là trường địa điểm và ngày tháng thì cách thức thiết kế vẫn tuân theo như những gì đã có ở các trường trên. Cả hai trường này đều thiết kế theo các hộp Combo để tránh được các sai sót từ phía người dùng, đồng thời cũng hỗ trợ để cho quá trình tìm kiếm trong các trường được nhanh nhất có thể. Trường ngày và tháng được thiết kế để sao cho người dùng có thể chỉ cần sử dụng chuột để có được các kết quả như mong muốn. Trỏ chuột chạy đến đâu sẽ có một đốm nhỏ chạy theo đến đó, đồng thời khi chọn ô đó thì kết quả sẽ hiện ra bên trên. Trường tiếp theo đó chính là trường địa điểm thì các địa điểm hay được sử dụng sẽ được xếp lên trên đầu tiên, còn các địa điểm tiếp theo thì sẽ được sắp xếp theo vần. Cách làm như vậy vừa rút ngắn thời gian tìm kiếm cho người dùng vừa tránh được các sai sót có thể có. 3. 2. 6 Cách thiết kế trang diễn đàn Đây là trang có chức năng để cho mọi người sau khi đã xem qua trang Web có thể đăng ký làm thành viên hoặc là nơi các thành viên cũ có thể cùng nhau thảo luận trao đổi và chia sẻ. Thông thường trong phần diễn đàn có rất nhiều các thông tin cũng như các mục khác nhau. Tuy nhiên chúng ta không thể nào thiết kế danh mục thực đơn quá dài vì như vậy sẽ làm cho người dung không thể bao quát được hết nội dung của thực đơn hơn nữa thực đơn quá dài có thể làm mất đi nội dung của các phần dưới. Theo cách bố cục cho trang chủ như hiện nay thì thực đơn sẽ bao gồm khoảng 5 mục, đó là những mục chung nhất. Con trỏ chuột di chuyển đến đâu thì sẽ có một vệt sáng di chuyển đến đó. Hình 3. 2. 12 Giao diện thực đơn cho trang diễn đàn Tiếp theo chúng ta sẽ xem xét các phần trong trang diễn đàn. Trước hết chúng ta sẽ vào phần đăng ký trong mục diễn đàn. Phần này có chức năng giúp cho người mới sử dụng trang Web muốn đăng nhập để có thể trở thành thành viên của diễn đàn. Do vậy cách thiết kế đó chính là thiết kế thành một mẫu điền để người dung có thể điền các thông tin của mình. Trong đó bao gồm có các trường sau họ và tên, ngày tháng năm sinh, địa chỉ và hộp thư. Cuối cùng là phần khả năng, đây là một dạng thực đơn có nhiều lựa chọn cùng một lúc. Người dùng căn cứ vào khả năng của mình có thể chọn một hay đồng thời một vài lựa chọn cùng một lúc. 155 Các trường họ và tên, địa chỉ và hộp thư là các đ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 vẫn được thiết kế như trên để đảm bảo tránh sai sót cho người dùng. Đối với mỗi trường mà yêu cầu người dung nhập từ bàn phím thì nếu như người dùng không nhập hay nhập sai thì sẽ có một 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 nào thì quá trình nhập của người dùng là chính xác. Dòng chữ thông báo được thiết kế mầu đỏ nằm ngay bên cạnh trường không có sự chính xác trong quá trình nhập để người dung có thể xác định nhanh chóng lỗi cần tìm trong quá trình nhập. Thông báo có thể hiện lên bất cứ nơi nào nếu như trường đó không thỏa mãn. Nếu như có hai trường không thoả mãn thì có thể hiện lên đồng thời cả hai thông báo. Hình 3. 2. 13. Giao diện của trang đăng ký thành viên. Tiếp theo đó là phần thảo luận. Nội dung của trang thảo luận được bố trí thành các mục tin, trong đó có hình ảnh và nội dung của bài viết. Nếu như người dung muốn vào thảo luận một vấn đề nào đó thì có thể ấn vào đường dẫn hoặc vào đường dẫn xem thêm để có thể hiện lên toàn bộ nội dung của trang cần hiện. 156 Hình 3. 2. 14 Giao diện của trang thảo luận Sau đó nếu như người dung ấn vào một đường dẫn nào đó thì toàn bộ thông tin chi tiết của bài đó sẽ được hiện ra. Cùng với nội dung của bài viết đó thì toàn bộ các lời bình luận hay góp ý của trang đó cũng sẽ được hiện ra ở phía dưới. Các lời bình luận được sắp xếp theo thứ tự từ cũ đến mới để giúp cho người sử dụng có thể theo dõi một cách dễ dàng và nhất quán những lời bình luận. Ngoài ra trong phần nội dung của trang thì có một số phần có sự liên kết đối với các trang khác thì để tiện cho người sử dụng thì trong đó có thiết kế một số các đường dẫn để cho người dùng tiện khảo khi cần thiết. Cách gắn đường dẫn vào nội dung của trang Web như vậy đảm bảo tính đầy đủ và dễ đọc cho người dung. Hình 3. 2. 15 Nội dung của trang thảo luận Cuối cùng của trang là phần để cho người dùng có thể gửi các bình luạn cũng như phản hồi của mình. Cách thức như vậy làm tăng tính tương tác giữa người dùng và trang Web. 157 Hình 3. 2. 16 Bình luận của người dùng 3. 2. 7 Cách thiết kế trang liên hệ Đây là phần cuối cùng trong diễn đàn với mục đích cung cấp cho người dùng các thông tin cần thiết để liên hệ với người quản trị. Do vậy các thông tin phải được trình bày một cách ngắn gọn và cô đọng một cách hết sức để cung cấp cho người dùng nhiều nhất các thông tin trong một khoảng thời gian ngắn nhất có thể. Trong trang này có thiết kế thành các trường khác nhau để người dùng có thể điền các thông tin cần thiết rồi sau đó gửi đi. Hình 3. 2. 17 Giao diện của trang liên hệ. 3. 3. Kết luận Các lỗi trong HCI nói riêng cũng như trong các ngành khác nói riêng nói lên một điều rằng còn rất nhiều vấn đề trong cách thức thiết kế của chúng ta. Các lỗi về thiết kế như tính khó hiểu, sự không rõ nghĩa hay nhầm lẫn có thể xuất hiện ở bất cứ đâu và lặp lại nhiều lần. Hậu quả của sự nhầm lẫn này có thể tùy thuộc vào từng trường hợp từ đơn giản như mở tủ lạnh hay các phím chức năng cho đến các vấn đề như điều khiển máy bay. 158 Thiết kế một giao diện tốt phải bao gồm có rất nhiều các vấn đề khác nhau từ phông chữ, khoảng cách chữ và dòng, biểu tượng... đều ảnh hưởng rất nhiều đến quá trình tưong tác. Các thiết kế không chỉ đơn giản về mặt kĩ thuật mà còn có rất nhiều các yếu tố khác nữa. Điều đó đòi hỏi chúng ta cần có nhiều nỗ lực hơn nữa để kết hợp các yếu tố đó lại với nhau. 159 KẾT LUẬN 1. Những kết quả đã đạt được: Cách thức xử lý thông tin trong bộ não của con người luôn luôn là một vấn đề vô cùng khó khăn. Để hiểu được các cơ chế hoạt động của bộ não, chúng ta còn phải cần nhiều hơn nữa những sự phối hợp liên ngành của các môn khoa học khác nhau. Giải quyết được vấn đề đó quả thực là không hề đơn giản tuy nhiên những kết quả đem lại có thể giúp ích cho chúng ta rất nhiều.Giác quan của con người luôn luôn đóng một vài trò quan trọng trong nhận thức của con người, trong tất cả các quá trình tương tác với xã hội. Giác quan của con người càng nhạy bén bao nhiêu thì khả năng hấp thụ thông tin càng lớn bấy nhiêu và đi cùng là tăng cường khả năng nhận thức. Trong quá trình tìm tòi và nghiên cứu, tôi đã hoàn thiện luận văn với những mục tiêu đã đặt ra ban đầu, cụ thể đã đạt được những kết quả sau đây: - Giải thích cơ chế xử lý thông tin trong bộ não và sự tăng cường nhận thức của con người thông qua thị giác. Việc giải quyết được các vấn đề trên sẽ giúp chúng ta hiểu dược phần nào cách thức hoạt động của bộ não trong quá trình nhận thức của con người. Mối quan hệ giữa thị giác và bộ não trong các hoạt động của con người. - Giải thích sự đa dạng trong nhân thức của con người trên hai cấp độ cá nhân và đám đông. Cá nhân thường liên quan đến các vấn đề sinh học, đám đông thường liên quan đến các vấn đề về xã hội. Điều này có thể giúp cho chúng ta có được sự lý giải cho các hành động khác nhau của con người. - Nghiên cứu các 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ác cách tương tác này chúng ta hiểu rõ hơn về các kiểu tương tác và cách thiết kế một giao diện phù hợp. Việc thiết kế một giao diện tốt đòi hỏi nỗ lực rất lớn của các nhà thiết kế để có thể thu được những kết quả tốt nhất. - Chỉ ra các lỗi trong HCI trong các thiết kế giao diện của các chương trình phần mềm. Các lỗi về thiết kế như tính khó hiểu, sự không rõ nghĩa hay nhầm lẫn có thể xuất hiện ở bất cứ đâu và lặp lại nhiều lần. Hậu quả của sự nhầm lẫn này có thể tùy thuộc vào từng trường hợp từ đơn giản như mở tủ lạnh hay các phím chức năng cho đến các vấn đề như điều khiển máy bay. - Thiết kế một giao diện cụ thể để minh họa những kết quả đã đạt được ở trên. Việc thiết kế giao diện tốt phải bao gồm có rất nhiều các vấn đề khác nhau từ phông chữ, khoảng cách chữ và dòng, biểu tượng... đều ảnh hưởng rất nhiều đến quá trình tưong tác. Các thiết kế không chỉ đơn giản về mặt kĩ thuật mà còn có rất nhiều các yếu tố khác nữa. Điều đó đòi hỏi chúng ta cần có nhiều nỗ lực hơn nữa để kết hợp các yếu tố đó lại với nhau. 2. Hướng nghiên cứu tiếp theo của đề tài: Về lý thuyết: 160 - Tiếp tục xem xét kĩ lưỡng hơn nữa cách thức xử lý thông tin trong bộ não của con người trong đó có liên kết đối với các ngành khoa học khác để có thể giải mã các hành động của con người ở cả hai cấp độ cá nhân và tập thể. Mở rộng hơn nữa để nghiên cứu các thực nghiệm cụ thể để có thể rút ra được các kết luận cụ thể. - Nghiên cứu các 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 các kiểu tương tác khác đang trở nên phổ biến hiện nay. Có sự liên kết hơn nữa giữa các hoạt động của con người đang trong quá trình tương tác với các cơ chế hoạt động và trao đổi thông tin diễn ra trong bộ não của con người. Về chương trình demo: - Hoàn thiện trang Web thông qua các phần lý thuyết ở trên, trong đó ứng dụng nhiều hơn nữa các kết quả lý thuyết đã thu được để có thể thiết kế được một giao diện tốt và 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 Urbana- Champion, 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.

Các file đính kèm theo tài liệu này:

  • pdfLUẬN VĂN- ỨNG DỤNG YẾU TỐ CON NGƯỜI VÀO TRONG TỔ CHỨC HCI.pdf