Tuesday, December 11, 2012

Content Audit


My content audit is large so I took 2 screen shots and also put it up on the server for this class under my name as the folder.. What I noticed while looking at the content from all three sites is that 2 out of the 3 sites are very similar. The Macy's and American Music Theater sites are similar in that they both have a navigation on the side with a similar amount of links within that. Within some of those links were more links to other pages but they mostly remained on that page. The first 2 were very dissimilar form the last. The last site seemed more advanced in its organization and design. The Macy's site has similar navigation but the Rockettes site organizes the navigation so that the user has a better experience. It has tickets, store, and facts about the show. The Rockettes site puts all of that information into main categories and sub-categories. On the Macy's site the navigation is simply laid out on the side for the user to try and figure out. The Macy's site has no sub-navigation so there's no way to tell where you are in the site. I also noticed that everything is on one page on the Macy's site. You can see that with the main content page that almost all of the navigation links lead to that page. On the American Music Theater page the sub-navigation leads to multiple pages. This is undesirable for a user because the user would have to scroll continually down the page rather than just clicking on the next set of links in the navigation. Something else I noticed was that the Macy's site doesn't have an about page. It has details about the show but they are scattered in their own links. When I have the opportunity to change it I will make an about page including all of the necessary information instead of having 3 different links for one concept.

Wireframe 3



This is my third wire frame. It is a site about the Rockettes. It also a Christmas themed site.This site is quite different from the Macy's site. It has navigation and the header at the top. Underneath that there a 5 banners instead of a main content. The sub-page contains the main content. Unlike the other site, this site's usability is more advanced. The user can navigate clearly through the site.

Wireframe 2



This is my second wireframe. I noticed that this site is planned out better than the main one I am working on. There is a primary navigation and a secondary navigation clearly laid out. The sup page is less well designed. Then banner is placed in an odd place so I would move it but it is similar to the Macy's page.

Wireframe 1




This is my first wireframe. This is the main site that I will be recreating in the second course. This website is a website for The Macy's Light Show in Philadelphia. The home page layout has a wrapper, informational header, primary navigation, main content, and the footer. The links in the navigation connect to the main content but it all lies on one page. I think the weakest part about the layout of this web page is the main content. The reason why having all of the content on one page doesn't work is because it is much harder to navigate. It would be easier for the user to get content on each page as if it were its own. There's also no "Back to Top" button for each section so the user has to scroll to the top if they want to go back to the navigation. It is also hard to identify what sections belong to what headers and links. This can confuse the user. On the sub-page, the links also change. That can also confuse the user. The site needs to be consistent so the user can easily find the information they are looking for.
The changes I made were simple changes. The first thing I would do would be to put all of the main content on separate pages connecting to separate links within the navigation. I would have a primary navigation with 3-5 general areas. If the user were to click on one they would find a secondary navigation on the left-hand side. I would also move the banner outside of the main content under the secondary navigation because it can be its own entity. I would create a smaller header with an informational header to the right to draw the user in.

Tuesday, December 4, 2012

Flowchart

This is my final flowchart. I made a lot of changes. I changed the typeface to something more playful and hand written. I connected the arrows into each box so that it connected the points. I also changed the color of the alternate path arrow because it was too close to the other one before.