Introduction

I will be developing a website called MCshop and this is a motorcycle shop that sells gear for riders. This is website is aimed at motorcycle riders, making the essentials available to them. This document will simply contain the design of the website. It is essential that there is a design stage before the implementation as this ensures that the website will be developed successfully.

Website review

The website that will be getting reviewed is a similar website to what I am developing. Sports bike shop is a motorcycle shop and they sell a range of essentials for motorbike riders. They sell goods like helmets, gloves, boots, accessories, spare parts etc. This store is somewhat similar to the website I am creating as we will be offering similar goods, however Sports bike shop will offer more goods than my website.

The website is user friendly due to all the components of the website. The website contains several drop down boxes that help with navigation and the colour scheme chosen for the website makes it easy to view the item and it contrasts highly with the items and text making it readable. The layout of the website is remarkable, the top part of the website holding information about the goods and services they offer while the footer has support/company information. The website is fairly straight forward to use which is beneficial as this will encourage their customers to shop with them.

http://www.sportsbikeshop.co.uk/

Site map

The site map shows the whole process of the website, this shows that the site opens up into the homepage and then you can navigate to the other pages. The shop page will then lead to the checkout if the customer choses to purchase a product available.

 

The Screenshot beside holds the design for the website I will be developing and this is the homepage of the website and from what is seen you can tell there are buttons above to help in navigating the website. And then this will hold an image of bikers well suited in safety gear. And in the textbox, I will be giving a brief explanation on the website and then right next to that will be pictures of some of the goods offered. Then below will hold the pictures to the corresponding buttons that can be clicked by customers to navigate to the page on helmets etc.

Cacoo pages

 

	Just like the Helmet page, this is the gloves page. This page is also accessed by clicking on the right button. This page will contain pictures of gloves suitable for riding in the summer and winter with brief description and specification of the gloves in the textbox.

	This page is the helmets page which can be accessed by clicking on the helmet button. This page will contain pictures of flip up and full face helmets with brief description and specification of the helmet in the textbox.

This is the bike jacket page which is similar to the other pages. This page is also accessed by clicking on the jacket button. This page will contain pictures of the jackets that are suitable for riding in the summer and winter with brief description and specification in the textbox.

 

 

 

 

 

 

 

 

 

 

	This is the checkout and here the customer will fill in their information in order to checkout and purchase the goods.

 

 

 

 

This is the shop page. This page will contain the image of goods available for purchase with the detail/price included and from this the user can choose what to purchase.

 

Logo

Colour palette

Above is the screenshot of the colour scheme that I will be using throughout my website, this was chosen using a colour palette. I have chosen this colour scheme because it is generally appealing to the eyes, also this is a colour scheme that will appeal to my target audience as they will be mostly adults and this is a colour scheme is appropriate for them. The colour scheme chosen are all bright colours and I have chosen to go with this because it will make it easier to view the items on the website as some of the items could be of a dark colour which will make it less visible to a customer, so using this colour scheme will create a contrast making the page easily readable.

https://coolors.co/ebedee-e2e9ec-d9e5eb-cde2ed-c1dfee

 

Google Fonts

I have chosen a font to use across the entire website; this font was chosen using Google fonts. I have selected this particular font because of it has the adequate thickness that I desire. And I specifically looked for a font with this amount of thickness to make it easier for the customers to read the text and also the font chosen doesn’t have a fancy look to it, this font dots every “I” and is simply written in the standard way which makes it easy for the customer to read/understand the text.

<link href='https://fonts.googleapis.com/css?family=Roboto:400,500' rel='stylesheet' type='text/css'>

font-family: 'Roboto', sans-serif;

https://www.google.com/fonts#UsePlace:use/Collection:Roboto

Interactivity

I plan for the website being developed to be interactive. First of interactivity is simply the changes that occur when a user interacts with the computer/website. The website being created has to be interactive as it is an informative and also an e-commerce website, so therefore the user will have to interact with the website in order to proceed with an order or gain information. The ways in which the user will interact will be when navigating through the website and also when placing orders. Any other time when the user is not doing on of those actions then they are not interacting that is simply background programs. It is essential that the website can be interacted with as this keeps the customer interested if they can freely do what they want on the website.