The document discusses usability and aesthetics in website design through two examples. 1) The American Chemical Society (ACS) website overhaul focused on usability, simplifying navigation, shortening content, and making labels and locations more intuitive based on user research. 2) The Volkswagen website was found to improve brand perceptions but saw a significant drop in usability scores due to navigation and speed issues, showing aesthetics must be balanced with usability.

1. Usability and Aesthetics Two Examples

2. Usability Issues Naming — Do section/button labels make sense? Do certain words resonate better than others do? Organization — Is information grouped into meaningful categories? Are items located in the places customers might look for them? First-time use and discoverability — Are common items easy for new users to find? Are instructions clear? Are instructions necessary? Effectiveness — Can customers efficiently complete specific tasks? Are they making missteps? Where? How often? From About Face , pg. 71

3. Focus on Usability Example 1: American Chemical Society website: www. acs .org Before the overhaul: http://web.archive.org/web/20060221182419/www.chemistry.org/portal/a/c/s/1/home.html Article: “What Goes into Good Web Design?” Boyd, A. Bruce, N. (2008). What Goes into Good Web Design? A Report on the New ACS Web Site. Journal of Chemical Education, 85 (1), 20. Retrieved February 3, 2008, from Research Library database. (Document ID: 1409985051).

4. Focus on Usability (cont.) For site architecture, ACS researched how information should be grouped “ Card Sort” — pulled together most prominent terms and programs and asked a diverse collection of users to group the content in the fasion they found most intuitive Homepage test — users were given a blank homepage with four empty boxes and asked what content should be used to fill them. Unanimous response: research, news, announcements, and membership info.

5. Focus on Usability (cont.) Other usability improvements on the ACS website: Simplify global navigation bar, easily understandable main categories Paragraphs were shortened, content reformatted to support users seeking information Links given more intuitive labels Include a breadcrumb trail that alerts users to their location within the site.

6. Aesthetics “ Most usability tests are impotent to evaluate the success of a site in terms of conveyed emotion, because emotion is something that most users (and most humans) have difficulty articulating …” — Curt Cloninger

7. Aesthetics Example 2: Volkswagen website www.vw.com Article: “J.D. Power and Associates Reports: Breaking Web Site Design Standards Can Prove Successful in Eastablishing Brand Identity” J.D. Power and Associates Reports: Breaking Web Site Design Standards Can Prove Successful in Establishing Brand Identity. (18 July). PR Newswire. Retrieved February 3, 2008, from ProQuest Newsstand database. (Document ID: 1306207781).

8. Volkswagen website J.D. Power study found shopper’s perceptions of 25 branding attributes improved after visiting the VW site. New design “increased the perception that their models are technologically advanced and innovatively designed.” HOWEVER … New design came at a cost. When measuring site usability, the study found Volkswagen’s index score drop significantly by 32 point from previous study, mostly due to navigation and speed issues.

9. Volkswagen website J.D. Power quote: “ As powerful a tool as the manufacturer Website can be in shaping shoppers’ brand perceptions, usability must always be at the heart of new site designs … With minor usability tweaks, the site could easily be a model for the successful blending of both usability and branding.” — Steve Witten, J.D. Power

10. United Airlines http://www.youtube.com/watch?v=7s4nP4rkx-w Usability Problems