Filter Rabbit Final Report by wangning

Fall 2008â&#x20AC;&#x2122; SI 658 [Information Architecture]

Clint Newsom | Jennifer Faber | Ning Wang | Yesook Im

Table of Contents <Executive Summary>

<Recommendations and Conclusion> 6. Recommendations • Search: Current Search Engine and Recommendations • Navigation: Current Navigation Architecture and Recommendations • Wireframes: Front Page; Search Results 7. Conclusion

<Brand Context> 1. Brand Context and Target Audience 2. Discovery & Analysis <Research> 3. Competitor Analysis • Steelcase: corporate summary; current use of navigation and search • Haworth : corporate summary; current use of navigation and search 4. Heuristics: Using Jakob Neilsen's approach • Heuristics for Navigation and Search • Visibility of system status • Match between system and the real world • User control and freedom • Recognition rather than recall • Aesthetic and minimalist design 5. Research and Analytics • Personas • Persona Analytics • Visualization of Site Statistics • Current Search Engine Analysis

<References> 8. References

Executive Summary This report outlines the key issues to be considered in the redesign of HermanMiller.com. Our heuristic and user needs analysis revealed findability and navigation problems within and between Herman Miller's individual website modules. In the spirit of "bringing efficiency to the customer value chain" and "...ensur[ing] greater accuracy, reliability, timeliness, and effective communication…" (http://www.hermanmiller.com), Our strategy is to deliver recommendations directed to search engine architecture and navigation. The inherency of this problem lies in the idea that if navigation and search architectures fail the user, potential purchases are lost. Herman Miller helps people create great places to work. We feel the place for great work to begin is online.

Brand Context Brand Context and Target Audience Herman Miller has been in the furniture business since 1923. The brand is reputed and they have worked with many renowned designers over the years. They deal in the design, manufacture and distribution of furnishings and interior products, leasing, furniture management and facilities consulting. An innovator in the field, Herman Miller uses their research to remediate working, healing, learning and living environments. The corporation serves customers worldwide, maitaining operations in more than 40 countries. Their target audience includes local and global customers, high-end dealers and alliance partners, A&D firms, consultants, financiers, healthcare professionals and government. With such a large and disperse client base, the display and transfer of accurate data online is a critical part of business at Herman Miller.

Discovery & Analysis HermanMiller.com is a single website that features the company's products through specialized 'sites' or modules—the modules ostensibly being for different segments of the target audience. The website product pages are for product information, planning and visualization—it is an e-showroom, not an e-commerce site and purchases cannot be made online. Major competitors of HermanMiller.com are Steelcase.com and Haworth.com. A 'dealer locator' is provided for potential customers to find the nearest Herman Miller dealer. Also featured on the website are news and research articles, case studies and designer biographies. The website provides an internal parametric search engine to help users search the different modules. The website is an attempt to give the customer "a set of integrated tools to help them envision, create, and sustain great places to work.” (http://www.hermanmiller.com/CDA/SSA/Category/0,1564, a10-c379,00.html)

Our initial assumptions Our first impressions of HermanMiller.com were as follows: there is an overabundance of text and textual links; a lot of valuable information is located 'below the fold'. On product pages the user has to scroll several times to get the information at the bottom of the page. In general, we thought there should be more graphical information and less textual information. Further, it was hard for us to find products and information using the search engine—one has to know in advance what parameter to choose and there is no feedback or related terms given for a search term that has no results. So, we decided to take a closer look at what Hermna Miller's competitors do with their sites to see if we felt any better about their use of the Web.

