Friday, May 8, 2009

Case Study 3: Website for Muse

www.muse.mu

On the home page, there are eleven main navigation links that remain in the same location.  The groups within the links are very minimal, which explains the lack of a breadcrumb, meaning there is no hierarchy present.  You get the secondary levels once you go into the main link. 

There is one problem, though.  The navigation links are on the top right-hand corner, and is animated.  This makes it difficult to click on a link.  It was only when I scrolled down to the end of the page that I realized the fact that there are unanimated links, which are much easier to click on.  It may have to do with the fact that I am in a tabbed browser (Firefox), but I have not realized the more easily accessible links on the bottom of the page until actually reviewing the website for this assignment.  The login and password fields are also on the bottom of the page, when they are typically on top where people readily see it.

The links (both on the top and the bottom of the site) have a rollover state, but only the ones on the bottom of the website have a selected state.  It does not make sense to not have a selected state for the links that are on the top right-hand corner of the site, since this is what users will see first, but it may have to do with the fact that it was not such an easy task, since it is animated. Maybe.  The links on the bottom have a rollover and selected state so that people know where they are within the site.  Another way to know is by seeing the title of the page.  Since the secondary/tertiary links are within the page, users should not run into the problem of not knowing where they are within the architecture of the site and should be able to get back to the home page at any time.  The architecture is not flat, and to get to the secondary links, you must click on the correct main link first, since there is no way to see a list of secondary links without going to the page itself.  With eleven very specific and clearly-labeled main navigation links, this is not necessarily a problem.  It would be nice to be able to see the secondary links upon rolling over the main links, but this may add clutter to the website and take away from its clean look.

The site does not have that many pages, seeing how most (if not all) of it is done in flash.  For example, once you click on the MEDIA link, you are given the option of “Audio” and “Video,” and the option to listen to songs or watch music videos.  Clicking on the “Audio” and “Video” tabs do not take you to a new page, however, but just give you a list of media links while remaining on the same page.  Probably the page with the most information would be news, seeing how it has “Latest News” and “News Archive.”  This website manages to not take you to a new page, but display a given article within the same page.  Again, this is possible due to the fact that the website is flash-based.

With only two sets of typography, there is very minimal hierarchy present.  Adding more may help, but the website makes good use of color and shading to make the difference clear.  Some other techniques that were employed to create a distinction between the headlines and the body are alignment and the placing of the text.  For example, “Video” and the list of videos along with the links to watch them are all the same.  However, “Video” is a tab, which makes it clear that it is not a part of the list of videos, and the links are blue rather than white.

Jumping from one page to another, the structure of the pages stay consistent.  The content is the only section that varies.  This is to accommodate the clean look of the pages, and to present the information in a logical manner.

If there is a picture on the page, that is the first thing one notices.  However, if the page is largely text-based, then the focal point of it is the background.  Since a lot of the boxes filled with text are transparent, and because you see the change in the background while the content loads, it captures your attention.  This adds to the design of the site because it determines the color palette of the website, largely being black, white, and blue.

Lightening the background image may help with creating a focal point on the content rather than the aesthetics of the website.  There is very little use of icons, the only ones being the conventional play, stop, skip forward/backward buttons, and volume.  Since they are widely used, it took me no time to realize what they meant.

To separate content on a page, shades of black were used to fill in the boxes in which the different contents are in.

The purpose of this site is to promote and sell Muse, the British alternative rock band.  There is an option to search the website, but does not allow you to search for phrases.  For example, when I typed in “Black Holes and Revelations,” the title to one of their albums, it returns a list of pages that include the phrase and each word independently.

I find the playing music feature the most useful, which makes sense because, to promote and sell the band, one would need to get an idea of what their music sounds like, and see if it fits their musical taste.  If there was anything confusing about the site, it would be the navigation system.  They could improve it by making the page shorter so that people notice that there is an easier way to navigate, and perhaps give the bottom navigation links a rollover state even when you are rolling over the animated links on the top right-hand corner.

No comments:

Post a Comment