Reading Reflection #11

Standards play a key role in ensuring that everyone can receive information as it was intended. This is important for the web, or the “World Wild West”, where standards are not requirements but guidelines. By following set standards, we ensure that the end user can access the information or view it as it was meant to be viewed. For example, when websites conform to the design standards set by the World Wide Web Consortium (W3C), they ensure that they will be viewed correctly regardless of the web browser used. Similarly, when web browsers comply to standards it becomes easier for developers to create sites that render correctly across different web browsers. Last week, Microsoft announced that the upcoming version of its web browser, Internet Explorer 8 (IE8), would default to these standards. This announcement came after outside pressure from the design community to be standard compatible (as well as potential legal action from Europe).

Still, there are some reasons for choosing not to follow such standards. Many web designers are using flash for interactive animation, but flash is not a web standard. Some companies may understand the importance of standards but still choose a tool such as flash, as the media-rich sites are the norm in their industry. This is true for architects specializing in high-end design.

Also, a company may want to create reliance on its feature or software by making it only compliant with its own customized standards. Just as Microsoft points the importance of supporting standards in IE8, it recognizes that millions of websites have been designed to work for IE7, and before the recent announcement that IE8 would support web standards they had planned for IE8 to default to IE7 mode. As Internet Explorer is currently the most popular web browser, a version that only supported IE7 would have perpetuated the need among users to use Internet Explorer to view some sites correctly.

Questions:

1. Cooper advises against overuse of alerts and confirmations, as they interrupt the user experience. What are some situations that require keeping these alert boxes (i.e., when is it smart to “second guess” the user?)
2. Are there any examples of standard-setting committees that develop controversial standards, or standards that have been found to benefit specific institutions, governments, or corporations?

 

Reading Reflection #10

