Flowchart

This is the flowchart that I created through the process I go through when lifting at the gym. The first image is the initial flowchart created with the corrections that people thought I needed to make. I changed the design and I think the final version works much better then the first one.

Reverse Wire Frames

I created reverse wire frames for the same websites that I did content audits for next. The reverse wire frames shown the overall basic layout of each site and is easier to see design flaws. Football hoops website is very simple and is basically designed in horizontal bands. The bands are sometimes broken up in half and then an image or video is placed in one half and body text on the other side. This layout fills the website up fully and doesn't have any blank space in the design. The helmets vs shields site has a simple 2 column system and then a side bar that is on all the pages. The two column system works well except for the addition of the side bar too. The side bar doesn't have anything that is really needed or important enough to be on every single page. The final page is the hoops for heroes page, This site is laid out pretty well. This page has the main site block and then has a sidebar that has important information that is repeated.

My layout design is a hybrid of all three. I took the idea of have a main header that all of them had as well as the top horizontal navigation. I think a simple 2 column layout would work well with this kind of site and on the main page just have a feature section that you can add videos or photos.  

Content Audits

I did content audits for three websites with similar themes. The general theme that I went for was basketball charity games of some sort. All three sites had some things in common such as a top horizontal navigation and clear depiction of the navigation. At first glance the sites seem to be set up well and with minimal things wrong navigation wise, but once I completed the audit of the sites many incorrect things arose. Starting off with the helmets vs shields site, this site had issues such as each page of the website had a header before the body copy which was a clickable text link however the link was to the page that you were currently on already. After going through the other site (footballhoops.com) I noticed things that were wrong with this site as well. This site has clear navigation at the top but as you click the links to pages and that page loads the incorrect page would then highlight and became confusing as to which page you were on. The last site was hoopsforheros, this site had good navigation going throughout each page the only thing was there was the same exact links on most pages. Possibly this site could be cut down in the number of pages and consolidated into a couple pages instead. Though the sites had some things that could definitely be changed, there was a solid base to start with. If these sites would change some minor things that were only noticed really once auditing all the content then the sites could be quite successful. I think by doing the content audits of sites the navigation mistakes come to the surface quickly. I feel this is a good thing to do for a companies site to make sure everything makes sense. Though tedious the end results of what surfaces is very important.

Final Site

This is the final coding for the website created. The top photo is the css code and then the html code displayed next and the final image is the actual website displayed in safari.

Template

This is the wire frame for the final zen garden website that I will be creating. Next step will be doing the HTML and CSS for the site.

Style Tiles - Zen Garden

These are 3 different style tiles that I created for the CSS zen garden website. I ended up choosing the last one and then moving on and creating a wire frame for the site to work off of.

He made do this!

Tuesday Dec 11: 9-11 am

Finish adjustments on flowchart, print in color and trim

will take multiple choice on 5 and 6


Friday dec 14 by 12

upload to blog NO NEED TO SHOW UP!!

Screen shots of content aufit and 300 word summary of connections and observations

reverse wireframing and composite wireframe with 200 word summary of reasoning.