Assignment 8 Interactive prototype #2

By Haydee Hernandez, Qun Liang, and Hailing Jiang

[Major changes in UI design | Prototype overview | Addressing Heuristic Violations ]

Major changes in 2nd interactive prototype

The second interactive prototype only went through three major changes based on the violations with severity ratings of 3 or higher. In general, violations that received a rating of 2 or below mainly dealt with aesthetics or Web novices. The group feels comfortable enough with the general layout and positive user reactions not to change anything there. The group also feels that it only needs to minimally support Web novices, because we do assume that most KM novices, as business professionals, will have had moderate experience surfing on-line. As such, they should be familiar with how to conduct a search or even how to use an image map. But for those few users that have no Web experience, we have provided text links on the home page to all the web pages within our site, including the Help page. The help page also has information for people unfamiliar with image maps to show users how to navigate with them.

Addition of a Glossary

To address the problem of technical terms brought up by Heuristic Evaluation, we added a Glossary to the Resources page. Users can now see common KM terms and their definitions. Users can browse the KM bibliographic records held in Gotcha library by clicking the hyperlinked and boldtyped terms. See updated Resources page.

Improving search process

Suggested by HE results, we added a heading for search box, that says "Enter your search below: (Please put quotation marks around a phrase)".
In query enhancement, the suggested terms are linked back to their definition, if one is available in the glossary. This feature helps users understand terms and make decisions on choosing the appropriate terms to add to the queries. Lack of time prevents us from writing terms for each and every term in the thesaurus so only the most commonly used have been defined.
JavaScript has been employed in a novel way on the Search page and on the Query Enhancement page if a user's browser supports Java Script. When users mouse over most hyperlinked words on either of these pages, a new window pops up with the information. It disappers once the user finishes mousing over. This is helpful for viewing definitions when users only want to quickly view this information and not worry about opening and closing windows. The only window that stays open after mouse over is the Search Tips window, because the quantity of information in the window cannot be digested in a few seconds. Browsers that cannot support Javascript will simply open a new window when a hyperlink is clicked.
The search results page now draws results from all the domains listed on the search page, and the way the results are displayed has addrssed the usability issues raised by the evaluators, e.g, including total number of results, eliminating the search engine's URL, and more helpful information chunking. Also, it shows the subject descriptors manually assigned to the records held in the Gotcha library catalogue, and the user can view available Gotcha library records about a specific subject in a separate window simply by clicking the hyperlinked term. An additional feature is to allow users to enhance their previous query by clicking the GO! image on the results page.

Creation of a help page

For the 1st interactive prototype, we used a dummy help page. We now have a real help page with brief information on how to navigate the site (including a sitemap) and how to conduct searches. See help page.

Prototype overview

The user interface is comprised of 15 web pages on the Gotcha web site. The table below shows that the site is relatively flat with no page more than two levels deep (excluding users conducting a search which would be no more than three levels deep to present search results). The topmost pages are always available to users in the form of an image map at the top of each page which looks like tabbed folders. The children of topmost pages are accessible by clicking the desired selection from an image map in the left hand blue column. The only exception is on the search result page, where many of the hyperlinks generate web pages on the fly based on JavaScript or Perl programs.

Topmost Pages	Home	About KM	Resources	Products	Search	Help
Children		Gurus Other notables	Web sites Periodicals Professional Orgs Case Studies Reading List Glossary		Tips Results (on the fly) Enhancement (on the fly) Term Definition (on the fly)

Addressing Heuristic Violations

The table below explains how we addressed the heuristic violations found in the Gotcha interface that received a severity rating of 3 or higher.

