Final Outcome

The final version of my website can be visited below:

Sound Advice 

There were several key differences from my portfolio website that I had to employ on my information architecture website. These included adding an attatched stylesheet and using css navigation. Both of these features were better for information architecture, the css navigation also made the site more accessible. Overall I am happier with the final outcome of this site than my portfolio site, I feel this is because my knowledge of html and css has grown and I have become more confident in using Dreamweaver. I spent more time on the design of this website also so I feel this was a kery reason in the outcome of my information architecture website being more successful.

Evaluating Final Design

After completing user testing on my information architecture website, I reviewed the comments and thought about how I could improve my website if I was to go about re-designing it. One comment that stood out to me was to make the headings more prominent, I thought this was a good suggestion as it would allow the user to see the headings more clearly and understand the text. Another suggestion that came up was to make the text slightly larger, I used size 12 for the main text content of my website and it was suggested that I could have tried size 14 to increase usability. It was also suggested to have something on the header of the website that informed the user what the website was about without them having to read the text. This would immediately attract the user and they would know what the site content was going to include so this is a point that I certainly would think about addressing.

Chosen Design

After creating my first information architecture design and coding it for the web, I decided that on reflection the design didn't look as effective as I initially thought. I originally designed the site with a red colour scheme, I later realised this colour isn't as easy to work with as blue for example. 

I had difficulty in finding a background that would work well with the main content of my site in the original design and overall I feel the size of the content wasn't the right height. After these considerations, I started to mock-up a second design in Photoshop to see if I could generate any better ideas. I decided to go for a darker colour scheme using lots of grey gradients and subtle blue colour in certain areas. I felt the design looked more professional and modern so for these reasons I decided to go ahead with this design as my final outcome. 

I decided to make the main body of the site larger but have the page content in a smaller section inside the body. I made this section of the site darker to create the focal point of the website as I want the user to be directed to the text content of the page. Using dark background allowed me to use a white font for my text content and I feel this is the best solution for accessbility as it is the easiest to read. 

User Testing

Upon the completion of my website, I asked a group of students from my course to complete a questionnaire in order to gain some user feedback. I did this to see how they evaluate my final site, and what improvements they might suggest.

Name:	Paul
Content clarity: (please bold your choice)	1 / 2 / 3 / 4 / 5
Font size: (please bold your choice)	1 / 2 / 3 / 4 / 5
Usability: (please bold your choice)	1 / 2 / 3 / 4 / 5
Design: (please bold your choice)	1 / 2 / 3 / 4 / 5
Navigation: (please bold your choice)	1 / 2 / 3 / 4 / 5
Other comments: (please keep comments to a maximum of one paragraph)
I think your content is really clear but the headings could be a bit more prominent. In addition, the navigation text should have a slightly larger font size than your content so it becomes just that bit clearer.

Name:	Ron
Content clarity: (please bold your choice)	1 / 2 / 3 / 4 / 5
Font size: (please bold your choice)	1 / 2 / 3 / 4 / 5
Usability: (please bold your choice)	1 / 2 / 3 / 4 / 5
Design: (please bold your choice)	1 / 2 / 3 / 4 / 5
Navigation: (please bold your choice)	1 / 2 / 3 / 4 / 5
Other comments: (please keep comments to a maximum of one paragraph)
A nice tidy site liked it a lot

Name:	Mike J Holt
Content clarity: (please bold your choice)	1 / 2 / 3 / 4 / 5
Font size: (please bold your choice)	1 / 2 / 3 / 4 / 5
Usability: (please bold your choice)	1 / 2 / 3 / 4 / 5
Design: (please bold your choice)	1 / 2 / 3 / 4 / 5
Navigation: (please bold your choice)	1 / 2 / 3 / 4 / 5
Other comments: (please keep comments to a maximum of one paragraph)
Upon landing I had no idea what the site was about until I started reading…. Maybe put something on/in the header relating to your chosen topic.

Name:	Adrian Linley
Content clarity: (please bold your choice)	1 / 2 / 3 / 4 / 5
Font size: (please bold your choice)	1 / 2 / 3 / 4 / 5
Usability: (please bold your choice)	1 / 2 / 3 / 4 / 5
Design: (please bold your choice)	1 / 2 / 3 / 4 / 5
Navigation: (please bold your choice)	1 / 2 / 3 / 4 / 5
Other comments: (please keep comments to a maximum of one paragraph)

Name:	James
Content clarity: (please bold your choice)	1 / 2 / 3 / 4 / 5
Font size: (please bold your choice)	1 / 2 / 3 / 4 / 5
Usability: (please bold your choice)	1 / 2 / 3 / 4 / 5
Design: (please bold your choice)	1 / 2 / 3 / 4 / 5
Navigation: (please bold your choice)	1 / 2 / 3 / 4 / 5
Other comments: (please keep comments to a maximum of one paragraph)
I love the design, it is very sleek.

Initial Design

 

My initial idea for my information architecture brief was to design a fictitious website named 'Sound Advice'. The website aims to provide music reviews and recommendations for open minded music listeners. Having decided upon the concept for the website, I began experimenting with my initial design ideas in Photoshop. In my first mock-up I used a red, white and black colour scheme with simple site navigation. I tried to make the layout as simple as possible as I felt the graphics such as the header and the background would be the main focal points. 

I put my navigation at the top of the page as I felt this would be best for information architecture as the user would have easy access to the navigation and would be able to work through the site easily. I chose the colour red as I felt this immediately attracted the user and created a unique and modern look. After slicing this design and coding it for the web I later felt this design wasn't as effective in the final outcome. I was happy with certain features such as the simplicity of the site but I wasn't overly happy with the colour scheme. This problem would be something I will later address in order to create a better design.