Layout Choices, Continued Research and Paper Prototype Results

I began with a wireframe of what the paint splatter idea could possible look like, with the circles in the menu being the splatters.

But I soon realized my heart wasn't in this idea. Even though it would fit the 'art' theme, I felt more inclined to go more with the simple and clean layouts of the galleries of best web design that I'd studied, which had very simple menus. I also thought that would suit an education/information site better than paint splatters, which would look a bit informal and immature. I also spoke with Philippa in regards to the Facebook, Flickr, Youtube logos and she suggested that they may not be needed as they're already on the Witt Art website, so I removed them from the design. With all this in mind, this is the next wireframe I'd come up with.

I also began experimenting with colour palettes, since I didn't know what sort of colours I'd be using. Since I love blue and wanted to have that in the menu, I decided to start with that and see what it came up with. By choosing the accented analogic option, it came up with four colours.

I liked the look of these, particularly the middle 'original' hues, so decided to go with this colour scheme. Using the colour palette was very helpful as it gave me some direction where the colours could go. I also looked at the other combinations besides accented analogic but thought they were a bit too on the plain-looking side. The accented analogic, particularly the orange, added a bit of spice to the colour scheme and looked good, I thought. I decided not to add it in but now knowing what the colour scheme could be and with the starting sitemap completed I decided to work on the finer details later and enter paper prototyping stage.

I tested the paper prototype on my Mum, who is a relatively frequent internet user who is slightly outside my target market but also a good test subject as ensuring the website is easy to understand for all ages means I've succeeded in making it user-friendly and there's always a small chance that some from my primary target market also have varying experience levels with using the internet.

My prototype was mostly successful, but some suggestions were made. Her first was that there'd be an option to go back to the top on the side of the page (the way I'd imagine doing this is putting one like on Tumblr which follows wherever on the page you are). This would've saved her hitting the back button or scrolling right up the page each time she wanted to go somewhere different. It's also easy to hit the 'home' or 'backspace' buttons on the keyboard but she wasn't used to using these and to not have to move a hand away from the mouse would be a good feature.

She told me she personally would've put the library part of the services section to a new page entirely because she wouldn't have searched under the 'services' section for information on how to reference.

The home page was also rather empty so I suggested perhaps moving the 'course and pathways' and 'timetables and calendars' information to the home page might be a good idea, and she agreed. One of the first things people wish to know in a handbook would be when the important dates (like hand-in dates) fall, so this seemed like a good change to make.

She said that the simple locations of the menu and other things made it mostly easy to understand, so in that way I succeeded with my choice in choosing a very simple layout.

Major Project: Week 1 Research

One of the major motifs that remained in my mind to use as the visual design for the final project was the idea of paint or ink splatters, particularly in the menu section of my site, so one of my first searches I used in researching the target market and graphic design was to search for plaint splatters used in a graphic design context so I could work out what sort of paint splatter image style I liked and didn't like and what sort of styles had been done the most so I could avoid them in order to keep my style as original as possible. I wanted to use paint splatters first because it's an art department handbook and paint splatters signify art in an obvious way and it could look effective if done right.

Image 1: http://www.evohosting.co.uk/blog/web-development/design/more-free-social-media-icon-sets/

Image 2: A PS3 theme from psu.com

Image 3: http://www.123freevectors.com/paint-splatters-free-vector/#.Ul3K7ifFXh4

For target markets, it's in my experience that the vast majority of applicants are young people in their late teens or early 20s up till about the age of 30. Because it's not a kid's or young teens site it should be quite formal in most respects overall since it’s an information site, but since it’s an art department site it should have some controlled elements of fun and modernism. The target market are not too old to enjoy a strong visual presence but it's also important that the information isn't overpowered by it. So for that reason I've decided to keep the paint splatter theme to mostly the menu and keep the information sections relatively formal.

I went to www.thebestdesigns.com to see what they had there, as keeping up with web design trends isn't something I usually do. I took some screenshots of particular ones that caught my eye.

(if these pictures are not showing up they can also be found in the "Graphic Design Research" word file.

What really struck me the most of all these was how relatively inconspicuous the menus were in terms of sizing and colours. Simplistic and obvious placement of the menus has also remained in fashion. The key to these web page designs is mostly simplicity. The most surprising part of these web designs for me was that they seemed to indicate the placement of the page titles in the middle of the page as having come into fashion (with logos remaining in a simple place up top). Because the purpose of my website is education-related, I'll probably be less adventurous with the title placement, keeping it near the top of the page as in the top screenshot. I can perhaps take inspiration from these in terms of the menus however, with the wide space between the logo and the menu, and the simplicity of the menu in terms of colour palette.

I found out the most popular resolution for web is 1366x768. This seems a good resolution to test out the idea of having a lot of space between elements of the page.