Competitor Analysis 1. STEELCASE Corporate Summary Steelcase is an international furniture company, which was founded in 1912 in Grand Rapids, Michigan as The Metal Office Furniture Company, Steelcase at that time specialized in mainly file cabinets and safes. Today, the company sells products related to interior architecture, furniture and technology. For furniture, its products covers several fields domains such as business, home, government etc ... The Steelcase's website is a website in which users could acquire lots of information ranging from products details, research & services, store information to corporate informaiton. Current Use of Navigation Instead of having multiple sub sites like Herman Miller, Steelcase makes the user feel as if they are visiting a central site. There is both global navigation on the top and local navigation on the left bar. When a user is hovering over a global navigation tab, sub-menus will show up in a drop down list, which will give a user an overview of the content of that section in the global navigation. The left local navigation also does a good job in helping the users to browse inside a particular section of global navigation. The navigation of the product section is particularly a good design in that pictures are provided to facilitate the navigation of the products. The home page is clean and focused compared with HM site. It is a good example of minimalist design. Current Use of Search The search box is placed globally on the upper right corner in all the pages, making the searching function accessible through every page. The search function utilize Google's search as internal site search. There is no advanced search feature, but it provides options to refine or limit users' results. The result list shows very little information about the page - the page title and two lines of relevant content in that page. There are no pictures in the result to facilitate the users to find the products they want.

2. HAWORTH Corporate Summary Haworth designs and manufactures adaptable workspaces, including raised floors, movable walls, systems furniture, seating, storage and wood case goods. Haworth is a Family-owned and privately held company based in Holland, Michigan. The company serves markets in more than 120 countries through a global network of 600 dealers. The company began in 1948 as Modern Products. In 1954, the focus of Modern Products shifted toward office environments, in response to the development of modular office partitions, the predecessors of today's panel systems. Haworth.com is the company's official website where the products are showcased and corporate information is presented. Current Use of Navigation Haworth's navigation design uses a similar style as in Steelcase. There are both global navigation and local navigation. The global navigation is placed on top of all the pages to give users easy access to all the sections of the site. The local navigation give users smooth browsing experiences within particular sections. However, the most important section of the siteproduct is not in one of the top navigation tabs. In order to highlight their products and help users navigate in this section, The product navigation is placed univerally above the local navigation on the left bar. The product navigation lacks pictures to help users to identify their products. Also, some of the labels used to describe the products are vague to the users so that the users have to go into the product to find out the details of the product, which will cost them more time. Current Use of Search Haworth deploy Google as their internal site search tool. The search box is also on the upper right corner of almost all the pages of the site. The search result list is formatted the same as Google result list. However, there is neither advanced search option or other options to refine or limit the search result list. Also, in the result page, there is a big picture above all the results which covers an unreasonable space of the whole result page. There are no pictures in the search result page to help users identify the products they want to save their time. Keeping these issues in mind, we thought a closer look at how Herman Miller's site affects the user was in order. Haworth and Steelcase were problematic in their own ways and neither proved to be a gold standard by which we coudl compare HM.

