So, in week 5 we need to present a layout and site map for the website. We also need to define an audience and purpose for the website. So, here goes…
My website will aim to target a fairly lay audience, who may not have any specific or detailed knowledge of science. I want to produce infographics that make scientific information and statistics both visually and conceptually engaging.
I’m thinking of keeping the layout of my website quite simple, as I think the main feature of the site should be the actual infographics.
Here is a very simplistic flowchart of the pages I’m going to include;
Here is the timeline that I’ve given myself for the next few weeks in order to complete my website;
In order to properly plan my pages I need a consistent theme – and part of this will be a colour scheme, which should unify the pages. This website (http://webdesign.tutsplus.com) includes some very useful tutorials on web design theory. So, I’ve been using this as the basis for planning my own website.
Using a variety of contrasting colours I can help to focus the viewer’s attention on specific elements on my page. I have chosen to use a dark grey background colour for all of my pages. Mainly because this fits in with the chalkboard concept of my page. As I’ve discussed earlier i need my background to not be so bright/ vibrant that it detracts from the design element of the website. In order to focus the viewers attention on the conical flasks on the homepage ( this is important as they are the links to the subsequent pages) I have given them a contrasting white outline.
I also used a really useful website to help me to chose a colour scheme. I felt that just having a completely grey/ black/ white (achromatic) home page would be a little uninteresting. I’ve decided that rolling over the conical flasks and title will provide some colour. Each category of infographic will then have an assigned colour. In order to chose which colours were to be used for the rollovers I used Kuler ( a website which allows for the easy creation of a colour scheme). I wanted each category to have a sufficiently different colour that they could easily be identified as separate, so I picked a compound colour scheme (which is shown below).
So far I have a mock-up of the homepage. Each of the links (the conical flasks and the title page will hopefully change colour as you roll over it. Hopefully the contrast between the dark grey of the background and the white outline of both the flasks and the title will help to draw a reader’s attention.
The initial homepage is above. Rolling over the title will result in the change shown below. The background changes from grey to black in order to help the title become the focus of the page. The conical flask elements also change from having a white outline to a grey one so that the viewer’s attention is kept on the title element.
Above is the result of rolling over the climate change flask. The title disappears to make room for a label informing the user of the nature of the link. All of the other elements are de-prioritised by switching to a grey outline.