Applying Cognitive Walkthrough to Evaluate the Design of
Contents
1. 5 Evaluation can be done by system designers in the early stages of design before running the Empirical testing 2 According to 5 a Cognitive walkthrough to evaluate usability is a combination of software exploration and the cognitive learning model that can be explored It is a theory structured evaluation process that included in a set of questions in the questionnaire 6 Each item was built to focus the designer observation and individual aspects that help to make implicit decisions to solve problems 8 Journal of Convergence Information Technology JCIT Volume7 Number4 March 2012 doi 10 4156 jcit vol7 issue4 13 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah The cognitive walkthrough methods involves one or a group of respondents whose selected from a particular background to test or explore self Exploration the usability of interface design in an application system 7 A design evaluator is normally the experts interface designers or any other developers who have collaborated in the design and development processes 8 The Cognitive walkthrough method was carried out on systems that have not been fully completed working state or the mock up system It was conducted to improve the weaknesses in terms of user s understanding and acceptance of the interface design approach Each part that does not give understanding to the2. application remotely Form fill in e The efficiency of database can be enhanced so that o Admin can control all sets in the courses o The courses can be searched via keyword o Student can send personal email to each question answer and e Student can access a complete set of lecture notes through the fast download query dialogue feature e There is a menu that allows transferring lecture aid to the new semester WIMP Interface e Add the information of o Time o Building name and label o Consistency of language used Table 3 describes the findings on how to improve the usability by reorganize information on SPIN interface The misunderstanding can be resolved by removing unused features like launch learning objects and communication Use the pull down to display a full list of faculty names clearly not just use the acronym alphabet only Consumerism manipulation and form filling are inter related because it involves a visual guide Menus or functions that allow administrators lecturers should be provided to facilitate the manipulation of the content Users can manipulate features such as answering quiz questions via the interface and SPIN database will generate and display the results on the interface WIMP interface should be clear by adding a label clock icon to show time and consistent use of language 3 1 3 Findings Research on initial idea exploration and discovery process with users produces the conceptual design of the SPIN inte
3. user will be identified and improved According to 9 there are three procedures for the implementation of cognitive Walkthrough methods firstly to explain briefly about the users who will test the system and their academic background Secondly describe the tasks to be tested on the system specifically Finally a list of tasks for user to complete the assignment 3 SPIN Interface Design SPIN interface design is based on the conceptual design model that has been produced by 10 which involves explicitly the idea or the concept of user interface display Conceptual design model covers the SPIN interface interaction style Table 1 shows the interaction style issues being investigated along with a description of the interface SPIN Table 1 Interaction styles issues Interaction Style Issue Task Command line languages Users interact with the computer through the use of the language provided by typing commands in SPIN applications using the keyboard keywords or instruction word Menu Use of the SPIN interface menu such as pull down menu pop up menu or menu hierarchy Direct manipulation Manual control icons or graphic objects that can be controlled by the user such as drag and drop objects drag and drop and the mouse pointer Form fill in Users using the notification area or discussion and chat boards to communicate Question answer and query SPIN users communicate with the applications via the search dialog box to dialogue create a que
4. 2 numbers marein e Course accessibility Improve the d e Add space for the visual pee iar through keywords interface by the z information Can access mobilit e Can email individually or in labels and icons a e Specify the status of the view y groups L profile y 2 e The complete note uploaded through the fast download e There is a menu unction transfer lecture notes e Need a legend e Show full details Figure 1 Research Schematic Structure 3 1 4 Low fidelity Prototype A mock up interface design was developed as a low fidelity prototype to accelerate the development process iteratively The purpose of SPIN interface is to implement the conceptual model that has been produced SPIN interface emphasizes on design and button as required in the conceptual design model Figures 2 to 7 are some examples of SPIN interface which have been developed The interface represents the lecturers UKM staff selection on courses activities profile and lecture notes a i a a mm irr T ps e T cpa j e E Uain Kinexcouns Munn sejm Ti ae aoe SISTEM PENCURULAN PINCAJARAN PEMALLAIARAM INTERAKTO cc popdiameeayhisianane Ley Minauk le iesesl frapns Bastia sete Ashen fae oe a DON i a e amim tee e a ee AL Parri e a i 5 g 2 Figure 2 SPIN main interface Figure 3 UKM staff profiles interface Figure 2 shows SPIN main interface that contains three buttons which are lecturers students and user manual U
5. Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah Sahari Ashaari School of Information Technology National University of Malaysia 43000 Bangi Selangor Malaysia tsm hazura hmj nsa ftsm ukm my Abstract This study focuses on cognitive methods Walkthrough to measure the usability of SPIN interface design SPIN is an interactive online teaching and learning system that can be accessed by lecturers and students of Universiti Kebangsaan Malaysia UKM through internet The existing SPIN interface design is difficult to access because of the different user interaction styles when browsing information on SPIN A low fidelity prototype to the new SPIN interface was designed based on the design of conceptual models that have been produced Walkthrough cognitive methods applied in this study involving a small group of professional designers and developers to evaluate the prototype interface design new SPIN Result of this study is a prototype of SPIN high fidelity interface which can be accessed by multiple groups of users Keywords cognitive walkthrough design interface usability evaluation 1 Introduction A cognitive walkthrough method becomes an important aspect of this study to measure t
6. a choice of courses to be seen and clicking on the selection of courses is displayed After entering a page that represents a course the user s attention will focus on the menu list on the left of the page In Menu USER MANUAL the user will press the icon to download the SPIN user guide which is provided in PDF format To exit the system user will choose the YES or NO button at the LOG OUT menu 8 Generally the user s responses to all buttons or a direct hypertext links provided on each page will be observed It is to ensure the accuracy of each design and reflects the functions they represent 4 2 Analysis and findings Table 4 shows the results of cognitive Walkthrough methods conducted on students and lecturers for the evaluation of the initial design of the SPIN prototype Each of the lecturers and students to respond either agree or disagree with the design of the interface that has been developed based on the arrangement of features designed as a percentage Most of the features developed satisfy by both categories of participants In terms of color features all students agree with all color attributes while 33 33 and 66 67 lecturers agree with the background and button colors respectively 66 67 of lecturers agree on calendar and expiry session of the SPIN while none of the students show their agreements 112 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Moha
7. action styles The list is compiled based on the duplication of information Interaction Style Issue Command line languages Menu Direct manipulation Table 2 User s reaction and suggestion Lecturer s Opinions and Suggestion e Different instruction for each set confused the user e Need to enter a complete staff identification number for login differ from other UKM information system e Not able to access all student emails in the course taken e Features such as quizzes tutorials training and project can only be viewed but not manipulated Student s Opinions and Suggestion e The information display did not specify status of students either undergraduate or graduate and their semester Does not understand the abbreviation used for faculty in the pull down menu Unable to update student profile except for mobile phone number and email address Students are unable to browse information remotely Feature Launch Learning Objects amp communication is displayed but left unused Admin unable to access all sets of Sometimes an announcement from other group teaching aids lecturer which is not related to the course e Courses cannot be search by appears on the screen keywords Student unable to send email to each other individually except to those who register for the course Feature fast download unable to download a complete set of lecture notes Form fill in Quest
8. dge Domain Visualization In Proceeding of the IEEE Symposium on Information Visualization Drexel University 2005 4 John B E and Packer H Learning and using the cognitive walkthrough method A case study approach In Proceedings of CHI 95 ACM New York pp 429 436 1995 5 Storey M A D and Muller H A 1999 Cognitive design elements to support the construction of a mental model during software exploration The Journal of Systems and Software Vol 44 171 185 114 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah 6 Rizzo A Marchigiani E and Andreadis A The AVANTI Project Prototyping and evaluation with a Cognitive Walkthrough based on the Norman s model of action In Proceeding of the Conference on Designing Interactive Systems 97 ACM Amsterdam 1997 7 Rieman J Franzkc M and Redmiles D Cognitive Walkthroughs A Method for Theory Based Evaluation of User Interfaces In Proceeding of the Conference on Human Factors in Computing Systems ACM USA 1995 8 Sung Heum Lee Usability Testing for Developing Effective Interactive Multimedia Software Concepts Dimensions and Procedures Educational Technology amp Society vol 2 no 2 1999 9 Mowat J Cognitive Walkthroughs Where they came from what they have become and their application to EPSS design The Herridge Grou
9. he usability of SPIN interface design which was developed through a mock up of low fidelity prototype SPIN works to help lecturers to interact with virtual students through interactive teaching and learning Among its functions upload download learning materials such as tutorials quizzes exercises projects and lecture notes communicating through emails conversations and discussions announcements and information display Each pages of SPIN interface has links to each other and many more teaching and learning features that involves two users Cognitive walkthrough exercise which has been carried out is focusing on user s mental operations manual and not the interface design characteristics Problems can be identified with more specific because it can connect user to the cognitive process features available on the interface 1 Cognitive walkthrough methods do not require the development of a fully functioning system it is implemented in the preliminary stage to save on repair costs that might be occurred in future 2 and 3 The objective of this study is to carry out the cognitive methods during the initial stage of redesigning the SPIN interface based on the requirements that have been discovered with students 2 The Cognitive Walkthrough The cognitive walkthrough methods have been implemented since 1990 4 this method evaluates user interface design that gives detailed attention to support an interface of a survey exploratory learning
10. igh fidelity prototype Among the suggestions are to improve the prototype color font and expiry session criteria Regarding colour criterion the prototype should use UKM corporate colour and should follow the standard guidelines in text colour The designer should differentiate font on text and hyperlink and follow font standard guidelines For expiry session criteria participants suggest that enough time should be estimated 113 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah Table 5 Improvement Suggestion Criteria Description Proposed Improvement Colour 1 A blue background to display information Use UKM corporate colour 2 Text Follows standard guidelines in text Font 1 Font type on text Differentiate font on text and hyperlink 2 Font on hypertext Standardize font for other criteria Button 1 Used of image as a button Icon can be clicked to redirect with hypertext Calendar 1 Remain unchanged To remain Interface 1 Used of colour Customize colour according to user group lecturer student Expiry 1 Automatic logout if no cursor movement Estimate enough time Session Icon 1 Animation on icon Minimal animation zoom in and hover the cursor Menu 1 Change of font colour when hover the cursor Change combination of colour to List be more contra 2 Differentiate between hypertext and hyperlink Remain the format for hyperlink to avoid c
11. ion answer and e Only document for the particular query dialogue semester can be accessed Any lecture notes or item transfer is quite complicated WIMP Interface e Information displayed include the calendar but with no time Information on lecture hall without the building details Inconsistent used of language all topics are in English but the courses name are in Malay As shown in Table 2 there is much confusion on the display of content which led to difficulties for user to access the information on SPIN The language used for instruction is inconsistent and unclear as the selection set in the course Pull down menu is used to view faculty has increased consumer confusion because the acronym used is not provided with a description SPIN applications are not flexible because users can not directly manipulate information such as student email information will not be shown for the lecturer to contact the desired student and administrator cannot reach all the set of courses in the teaching group Features Launch Learning Objects amp communication has no function However the WIMP interface style of interaction is not a problem faced by the lecturers but students who are confused about the information display on lecture classes and language used on the courses offered 3 1 2 Discovery Process Discovery process is the second cycle after the input from the initial idea of exploring phase Users are divided into a group of four c
12. med Hairuliza Mohd Judi Noraidah Table 4 Percentage of interest on design criteria Criteria Description Lecturer Student Colours 1 A blue background to display information 33 33 100 2 Text 66 67 100 3 Hypertext button 100 100 Font 1 Font type on text 66 67 66 67 2 hypertext font 66 67 66 67 Button 1 Used of image as a button 100 100 Calendar 1 Remain 66 67 0 2 Permanent at each page 66 67 0 Interface 1 layout consistency on each features 100 100 2 Layout design 100 100 3 Used of colour 66 67 66 67 Expiry 1 Automatic logout if no cursor movement 66 67 0 Session Icon 1 Help user to understand the function of button 100 100 2 Icon can be selected with hypertext 100 100 3 Animation on icon 33 33 100 Menu 1 Location on layout 100 100 Selection 2 Used of colour 100 100 Menu List 1 Location on layout 100 100 2 Change of font colour when hover the cursor 0 66 67 3 Hide and click to show 100 100 4 Differentiate between hypertext and hyperlink 66 67 100 Feature 1 Announcement will be deleted automatically 100 100 2 Quizzes 100 100 3 Questions Bank 66 67 66 67 4 Discussion Board 100 100 5 Pending subject 66 67 0 6 Viewers counter 100 0 7 Upload file 100 100 8 Status can be change from online to offline 100 100 Based on the cognitive walkthrough exercise some suggestions for improvement have been proposed by participants Table 5 shows the suggestions pertaining features that should be considered in developing a h
13. ngku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah Phase 2 Will the user notice that the correct action button 1s available Users find the option buttons or objects to click or the space to insert text Example Login button text field hyperlink link Phase 3 Will the user associate the correct action with the effect to be achieved Users choose a task that they understood and try to explore the system Example fill in the space text field and password to log into the SPIN system Phase 4 If the correct action is performed will the user see that progress is being made toward solution of the task Users do task and describe how the SPIN system response for the request Example Pressing the Log in button and access to the next page 4 1 1 Procedures Sequences of specific tasks performed by users during the cognitive Walkthrough session are as below l 2 3 6 We Enter the ID along with their password on the main page and press login button on SPIN system After login users will see a lot of hypertext selection in the Menu Bar and will explore the pages randomly In HOME menu the user will scan all the notifications listed Users will route the cursor to find out whether it can re direct to another page or not In the PROFILE menu the user will see the list of the menu list on the left side of the page and press each button to find out more information In Menu COURSES users will find
14. ombining lecturers and students The technique used was brainstorming through the workflow model and analyze the interface SPIN session The time allocated 108 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah is 30 minutes Work flow model is based on interaction style issues that have been analyzed in the first phase The SPIN interface analysis session began with an interactive brainstorming within groups Everyone in the group play a role to give opinions and to record findings 3 1 2 1 Discovery Process Analysis Table 3 below shows the analysis and the output gathered by users during the brainstorming session Table 3 User s suggestion Interaction Style Suggestion Issues Command line e The usability in terms of information delivery can be improved such as languages o Flexible used of staff number or the last four digits to enter the SPIN application o No need to create an additional set into the timetable to visualize it o Indicate the status of students in the feature view profile Menu e There must be a legend for each letter stands for or e The full list of faculty names in the menu pull down Direct manipulation e The usability in terms of information delivery can be improved such as o Display registered students emails hierarchy o Features displayed to help user to control the information o Student can access SPIN
15. onfusion Feature 1 Announcement will be deleted automatically on Remain as in the old format certain timeline 2 Upload file Add in few more categories notes tutorial exercises etc 5 Conclusion The SPIN interface design can be developed iteratively through the implementation of cognitive Walkthrough method Evaluation resulted from the SPIN interface prototype can help to improve the weaknesses of this study in terms of lecturers and students understanding and acceptance of the actual interface design approach Cognitive Walkthrough method can also help to ensure the SPIN interface design meets the user mind mapping model which identifies part of design that usually being misunderstood by lecturer and student 6 References 1 Blackmon M H Polson P G Kitajima M and Lewis C Cognitive Walkthrough for the web In Proceeding of the Conference on Human Factors in Computing Systems Polson et al Kitajima 1992 ACM USA 2002 2 Green T R G Burnett M Ko A J Rothermel K J Cook C R and Schonfeld J Using the Cognitive Walkthrough to Improve the Design of a Visual Programming Experiment In Proceeding of the 2000 IEEE International Symposium on Visual Language VL 00 IEEE Computer Society USA pp 172 2000 3 Allendoerfer K Aluker S Panjwani G Proctor J Sturtz D Vukovic M and Chaomei Chen Adapting the Cognitive Walkthrough Method to Assess the Usability of a Knowle
16. p Inc pp 6 12 2002 10 Tengku Siti Meriam and Siti Salwa Salim Exploring children s requirements for the graphic design of WebOPAC 14th International Conference Lecture Notes in Computer Science 6764 Springer Verlag USA pp 627 63 2011 11 Moraveji N User interface designs to support the social transfer of web search expertise SIGIR 2010 Switzerland pp 915 12 Jiagen SHENG Sifeng LIU A Knowledge Recommend System Based on User Model JDCTA International Journal of Digital Content Technology and its Applications Vol 4 No 9 pp 168 173 2010 13 Gu Zhenyu He Yan Li Nan A Case based Green Design Support System for Customization Product AISS Advances in Information Sciences and Service Sciences Vol 3 No 10 pp 176 183 2011 115
17. rface which represents by a mind mapping of information architect and user The SPIN conceptual design helps to reorganize the information RP method is used to get the right mind mapping model which is in accordance with user requirement Figure 1 shows a schematic structure of the research conceptualization There are three levels 1 Six styles of user interaction on SPIN interface 2 Summary of user reaction and opinion on the SPIN interface interaction style by category 3 Summary of users suggestion to support their reaction and opinion 109 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah SPIN INTERFACE o 2 v v 7 7 v v a a Command line Direct Wi Question answer and WIMP B languages MAE manipulation Tidi ai query dialogue Interface L c z oe e Confusing e Features can not be Display ao Oo o g Instruction controlled Restructuring Poor access incomplete oS g e Inconsistent e There are features that Inefficient database document document Cs Instruction do not work 2 Of Sm Menu is not clear i l T e Flexible use of employee Brovde a feature e Can control the course set
18. ry to access information in the database WIMP Interface Users are more comfortable using WIMP windows icons menus and pointers pull down menu while accessing SPIN 3 1 Conceptual Design Method Participatory design method PD 11 is used to develop the conceptual design of the interface SPIN model involving lecturers and students as partners carried out in iterative design It involves two phases namely 1 explore the idea of early 12 initial Exploration of work and 2 discovery process 13 3 1 1 Explore Initial Idea Exploring the initial idea involves six users which are three lecturers and three students The purpose of this phase is to get consumer reaction and opinion on the use of SPIN applications The technique used is observation and interview which took 15 to 20 minutes per person Before starting the session the user is given a description of the research objectives and their role as design partners Next they were given the below task Task Lecturer student 1 upload download the lecture notes 2 deliver announcements or instructions 3 implement the relevant features 4 communicate with students lecturers 107 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah 3 1 1 2 Exploring Initial Idea Analysis Table 2 shows the analysis and output of the reaction and views as the issue of consumer inter
19. sers can log into the system using either their complete employee number or the last four digits Figure 3 portrays UKM staff profiles users can update profiles change the picture and change the password options 110 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Tengku Wook Hazura Mohamed Hairuliza Mohd Judi Noraidah en eee y indberet 4 e i g ea ag amp T Linon m Armas Pe a s Nig ITA eer Kim Pt Ta Mia WIA J ETT id Pod Ad 4 7 I 4 Ff LR ry i hu Wati i reifi i ride TM PORGUE PMCAJAR AS amp POLO AAR AN B ELRAS TI LAA TM ACES FLALAAN FERMI LALAHAN INTIBAR TI Cu Figure 4 Courses profile interface Figure 5 Lecturers profile interface Figure 4 illustrates the courses profile a clear label on the icon describes information on the course Lecturers are able to manage the set of courses easily Figure 5 shows the lecturers profile can be easily updated i n a m on i J b Lisni iai Kui LINT EAAS Wha es Lii AT K FACS BAAN Aa WIA 4 r z i Fiar Weil Lairar if AaLi ther Ai r L siy bialn SETIM FOSGUELLAN FINGAJABAN amp FIMEDLAJARAM NTERARTE P UTEM PLRGUEULA FPCNCALALAN amp PCMECLALARAN INTDRAKTIO CURA Figure 6 Upload course interface Figure 7 Activities interface Figure 6 shows an interface to upload the course using friendly icons and labels Lecturers can use the transfer function of the lecture no
20. tes before the new semester begins Figure 7 displays the activities interface which uses icons and labels as a communication tools between lecturer and student 3 1 5 Summary Interface design with the high accessibility is important because it is user friendly and ready for use by all users including people with disabilities Interface design must have a balance usability features in terms of functions and the information contained herein 4 Cognitive walkthrough evaluation The purpose of cognitive walkthrough evaluation is to improve the SPIN interface design terms of user acceptance and understanding of interface design approach Results of this research will help to develop a high fidelity prototype as a final product Interface design that does not help much on users understanding will be identified and enhanced 4 1 Methods The cognitive walkthrough method involves the subject matter experts as participants three lecturers and three graduate students work together to give comments and critique of SPIN interface design Specific tasks to be carried out by the participants through the four phases of the evaluation process are Phase 1 Will the user try to achieve the right effect Users will decide their objectives when using the SPIN interface Example Reading information available on the screen to understand the system goal 111 Applying Cognitive Walkthrough to Evaluate the Design of SPIN Interface Tengku Siti Meriam Te
Download Pdf Manuals
Related Search