Violation	Gotcha Response
H2. Match system to real world Search results page - last line of each result shows a URL and then a list of search engines within parentheses - what does this mean? How does the user use this? We suggest that some explanation of the search result structure will be provided to the users	The list of hyperlinked search engines have been deleted to avoid confusion and minimize unnecessary information on the page. The hyperlinks originally were set to allow users to see all the results of their search grouped by the selected search engine.
H3. User control and freedom Let us suppose the user clicks on the topic 'Who are the gurus?' on the page 'About KM' and having read that information wants to revert back to the page 'About KM'; the system does not allow that and the user has to click at some other page like 'Home' and from there click on 'About KM' again. This is an unnecessary step.	Fixed. The image map now allows users to click the "About KM" tab to return to that page.
H3. User control and freedom Use frames so that the people can always navigate to a different place in the interface (That means that the menu should always be visible)	The group consciously chose not to use frames in order to simplify user bookmarking.
H3. User control and freedom Show how many matches where found. This gives users some control and indication of the quality of the search.	Fixed. The search results page now lists the total number of hits.
H4. Consistency and Standards There needs to be a way for users to determine what is selectable and what is not. A different color maybe a solution or the convention of an underline	Most users with moderate experience on the Web are familiar with image maps and how to use them. Even though we haven't changed the design itself we have added text links on the home page and an explanation on how to use the image maps on the help page. This should be sufficient help for Web novices.
H4. Consistency and Standards The use of the term "GO" to perform the search is unclear. Standard terms like "Search" may be better	The group feels that the term "Go" is used in enough on other sites that most users will be familiar with the terminology. In addition, users who simply press the "Enter" key will automatically submit their query.
H4. Consistency and standards On page 'About KM', if the user clicks on any topic like 'What is KM?' the system shows the relevant topic. But if user clicks on the topic 'Who are the gurus?', and then clicks on some other topic, the system cannot find the relevant page. This is probably a programming error.	The group could not recreate this. The image map worked fine when we tested it so we didn't have anything to fix.
H5. Error prevention Suggest placing the (Please put quotes around a phrase) above the field to avoid errors before filling out the complete field.	The phrase "(Please put quotation marks around a phrase.)" was placed above the search box.
H6. Recognition over recall Search Tips Page - it is not obvious to the user that to return to the Search page, all you need to do is click on the Search Tab at the top. Recommend putting a line at the bottom of the page telling the user how to return to previous page. I wasn't sure which page I had come from and thought it was the Search page since it was still highlighted.	A hyperlink was added to the bottom of the Tips page sending users back to the Search page.
H6. Recognition rather than recall The search criteria box (where a user is supposed to enter the search) is not marked.	The search criteria box has a heading that now says "Enter your search below: (Please put quotation marks around a phrase.)."
H7. Flexibility and efficiency of use Support different type of users. For example some users may want to view the results in a short format and not the long format.	More coding needs to be done to provide both formats in the next iteration, for now, a long format has been universally adopted.
H8. Aesthetic and minimalist design On the pages 'About KM' and 'Products', the amount of information provided is too voluminous and irrelevant. For example, on a 14-inch monitor, the user has to press Page-Down key ten!!! times to read the contents of page 'Products'. It will be better to make the information more crisp and concise and organize it in sub-groups. And quoting subject experts is good practice in scientific journals, but may not be a very good idea on an web-page.	The list of gurus is being maintained because many users we interviewed asked for recommendations of reputable authors in the field. The "About KM" and "Products" pages are also being kept in their original format. Most parts would be too small to fill even one HTML page, making excessive mouse clicks to hyperlink around. When printed, the page count does not exceed five printed pages which is actually short. Plus, targets have already been placed on those pages to help users navigate around easily.
H8. Aesthetic and minimalist design The use of many graphics makes the use of the system cumbersome and slow. There should be less graphics in unnecessary places like menus (even though they may look nicer)	An image map in the left hand column was used because of hyperlink limitations. You can only have one color serve as a followed hyperlink color, which by standard convention is blue. No matter what text color we tried to set it to it would either be lost in the white background or in the blue background once the link was followed. Setting the image map solved that problem and allowed us to continue to use the standard blue color for followed hyperlinks.
H8. Aesthetic and minimalist design The results are presented in one continuous block. It is somewhat difficult to determine where one result ends and the next one begins. Try to separate each listing.	The search results are presented in multiple pages, and the user can traverse through the pages by clicking a results page number either at the top or bottom of the search results page.
H9. Error recovery Resources page - after looking at one of the topics to the left, there is no way to back out to the previous page. User must click on another topic or another tab at the top.	The group could not duplicate this violation. Since we couldn't find anything wrong we could not fix it.
H10. Help and documentation Many words are new technical concepts and need explaining. Recommend a dictionary of terms be placed on the page	A glossary has been added to the Resources section. Users can now see common KM terms and their definitions. In addition, when users enhance their queries the suggested terms link back to the definition, if one is available.