Cover Page:
The Airless Tire
Contents Pages:
Home Page: The Basic information needed to understand what the airless tire is, with a little of information from all pages.
Impact/Ethics: This will include both the Impact and Ethics side of things based on the airless tire.
Advantage/Disadvantage: Showing the advantage and disadvantage the airless tire has in different situations and environments
The Evolution: Where the Tires have evolved from, and what might evolve from this tire in the far future
Extra: Any information that I found to not have much link with the previous pages but worth reading about.
Prototypes: This will link with the evolution of the tires and how they have changed through time.
Background: I decided to choose a dark grey image of dried paint for the website. I wanted to keep the background image as close to the colour scheme as possible (Black, grey, white). I chose the image of dried paint as it gave the look of mud and what the lower part of a vehicle would look like if it was travelling through mud or bad terrain. I also liked how it didn't stretch the image when placing it in the background.
The command given to the background was "100% 100%" which means the image will take the entire background vertically and horizontally.
I did have a previous image that was a tire, however the image had too many issues based around its resolution and problems reading the font in front.
HCI - Human Computer Interaction.
Reference: http://www.color-wheel-pro.com/color-meaning.html
Colours:
Dark Purple: Boundary.
I'm using a dark purple to dominate sections of the webpage to show areas of importance.
I've chosen dark purple to organise my information like a table. as it clearly shows where a new topic starts and finishes. I've also decided to chose this colour as it goes nicely with dark blue.
Dark Blue: Headings/subheadings
I'm using a dark blue for all the headings/subheadings, to give a formal and professional feel to the website.
Light Blue: For other information
This colour is used for any secondary important information like:
Stats/facts
links
image-boundarys
I've chosen this colour as its close to the previous colours and will be suitable for the emerging technology.
The main reason for choosing a light blue is to give life to the website, which will stop the website looking boring and dull. Its also a great way to make certain text or information standout.
-May change to black to give the website some depth and feel to the website. I think that it could also make the website look much more formal and grown-up.
Font: White for headings
Due to the heading being a dark purple a white will allow the font to standout.
Font: Black for normal information
Due to the background being a much lighter tone of blue it allows the font to be seen well in black.
Originally I would have chosen the colour scheme of white, black and grey as it would be suitable for the tires, however due to them being airless and prototypes I thought that using some colour would relate to the fact its emerging technology and that soon they maybe the new generation of tires.
Colour meanings in different Cultures:
Blue:
Blue has the most meanings in the world and is very positive. Blue in most religions is sign of hope and good health, while countries such as america see it as masculine. These meanings are similar and which my website wants to portray a masculine yet friendly website for smart purposes.
Black:
The colour black is an absence of colour. Is a mysterious colour typically associated with unknown or the negative. Black is also associated with power, authority, elegance. Black is required for all other colours to have depth and variation of hue. As i'm aiming at businesses and wealthy people the colour black will give the website a formal look and feel.
Dark Purple:
Purple combines the stability of blue. It symbolises power, nobility, luxury and ambition. As i'm excluding lower class people the colour is suitable as it gives the website class. The colour also conveys wealth and extravagance, which would make it obvious who the target audience is.
With these colours used, it would seem that I would not be offending or excluding any culture, of course their maybe a few different meanings to the colours, however its a much smaller target group which wouldn't be a problem to exclude.
Power Distance Index - The Airless tire is a prototype and is only being released to construction companies and the military. This means that the website will have to aim at rich and big companies in order to make relevance to the emerging technology.
Femininity vs Masculinity index - Due to the world having more male drivers I have chosen to use more masculine colours i.e. blue and black.
Update keeping this in mind I have changed the colour scheme a little by choosing black, white and grey.
Client Brief:
To create at least 5 pages about your chosen Emerging Technology (The Airless Tires)
The pages must include:
A Homepage
The Impact
The Ethics
The Evolution
And a added page of your choice:
(Prototype, Extra, Advantage/Disadvantage and a Reference Page)
Initial Brief:
The basic template for all pages:
I wanted a side menu to give the website that little bit more of a professional look. It will also be the location where I can add more page links without creating problems with the normal template. This will be likely the place where I will add more information that doesn't relate to the main pages and the references that I used.
The side menu icon can be located near the top left that can be clicked on, which will open up the side menu. The icon looks like 3 lines like most other side menu icons look like.
(Edit: I may change the icon to look like a tire to relate more to the emerging tech).
Note: You will only see the side menu if you click the icon. The icon doesn't move existing tables when it appears and in stead has the command to go over the existing table.
The idea of having two videos in each page maybe changed i.e. the location...as it can make the pages look like they've been copied and pasted. The videos that are in each page link with the page topic.
I've added in a <<Marquee>> command as i like how it makes the website look active and not dead. I've also checked that most websites that sell products that are low key have a <<Marquee>>
The logo is a airless tire, which is located at the top right. I chose the tire as the logo as its very suitable to the website and its an image that can be made small and people can still be aware what the image is.
I've placed a "title" in the middle of the page to show the viewer what that page is about. While this changes the title "The Airless tire" (Located at the top right), will not be changed.
The footer will contain the words "all rights reserved" with my name.
Draft of Homepage:
The Draft Impact and Ethics page
The Draft Pros and cons page
The Draft Prototypes and its replacements page
The Draft Evolution page
Client Feedback:
What was Said?
That the overall design and structure was nice. I should keep the colour scheme and remove the sidebar and include a different title font. I should add another page that would replace the sidebar to the homepage making 6 unique pages. Each page will include two YouTube videos. The 6th video may not include any videos as its just an add page for anything I wanted to add in extra.
No Changes Made:
The Background, colour scheme, structure
The Changes Made:
The Sidebar, add an extra page, add two videos per page, change title font.
Show Correspondence with client?
I shown a title page, 5 unique pages with added details of what I will include. I also explained on reasons behind all my decisions in front of the client in which the client explained what they liked and disliked.
What was Agreed?
The Client agreed on the background and thought it went well with the colour scheme. The overall structure of the website was liked and agreed on. The Colour of the font (White/Black/Grey) was chosen to stay the same.
We also agreed with two videos per page =10 in total. (They may not be in similar positions depending on changes).
The font of the title would like to be changed to represent tires "a tire font". We agreed that the font could relate more to the topic and give the page a better look and understanding
Difference in opinion?
I thought having a side bar would make the website more interesting and more formal. However, I do understand that it is not needed due to the website not having much content involved... resulting in the side bar being useless.
Instead I will design an extra page on the homepage which will have any extra information i wanted to put in the sidebar in this page.
Suggestions you gave to the client?
I suggested that the sidebar could have different information instead of having the same links that the homepage provides. The Idea was considered but the client chose to remove the sidebar all together.
Disagreement?
Their was no disagreement that I had with the choices that the client made. I understood what the client suggested and the reasons behind it.
Time?
6:04 Mins
Date?
11/01/2018
Second Draft:
Changes Made:
The Sidebar and its context has been removed - (The icon used for the sidebar has also been removed)
The Title for the webpage has a different font (Rugged Ride). Due to the design of the font a box had to be designed to make it clear.
A page has been added to the homepage which will include anything extra I wanted to show or explain in the website.
The Size of the page links and font size has also been updated to make room for the other page link.
Two videos will be in each page... the 6th page may only contain one video (Not sure) as its just an added webpage that wont be big.
The Homepage:
Concluding Points: N/A