Of my five websites, two have site maps (IGN, Last.fm, and one has a site index (WSDOT). IGN’s site map is not provided on the home page or any other page on the site – it was only accessed after Googling “IGN Site Map.”

WSDOT
The WSDOT offers an alphabetical index of terms and topics. It’s a pretty thorough list — most letters have at least ten terms underneath each. I found the index under “search” at the bottom of the home page. On the search page, a site index link is provided in the sentence “If you know exactly what you want and would rather use the old site index, you can still do so. It sounds as if at some point this index was linked on the main page but is not used often now. While the index is different than a site map, but is likely used for the same purposes by some users.

IGN
I’m not sure what use a site map is if it can’t be located on the site, but I’m guessing that this site map is no longer being used as many of the pages listed are no longer available. However, the site map organization looks very similar to the categories in IGN’s left-hand navigation column on the main page. Could this actually be a site map in disguise?

Last.fm
Last.fm does not have a separate site map page; it simply lists sections of the website at the bottom of the home page and is not labeled. I’m suspicious of this list of pages, as it does not appear to be a comprehensive list. I’m guessing it is not actually a site map.

After looking at these three websites, I question whether I can give site maps a narrow definition. IGN may have a site map disguised in its main page, WSDOT offers a site index, and Last.fm has what may or may not be a site map.

———————————————————

1. What makes comprehensive list of categories in a navigation bar different from a site map? (e.g., IGN)
2. Must a site map be comprehensive for it to be a site map?
3. What are the drawbacks to having a site map on your website?

 

Reading Reflection #9 — COM585

1. Check driving conditions on Snoqualmie Pass. Bob, a Seattle resident, has not visited his parents in Yakima for several months, and he makes plans to visit them during a weekend in February. In the days preceding his visit, Bob sees reports that the main route connecting Seattle with Yakima is closed due to avalanche work and treacherous driving conditions.

Bob uses the WSDOT website regularly and has the site URL bookmarked in his web browser. On the afternoon before he is to leave, he checks the home page and sees “Snoqualmie Pass” in a Most Requested box. This takes him to a page posting conditions and cameras on the pass. The weather has improved and there are no restrictions, so Bob starts packing for the weekend.

2. Find details on the Alaskan Way Viaduct construction project. Leif is a 22-year-old intern at Northwest Cable News. He just started several weeks ago, and his job entails researching and fact checking. This morning his boss asked him to summarize any updates on the Viaduct project, and suggested he visit the WSDOT website.

This is Leif’s first visit to the site. Just before he clicks on “Projects” in the navigation bar, he notices a Projects category farther down the page with the Viaduct as a sub-link in this category. He sees a Project Status box at the top of this page and jots down details on a new spending package and an upcoming public meeting. His boss gives him a pat on the back.

3. Get updates on SR520 traffic. Preston is a 29-year-old project manager at Microsoft. He lives in Queen Anne and works in Redmond. It is a Wednesday at 4:30 p.m., and Preston wants to meet some friends for happy hour in Belltown in Seattle, but he might finish up some work if traffic is backed up on SR520.

From the main WSDOT page he clicks on “Traffic & Roads” in the navigation bar. On an interactive map of the state, he clicks on the Seattle area and receives a close-up map of the area — including the 520 bridge. Using color-coded lines, the map reveals that there is no traffic. On the same map he clicks on a camera icon and sees open lanes just outside of Redmond. He opens the top button on his shirt and loosens the noose of his tie.

______________________________

1. In what ways can more “adventurous” font families improve the appeal of a website?

2. In what ways can they hinder a website?

3. Cooper uses serifs in his text, but changes to sans serifs for bulleted lists. What is your opinion of making changes to fonts, sizes, serifs, etc., within the same body of text?

 

Reading Reflection #8: COM585

I imagine there are two typical knee jerk reactions to the thought of spending time researching audience details. The common through process must be “Why waste time doing all that extra work when I have a general idea of who will use the site?” Either that or “I know what works, I’m the expert.”

In response to the first knee-jerk reaction, I might make the following case:

“You may think you know the audience, but a persona will help give everyone on the team a clear, detailed understanding of who will be using the site. Everyone may think they know the audience, but there is no consensus until those details are clarified and communicated. With these personas in place, the users and their needs will never be forgotten throughout the design process; they remain front-and-center.”

I would also point out that stereotypes paint too broad a brush of users (and possibly false assumptions) and does not take into account different needs from different users. Dan Brown also offers a helpful tool: devising a list of questions that would be difficult for team members to answer, proving the importance of real research.

In response to the second knee-jerk reaction, I would attempt to take the egos down a notch and point out Cooper’s explanation of “self-referential design,” reminding team-members that they are not designing a site for themselves. As an example, I may point out a product (not a website) that may be cutting-edge but not well-designed for the end user (perhaps Windows Vista) in order to make my point stick.

_________________________________________________________________

1. How can a team benefit from personas when there is no access to “real” hard-hitting evidence?

2. In a situation where there are a handful of unique personas, how does the team prioritize them?

3. How does a design team integrate personas when designing a site used by all types of users, such as for a government website?

 

Reading Reflection #7: COM585

Alibris.com
Competitors: Powells.com, amazon.com

Alibris and Powells both focus primarily on book sales, and both also specialize in rare books. While Amazon sells nearly everything and the kitchen sink, it is the largest online book retailer and undoubtedly competes with Alibris.

1. Powells and Amazon both provide and extensive list of book genres on the main page (on the main “book” page in Amazon’s case), and both place this list in the navigation section in the left column. Alibris, however, offers a truncated list in a “browse” box on the right side of the page.
2. In addition, Powells offers a global navigation bar at the top of each page that includes broader sections, such as Used, Rare, Kids, Technical, Bestsellers, New Releases, etc. Amazon also provides a navigation bar with similar labels. Alibris also provide a limited navigation bar (books of note, textbooks, bagain, rare) and is not as noticeable.
3. Both Powells and Amazon place much more content on their main page, Powells having an especiall large number of categories, lists, and links. Alibris seems less overwhelming than Powells upon the first view, but this may require extra navigation for those trying to reach a specific item.

IGN.com
Competitors: Gamespot.com, 1up.com

IGN covers multiple types of media: games, television, movies, and comics, but its content is largely aimed at gaming enthusiasts. The two other most visited video game sites are Gamespot and 1up.

1. All three sites offer a scrolling window that features a handful of features, reviews and previews. Both IGN and Gamespot offer very similar navigation buttons for features, previews, reviews, etc., midway down the page. 1up also offers these midway down the page, but breaks them into more detailed boxes.
2. All three sites use boxing to organize groups and categories, and all three use similar colors and fonts to label each box. 1up uses extra spacing between boxes, giving it a “widget” look.
3. IGN is the only site that uses the more traditional “upside-down L” frame, with facets organized down the left column.
4. All three sites offer memberships and user blogs, but these blogs were harder to find on both IGN and Gamespot (blogs were found under “soapbox” at Gamespot). 1up made editor blogs, user blogs, and game developer blogs highly visible on its main page. IGN does have an account box in the top left corner that includes a blog link, but it does not feature the user-created content on its main game page.

__________________________________________

In what ways could right-hand navigation deliver a better experience for the journalism site?

What criteria are most important to compare when looking at our competing journalism program websites?

In what ways can competitive analysis be a drawback if used the wrong way?

 

Discussion Leader — Reflection

I believe that the two readings I chose tied in well with the reading assignment for last week. Both brought up conversations about information architecture, and the J.D. Power article showed the struggle that can occur between aesthetics and usability.

The additional conversation regarding the architecture of the Alibris site (and its comparison to Amazon) helped me better understand design and architecture characteristics that lead to poor usability.

By taking a closer look at these three wbsites, I gained a clearer picture of what constitutes effective architecture and improved usability, and I hope the rest of the class also found it valuable.  If I were to have improved the discussion time, I think I could have prepared a predetermined list of questions about each website in order to get people talking.

 

Discussion Leader — Feb. 5, 2008

Readings:

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).

