Wednesday 3 November 2010

Proposal for website design.

For the capture unit I am going to create a sub brand to the sports cloths brand Field to Podium. The new brand will be called Podium and will be more street fashion orientated.

Analysis of the current Field to Podium website (www.fieldtopodium.com)

The problems with the current site are:
No store or information about the products.
No close up photos of the products.
No catalogue of the products.
The 10% donation to sports aid is not “pushed” as much as it could be.
The current website is purely flash therefore there is limited content and does not fill the screen as much as it could.
The flash takes a long time to load.
Every time you go to the page you are shown a not needed animation with distasteful music.
The animations into each section are not needed and do not enhance the viewing of the website.
There is no memorable part to the website, not even the design is worth coming back for.
The design of the website does reflect the idea of the business but only through photograph and does not give justice to the quality of their products.

The website that I propose to build will feature the following:-


Background- The background will still be dark, but will have a patteren over the top with a gradient fill.

Logo and header design- The logo will be white set on a dark background and aligned on the right of the page.

Menu- The menu will sit at the top of the page and inside the header. The menu that I will use is inspired by http://careers.asos.com/asos/. This effect works really well and I think it will look really good on this style of website. The background colour of the menu will darker that the header so that it slightly stands out but so it's not to obvious.

Content boxes- The content boxes will have angled corners togive the site the magazine style layout and some will have a small black border on the top of them.

Displaying the products- The products will be displayed in 237x237px squares so that they can equally fit in rows of four horizontally across the page. The product images will also have a 6px border around them to separate them from the background of the website.

Footer- The footer will stretch the whole width of the page and will contain items such as links to social networks and a site map.I will split the footer into three so more content can be incorporated into it.

Text- The main of the text on the website will be black or white depending on the background it is set on.

Links and headings- The links and headings on the website will be blue and most likely #0090f0 as this blue works well with the dark grey. To the headings I will apply a <span> style to them so that they have a background.

The methods and tools that will be used to create the website:

Photography: I will be using photography for to go into a local clothing shop and taking pictures of their products, which I will then be able to put onto my own site as dummy products. By photographing other brands clothing, for this project, I will save time and money on the store side of the website.
I have spoken to the shop owner of 'Forty Five' and they have agreed to let me take photos of there products to put in my online store.
Once I have these photos they will go into the online store as my products.


CSS: I will use css to style my web pages as it can be easily edited later on if I decide to change the design. I will write all of this code myself so that i then get the result that I am looking for.

HTML: I will code all of the Html myself so that I get the correct structure for the website, the advantage of coding yourself is that you know how the website may react to other changes you may make.

Photoshop: Photoshop will be used to edit the photographs that I had taken in the local store and create the background image for the website. Photoshop will also be used to create some of the other bit map images on the website, such as the the semi-transparent header and the promotional banners like the one at the bottom of the home page. 


Illustrator: I will use Illustrator to create the logo. The reason that I use Illustrator over Photoshop is that with Illustrator I can create a vector image can in the future can be re-sized to any size, for example a post card or a billboard, without the quality changing. 

Prior to doing the research I had many ideas, however the research has refined them and I am now able to go into the website with a clear idea of what I would like to achieve in the terms of how it looks and how it functions. 

1 comment:

  1. You need to expand on the capture planning section - e.g. get permission for shooting, what equipment you will need, what you will shoot etc.

    ReplyDelete