..' }

No Section...

VIII.2 March 2001
Page: 81
Digital Citation

Industry briefs: Yahoo!


Authors:
Irene Au

back to top  Philosophy of Design

Staying focused on users and their needs has been engrained in Yahoo's culture from its inception and is emphasized by its founders and senior management. This philosophy is reflected most noticeably in the design of the site, with its focus on usability, utility, and download speed. If Yahoo's services are easy to use and users achieve their goals through Yahoo, users will continue to come back. Though the design philosophy is very informal, it is propagated throughout the company through a collective consciousness.

The design process at Yahoo! is most colored by the internet industry's nature: timelines for development are much faster than in a software or hardware company. The competitive landscape forces quick launches where timelines span anywhere from one day to three to four months for a product redesign or launch. The speed with which we develop products prohibits us from writing lengthy product specifications. All of the design specification for products is done in the form of HTML mockups. In effect, the product process is more evolutionary than hardware or software. For example, products may be only partially "done" when they are launched, enhancements are continuously being rolled out as opposed to launching massive redesigns after a longer period of time, and bug fixing happens not only before launch but also after. Thus, designers in this environment must deal with chaos, shortened timelines, no formal written specifications, and less than perfect product launches.

Designs succeed because of—not in spite of—this environment. Product designs go through more frequent iterations because the technology allows us to do this easily. HTML is easy to change, the software is on our servers instead of on users' computers, and users are always running the latest version of our products. Through server log data and customer care correspondence, we receive feedback instantly from our users and are able to respond quickly to it. These metrics also allow us to evaluate the effectiveness of our designs with quantitative measures that complement the qualitative data collected in usability studies.

back to top  Design Process

The design process at Yahoo! is mostly informal, and flexibility is valued since time to market is so critical. The product teams are kept small to ensure that the team can work as efficiently as possible. The typical core design team consists of the producer, interaction/product designer, and lead engineer. User experience/usability researchers work closely with the designers to translate and apply research to the product. The extended design team also includes graphic designers, illustrators, and HTML designers.

User Experience roles are specialized into two types: research and design. Researchers have backgrounds in experimental or cognitive psychology. Their mission is to gather qualitative data about what our users are doing. Usability testing and field studies are the most common methods used, although we have also used user diaries, card sorting, contextual inquiry, and eyetracking to better understand our users. The researchers act as consultants to the various product teams, working broadly across many products within a product family. Researchers and designers collaborate closely to understand users' needs and behavioral patterns, and brainstorm ways we can build our products based on this research.

The breadth of products at Yahoo! requires that we have a design team with diverse backgrounds. Most designers have a background in human-computer interaction; others have backgrounds in graphic design or industrial design. Designers are assigned to products based on their interest and background; for example, a web-based application that is mostly task-oriented such as Yahoo! Mail would have a designer with a background in HCI, whereas a product heavily focused on the presentation of information such as Yahoo! Music would have a designer with a visual background. Although their backgrounds may vary, functionally all designers are the same: they work closely with producers and engineers to define the user experience, from conceptual design to interaction design, interface design, and layout. In contrast to the usability researchers, the designers work on a small number of products but are deeply involved in its design and development. All designers deliver the user interface "specification" in the form of flow diagrams and HTML mockups. Formal design specifications are rarely maintained, as the fast-paced environment prohibits us from keeping specifications up to date. A visual design group within the department is responsible for creating graphics and icons and the look and feel of the site.

The greatest amount of job satisfaction achieved by human interface professionals at Yahoo! comes from launching products that are widely used by the general population. With an audience of several million users, designers and researchers take comfort knowing their efforts have a significant impact on Yahoo!'s user base. Frequent peer review of designs and reviews of products in periodicals also contribute to the user experience professional's job satisfaction at Yahoo!.

There are several things academia could address to better prepare future designers to work in an environment like Yahoo!. A healthy combination of HCI and visual design theory and principles would best prepare users for designing for the Web, since interaction and visual design issues are so dependent on one another in this medium. Furthermore, students should have opportunities to work on hands-on projects where they can apply this theory to real-world problems. Having students work in cross-functional teams would also help prepare them for dealing with not only design and research issues, but also marketing and technical constraints and goals.