This article covers some major changes the American Chemical Society made to their website. The articles highlights improvements in usability and findability, and explains some user resesearch approaches that helped understand what content to feature and how to organize it.

________________

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).

This article reveals changes that car manufacturers are making to their websites in order to improve brand identities. An annual study by J.D. Power and Associates measures user perception of brand image on websites. The study also measures usability. The article focuses on Volkswagen, as the company’s site redesign greatly improved its brand identity but also saw a decrease in usability, according to the study.

________________

Power point:

Websites:

www.acs.org

http://web.archive.org/web/20060221182419/www.chemistry.org/portal/a/c/s/1/home.html

www.vw.com

http://www.youtube.com/watch?v=7s4nP4rkx-w

 

Reading Reflection #6: COM585

Alibris.com and Gestalt Theory

Overall, the Alibris website design relies on proximity for users to recognize related items, and less on the rule of similarity. Many of the groupings of information are differentiated from each other by the space between them. The design relies on several columns For the most part, the site does not separate different elements by font type or shape.

However, there are a few patterns using the rule of similarity, such as repeat font in the subtitles on the “movies” page, directing users to recognize four featured genres. The rule of similarity, as well as the rule of proximity, can also be found in the navigation bar for movies, books, and music. The site might benefit by adding some more visual cues using the rule of similarity. For example, in the “movies you might like” section, users may more easily recognize movies in a specific genre (or rating) based on background colors that label each title (e.g., orange for children).

Groups on the main page might benefit by having a subtitle bar similar to the one found in the browse box. This might make the existing groups more distinct.

I briefly assumed that the colors in the logo correlated with the colors in the “turn up the music” and “enjoy the movies” boxes in the left column (i.e., orange represents movies, and blue represents music) but this color coordination is not used in other areas, such as the navigation bar.