Heuristics Heuristics for Navigation and Search Rosenfeld and Morville (2002) recommend the heuristics evaluation in order to hold websites up against a set of strictures or constraints. In doing this, we might better understand the most visible points at which Herman Miller fails as well as those aspects in which the site executes its purpose efficiently. In this section, we examine how the current configuration of search and navigation at hermanmiller.com stand up to a popular set of usability heuristics created by Jakob Neilsen (http://www.useit.com/papers/heuristic/heuristic_list.html). We use five of Neilsen's ten guidelines.

Visibility of system status Navigating Herman Miller web pages, we are presented with a multi-layer global navigation system. At the top of each page we find (from left to right) a Herman Miller logo (which leads us to back to the home page at any time), and an image which reminds us of which site we are visiting (e.g. system status). The current system also supports breadcrumb navigation. A menu of mouse-over icons lead us to a variety of important pages: contact, ways to buy, "my herman miller", and a help page. The current system alerts us of its status by telling us which site we are engaged with by presenting an image of our location in every file's header. Another issue which deeply related to navigation and system status is the current use of URI/URLs. Currently, URLs do not offer rich information about what part of the site a user is visiting or take user needs into consideration. For example the URL for health care is: http://hermanmiller.com/CDA/SSA/IP/0,1776,a9-c2054,00.html but to better support user needs should be: http://hermanmiller.com/healthcare/ Considering search and system status, the use of a static menu bar in the search results pages tells us very little about the standing of system search. Further we have very little reason to believe that the system has pulled out the most relevant results. Searching a product will pull out hundreds of results that diminish in relatedness to the searched topic on the very first page.

Match between system and the real world Whether every user comes to the Herman Miller site with clear defined goals should certainly up for scrutiny. Not every user knows exactly what they are looking for and the world isn't easily divided into the modules Herman Miller has given us. Thus the system should be as flexible as possible--allowing users to navigate between categories with ease. In turn, this would ensure that the Herman Miller system of categorization is an aide rather than a hindrance to discovery. The current system of search hardly matches a "real world" searching need. Rather, when searching the site we are relegated to realms of each sub site instead of simply retrieving all data that is indexed in search sections or "zones" (Rosenfeld and Morely: 8.4.1).

Heuristics User control and freedom Nielsen argues that users will typically "choose functions by mistake", and will therefore need an exit system. At hermanmiller.com, a user may currently exit any page and be returned to the homepage. A site map link is provided in the footer of each page allowing the user to traverse the skeleton of each module or site. As Morville and Rosenfeld put it, the best systems allow us to move both laterally and vertically within the system. For example, if a user is browsing the Federal Government site there is no immediate method of moving laterally to the Business site, instead, if we move to the bottom of the page, we find a section called "related sites" which sends us to a site based off of Herman Miller's concept of relatedness. We cannot assume these options will suit everyone. Furthermore, the ability to move from site to site should be made more prominent if we are to truly value user control and freedom. Finally, heuristics for freedom within Herman Miller's search capabilities fail when we consider that users do not have the choice between doing an advanced or basic search.

Recognition rather than recall Navigation systems allow us to traverse documents without having to know in advance the ideas, subjects or sites we are looking for. For instance, four links at the top of every page require that we recall their functionality through the use of icons: these are "help", "ways to buy", "my herman miller", and "contact us". Only if we mouse over each icon are we given it's function. Recognition could be better supported in HM search. By making images a more prominent aspect of the results, users would have a greater chance of coming into contact with what they are looking for without knowing in advance. However, currently Images are only retrieved if a user knows the exact search string . Further, results are presented in one color, black. To make recognition more pronounced, descriptions, urls, and links should be presented in unique colors.

Aesthetic and minimalist design Herman Miller does succeed at creating a minimal graphic design. However, the current navigation system trumps this effort. From the the current homepage there are over 35 clickable links. From the business site, there are currently 28 clickable links. We must consider the point at which our content over rides the design ideas. If we explore the Site navigation on the current search results page, we see the place locator uses a black font on a black background. Minimalism in this case hurts our ability to know where we are.

What next? We wanted to prove to ourselves that the hypotheses we set with our heuristics had some thrust beyond our own individual usability appraisals. In other words, we wanted to know if we were thinking like the audience that uses Herman Miller's website, so we went into the field and collected data for 5 user profiles. From this we created three personas which illustrate the fundamentals of the problems at hand. All three individuals are members of the Design and Furniture industries in some respect.

Persona

User1

User2

User3

PROFILE

NEEDS

Catherine Ribiero Interior Designer Showroom Salesperson Herman Miller Dealer • Ann Arbor, MI • Educated, Degree in Art/Design from U of M • Married • No Children

• She wants to quickly find images of the products for clients who might be interested in seeing versions of products not in her showroom • Uses the site to give clients more information and visual stimuli. Many times she uses it in the showroom with clients over her shoulder (much like a reference librarian) • During showroom visits, she finds herself apologizing to clients for her inability to track products down quickly on the HM site

ATTITUDE TOWARD HM SITE

ETC.

• Thinks the HM site is too complicated • Wants a uniform display for HMʼs products with less jargon and more useful information • Thinks that the HM search engine resembles Googleʼs and wants a search thatʼs more visually stimulating • Thinks the front page is too overwhelming

What doesn’t she need from the HM site • She never looks at research • Has never seemed to notice how placing a search within a certain category will land her in a different HM website

Persona

User1

User2

User3

PROFILE

NEEDS

Sara Blakely

• Wants information about new products, new technologies being researched (is HM going green/sustainable), and definitely promotions and prices

Artist, Designer & Graduate Student • Ann Arbor, MI • Educated, Degree in Art/Design from U of M in progress • Not married • No Children • Interested in new approaches and innovations in the field of design • Design literature consulted; Blog/Websites; Design Observer, QBN, we make money not art, digital thread, behancemag Magazines; dot,dot,dot, Step Inside Design, ID, Eye, Sculpture

ATTITUDE TOWARD HM SITE

ETC.

• Thinks the HM site is a good representation of the brand - thinks it was great that the photo of the trademark Eames chair was on front page • Observes it is very hard to find the price of an item and was annoyed that clicking on pricing in the nav menu led to a pdf • Is confident that the information on HM site is up to date • Really wants to see more prominent information about how HM is moving toward green technologies/sustainability - was surprised that HM was not promoting its own research/innovation

Relationship with Herman Miller • Very familiar and admiring of the Herman Miller brand - the Eames molded plywood chair is one of her favorites

Persona

User1

User2

User3

PROFILE

NEEDS

Michelle Karell

• Looks for information on ergonomics, environmental studies, and technology integration. Wishes Herman Millerʼs site had a more meaningful search results page when sheʼs looking for products to outfit a clients worksite • Doctorʼs and businessmen donʼt like their time wasted, if I can get what I need faster from HMʼs site faster, my customers will be happier • Her company has won awards from HM for the custom service they provide to the Healthcare industry. Wants more from the HM website in order to get her work done faster. • She needs more readily accessibly information on the measurements of furniture and components

Salesperson for full-service office furniture dealer • Ann Arbor, MI • Educated, undergraduate degree in Business from U of M • Married • two children

ATTITUDE TOWARD HM SITE

ETC.

• Likes the style of the HM site but feels it is too complicated to do business on • Wants easier access to furniture she can suggest or office places that are concerned about ergonomics, wishes search was categorized

What doesn’t she need from the HM site • She has never looked at the Home section of the Herman Miller site • Doesnʼt understand why multiple sites are needed. Makes sense to have sites for different languages

Persona Analytics What are personas telling us?

+ _

• Representation of Eames chair at front page is good: aides in brand recognition • Information is kept up to date • Most seem to like the visual style

• Need to browse product site quickly • Need to know new product/ new tech. & movement toward sustainability • Need less jargon, more useful info. • Front page is too overwhelming. Should be kept simple. • Search can be misleading. - Need to represent search results in a more effective, organized and classified way • Hard to find price of an item, this should be prominently placed.

Our personas revealed the most important issues revolve around navigation, search, and the ability to find products. Most HM site users need to find information quickly via links or reliable search results. Some use the site with clients at their side, therefore work is time critical, placing a high premium on search. Personas also show that people visit the site for varying reasons, so making as much information visible as simply as possible is essential.

Visualization of Site Statistics Our next step was to understand how our personas made w sense when placed next to the HM analytics provided to us. We chose to make visualizations of the statistics in order to get a clearer idea of what areas of hermanmiller.com are most frequently used. The first band visualizes the average visits of each sub site or audience. The second represents the average visits of the product section of each sub site. Although the numbers vary, the orders of the two are the same. The second visualization shows the business site is the most popular sub site among all (this isn't surprising since it is the default). The second is the Home site. Then A & D, Healthcare and Fed Gov. This principle also applies to the products section of each sub site. The third band is a visualization of the average number of clicks in the Herman Miller Business site. The visualization shows that the product tab and two particular products-Mirra chairs and Aeron Chairs are the most popular. This reveals that people who went to the site are more interested in Herman Millerâ&#x20AC;&#x2122;s products than other information. The prevalence of the business dealers locator link, suggests that after browsing products, users want to know where they can find and purchase them. After comparing the visualizations with our personas, we came to the conclusion that users are most interested in finding products and product information. Further, hits between sub sites do not vary enough to have an exuse for not allowing users lateral naviagtion btween them. Thus, when evaluating and redesigning the website, focus should be placed on the user's ability to find product information and dealers within the Herman Miller's network and to move about freely within the site.

Current Search Engine Analysis The current internal search engine does not give the user the confidence that s/he is searching the entire website. If no parameter is chosen on the homepage search box, the search will default to ‘Business’. As our personas illustrated, this is not readily apparent to the user. If the user does not know what they are looking for and in which module of the website they should look, the process is frustrating and time-consuming. The basic keyword search boxes are displayed on all web pages—it is called ‘site search’ but this is somewhat deceiving because it only searches the module or ‘site’ that the user is currently in. The search engine results page (SERP) will then give the user more parameters, adding the option to search by content component (All pages, About Us, Case Studies, Colors/Materials/Finishes, Contact Us, Designer Biographies, DesignLink, Help, News, Planning & Visualization, Product Information, Research Summaries, Research/Design, Services, Site Home Page, Ways to Buy). These are listed as descriptors on the search results.

Pages are indexed by: • Page title • Byline (statement of who designed product) • First several words of intro (product description) This was determined by comparing the search results to the source code of the product page (given by the search results). PDF documents seem to be indexed by full text. Images are indexed by alternate tag text. For any given search, only one graphic is returned for exact keyword match. Dealer locater search boxes are not standardized across website modules. This is very confusing and frustrating for users. On each product page, Business>Find your dealer, Home>Find a store, A&D>Pricing Info>Consumer store, Federal Government>Government Dealers, State & Local Government>Find a Dealer, Healthcare>Find your dealer, Education>Find a Dealer.

Recommendations: Search Indexing Information • Keep existing product categories to facilitate browsing • Products assigned attributes within Content Management System -- products are able to be classified more than one way • News/Research/Articles indexed by full text and page title Information Retrieval All products/pages indexed by one main internal search engine. Search results are ranked using an algorithm based on: • Occurrence of keywords in web page titles • Occurrence and frequency of search words in web page content • Proximity of search words in web page content Dynamic accordian: (see SERP wireframe, point 5) • Related links generated by other related search terms and/or by a recommender system • Product type search (search products by category) • Search by designer • Search news/articles Image Search There is a need for an image search. Many times users only want to see a graphic of a product. The current search tool only yields one graphic for any given search and it will only provide that graphic when the exact search term is matched. For example, there are several graphics of an Aeron chair, but a search for ‘Aeron’ only reveals one graphic—always the same one. There is a subset of Herman Miller users who want to be able to search images. Returning an image for each search result (when available) will help with recognition and recall and make searching easier for the user. Search Engine Results Page (SERP) • Result description provides relevant, concise info from body of page • Descriptor or content category included in result • An appropriate image included when possible • Pagination is limited

Recommendations: Navigation [current navigation architecture]

Choose a U.S. site Business Home Architects & Designers Federal Government State & Local Government Healthcare Education Media Investors

Just browsing All products Services Research & design About us Inclusiveness & diversity Environment Careers

Headlines Herman Miller Revises Second Quarter Guidance and Announces Cost Reduction Actions Herman Miller Office Chair Sensors Save Hewlett Packard a Bundle; The Pair Win Industry Award

This navigation set distinguishes customer types and is not a set of outbound links. We call it the "lateral navigation set". It is potentially confusing to the customer to refer to them as "sites". This is a labeling issue. Alternatives can be: Business / Home / Architects and Designers / Government / Healthcare / Education / Media / Investors The sub-categories ‘Federal Government’ and ‘State & Local Government’ are be merged into one category. To encourage lateral navigation of the site these navigation elements should be placed on every page. Likewise, the label, "Choose a U.S. Site" should be removed entirely unless we are to offer sites in other languages.

This navigation set is the primary navigation because the sub-categories appear on most of the pages. In each HM subsite categories such as products, about us, research, and services are placed in global navigation. ‘Inclusiveness & diversity’ and ‘Environment’ site tell us HM’s value and vision under the ‘About us’ global navigation, so we can also merge them into ‘About us’. Our data visualization shows the product tab is one of the most popular, therefore we give it prime real estate on the far left-hand side of the global navigation set.

Headline links show us up-to-date news and information. Currently, the user is inundated with links under each headline and each occupies a relatively large portion of the front page. Our suggestion is to use a succinct subject for each news headline to use the space as effectively as possible.

… .. 13

Recommendations: Navigation [current navigation architecture]

Connections Find a dealer Consumer and online stores Worldwide Jugglezine DesignLink Discovering Design Site overview

The sub-titles under ‘Connections’ are mostly unique in the front page except ‘Worldwide’ and ‘Site overview’. ‘Worldwide’ is located on the top left, and ‘Site overview’ is on the bottom as different name, ‘Site Map’. Although ‘Jugglezine’ also reappears on the bottom of the page, it had better exist under the ‘Connections’ rather than bottom because its characteristic seems similar with other sub-titles.

Tools Search Contact us Ways to buy My Herman Miller Help

This taxonomy includes icons for each sub-title and the icons always appear on the top right of every pages much like global navigations except the search menu. Therefore, the icons should be placed on the top righthand side. Text should precede each icon, while the search should be noticeable by isolating it from others.

This labeling system is parallel to each other and doesn’t make us confused except the Jugglezine menu which is duplicated in the front page and even has more or less different label. So it would be better to be removed here.

Wireframe: Front Page Notes We have been attempting to simplify the navigation system by eliminating duplicity and seeking intuitive and consistent taxonomy and layout. 0. Home link: company name and logo 1. An image of HM’s prominent product such as Eames chair 2. Tools’ icons with text 3. Company logo 4. Search box 5. Global navigation 6. Worldwide menu to find the HM dealer or office nearest to users 7. Local navigation to choose different site 8. Two image with link to ‘At work’ and ‘At home’ 9. Summaries of up-to-date news of HM 10. Connections to specific information such as design link or online stores 11. HM copyright 12. Terms of use and site map

Wireframe: Search Results Notes The dynamic accordian provides a more structured search and also browsing capability. Search by Product Type allows the user to browse products, Search News/Research contains the search to textual documents and Search by Designer will list all products by given designer. 1. Basic keyword search 2. Meaningful retrieval statistics 3. Formatted results for recognition 4. Returns images for every result 5. Dynamic Accordion with related links 6. Pagination based on relevant results

Conclusion Alice fell down a rabbit hole and was taken into a world of confusion where all sorts of unexpected things happened. We chose the name "Filter Rabbit" to symbolize our dedication to making sure Herman Miller customers don't have to play the role of a confused and bewildered Alice in their attempts get work done on hermanmiller.com. We have proposed some ideas to help increase the fluidity of navigating the site along with techniques of displaying search results that will better serve clients. In many ways, HermanMiller.com is used as a reference site and should be built to facilitate flexible findability. Providing near-matches and related terms will keep users invested in the search. In addition, taking into consideration Batesâ&#x20AC;&#x2122; Berry-picking model (1989), the search function can help users along the path of a query instead of just letting them fall into a rabbit hole. Lastly, we cannot assume that the search information retrieval system will give the user a perfect match to their query every single timeâ&#x20AC;&#x201D;a fluid navigation system must be put in place for this reason. The navigation system must not require that the user make guesses, or inundate the user with too many choices. Further, we must keep the user informed of where they are at any given time and make them comfortable with laterally navigating the site. Navigation systems allow users to encounter the same information in many places. The architecture of a site should not relegate information to certain zones, or modules that render certain parts of the site unvisitable.

References • http://www.hermanmiller.com/ • http://steelcase.com/ • http://haworth.com/ • http://www.useit.com/papers/heuristic/heuristic_list.html • http://www.wikipedia.org/ • Information Architecture for the World Wide Web (3rd Edition), Louis Rosenfeld and Peter Morville • Search Engine Visibility , Shari Thurow