Yahoo's goal is to allow anyone to buy anything, communicate with anyone, and find information on any topic, independent of location or device. This means that we are increasingly branching out beyond HTML interfaces and into other technologies, including client software, DHTML, WAP, and speech recognition. To support this evolution, we will have a wider array of specialization among the user experience professionals in the group, with everyone being exposed to the various technologies in order to promote collaboration and innovation across products.

back to top  Design Project

Yahoo! Yellow Pages is an online directory of bricks-and-mortar businesses for local markets. Before users can browse or search for a business, they must first specify the location in which they want to find a business. Users can either search in a city or near an address.

In the interface Yellow Pages had when it launched, users were immediately prompted for a city or zip code or an address, as illustrated in Figure 1. This information is necessary in order for us to know what location's database to search and what browse tree we should show, since the browse tree may be different from city to city. In usability testing, users were startled to see this page immediately; they expected to see a text field for searching and a browse tree on the front page of Yellow Pages, similar to the Yahoo! main page. Users were also confused by the design of this page. Instead of entering a city or an address, users entered a city and an address.

We addressed these problems by making improvements to the interaction and visual design. Instead of prompting users for a location on the front page of Yellow Pages, we show a browse tree and search bar. As soon as users enter a search query or click on the browse tree, we prompt for a location. This interaction is more consistent with users' expectations of what they would see on the front page of Yellow Pages, and users understand when prompted for a location that it is necessary for the search. We also changed the visual design of location form so that only one form is visible at a time (see Figure 2). Originally we considered a design that would show and hide fields according to the type of search users wanted to do (search in a city vs. search near an address), but doing so would have required technologies inaccessible by users with older browsers. As a result, we use "tabs" to allow users to toggle between the different searches. Most users search for businesses in a city, so defaulting to one form and making the other option available but not visible on the page works well for most users.

back to top  Author

Irene Au
Director, Product User Experience and Design
Yahoo! Inc.
Tel: 408-616-3886
irene@yahoo-inc.com

back to top  Figures

F1Figure 1. tempcap

F2Figure 2. tempcap

UF1Figure. Irene Au

back to top  Sidebar: Company Snapshot

Job Titles for Design and Usability Positions:
User Experience Designer (Interaction and Product Designers), User Experience/Usability Researcher, Visual Designer

Job Qualifications:
Interaction Designer: At least MS in HCI or human factors
Product Designer: At least BS in graphic design or information design with at least two years of experience
User Experience/Usability Research: At least MS in experimental or cognitive psychology; studied HCI
Visual Designer: At least BA in graphic design with strong layout and typography skills
Breadth of Project Teams
A typical user experience team working on a product at Yahoo! consists of one or two user experience designers, one usability researcher, and (as needed) a visual designer, illustrator, and HTML designer.

back to top  Sidebar: Practitioner's Workbench

Favorite Publications:

  1. Nielsen, J. Designing Web Usability. Indianapolis, Indiana, New Riders Publishing, 2000.
  2. Shneiderman, B. Designing the User Interface. Reading, Maryland, Addison Wesley Longman, Inc., 1998.
  3. Hackos, J. and Redish, J. User and Task Analysis for Interface Design. New York, John Wiley & Sons, Inc., 1998
  4. Alertbox: Monthly Column on Web Usability by Jakob Nielsen (www.useit.com/alertbox)
  5. User Interface Design Update: Monthly Newsletter by Human Factors International (www.humanfactors.com/library/pastissues.asp)
  6. UIE Reports by User Interface Engineering (www.uiereports.com)

Tools Used:

  • Allaire HomeSite
  • Microsoft Visio
  • Adobe Photoshop

back to top 

©2000 ACM  1072-5220/01/0300  $5.00

Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. To copy otherwise, to republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee.

The Digital Library is published by the Association for Computing Machinery. Copyright © 2001 ACM, Inc.

Post Comment


No Comments Found