———————————————————

1. Are there examples where used facets to categorize information can take a turn for the worse? Are there examples where facets can become a crutch for designers?

2. Are there any guidelines for categorizing information by graphical icons? (e.g. – Alibris navigation bar)

3. What is the difference between transference and perceived affordances?

 

Reading Reflection #5: COM 585

When looking for tension between aesthetics and usability in my four websites, I made the following observations:

Alibris.com — As an e-commerce site, usability takes priority over aesthetics. Alibris doesn’t try to do anything spectacular with its graphic design, but it does make nice use of color, tying-in the colors from the logo into other elements of the site. I believe the Alibris site does a good job of balancing aesthetics and usability. The site does not attempt to do anything fancy, but manages to exude a warmth that is welcoming.

IGN.com — This media site suffers from a serious lack of personality. The home page attempts to give users as many links and feature as possible, but loses quite a bit in the process. At the center of the page is a nice scrolling tool for the latest content and features, but this pushes much of the content down the page, requiring too much scrolling for a main page. Advertising also takes away from the aesthetics of the site, due to the size of the ads and the placement at the top of the page. The site does an admirable job of creating contrast between objects using color and proximity, but it still suffers from information overload.

Washington State Department of Transportation — Like IGN, the WSDOT has a large amount of content to provide up-front, but the visual organization of the WSDOT site makes navigating the main page much easier. Beyond the effective visual organization, there is little here in terms of aesthetics. It’s “no-nonsense” approach is probably a good thing in this case — most users are likely in a hurry to get the info they need on this site.

Blitzen Trapper — As an official site for a rock band, this would seem like an ideal website for aesthetics to play a larger role. While there is some flair on the edges of the main page, Blitzen Trapper’s web site feels amateurish. The fonts are dull, and in some instances hard to read (the text for the tour schedule is in bold, all caps, and for some reason large chunks are highlighted).

—————————————————–

1.  Is there ever a scenario where Gene Na’s quote (“the less the client talks to us, the better it is”) actually creates a win/win outcome???

2.  Are there scenarios where visual communication that “speaks loudly” actually make for good design?

3.  Regarding the UW Journalism site: in a generic page hierarchy (as shown in Wroblewski’s article), which elements should never deviate from this template?

 

Reading Reflection #4: COM 585

After surfing through the BBC website, I realized how big of a challenge it must be to organize so much information covering so many different interests. Although it felt a bit overwhelming getting a grasp on the breadth of what the BBC site offers (as a first-time visitor), I was really impressed with the design of the site.

I noticed that the decision to prioritize site searches by local/regional information first is still present. However, the site eliminated the “UK” and “International” buttons, which allowed one to automatically change the focus of the content.

I picked up a few changes from the current design to the beta page:

·   The category directory moved to the bottom of the page, and the list of subcategories have been shortened.

·   There are additional ways to customize the home page, as users can prioritize specific topic on the main page and within each category. This further fulfills the goal of creating more interactive design.

·   The important anchor point – the gray toolbar – has been eliminated from the home page beta. This made some locations hard to reach from the new main page (the “talk” link has disappeared; there’s no way to get to the forums directly from the main page).

·   I felt like I had to scroll down a bit more to see everything on the new home page.

·   The new main page includes more graphics (clock, larger thumbnails).

·   The beta page does a better job of spacing out different topics, separating each with larger text and more distinct boxing. It seems to take the “widget” look further than the earlier design.

 

 

 

1. Why would a neutral color – gray in the case of the BBC site — be a good idea for the toolbar anchor point? Wouldn’t a bright color be better at guiding the eye to it?

1. Is there a downside to offering too many customizable tools? Can this alienate some beginner and intermediate users?
2. The site doesn’t seem to stay consistent with color. For example, different categories use different colors, and the new main page (and BBC logo) is now green.  Is there a benefit to mixing  up color?