Official ISI web design home page (Digital Design Project 2011)

After presenting my web page to the class I found that something was missing and some stuff needed to be changed.
First, I took off the writing saying, We accept/ Nous acceptons. Since I show a Visa and MasterCard picture, right away one sees that he/she can pay with those 2 credit cards.
Second I took of on the bottom menu "contact us" because I already have the same on the top of the page so I added Site Map instead. I also included a copyright description on the bottom; simple page looks more professional with it.
Last, I added a box with Links of the company's suppliers for Control,automation and instrumentation products.

Web design on Photoshop

This is the first design i came up with. I used the same concept as the rough draft, but I chose a different way of designing it on photoshop because i did not like the menus as boxes. The menu consists of Our Company, Our partners, News, Careers, Contact us. Then i put a couple of pictures of jobs that ISI is currently working on. I added a small description promoting the company's professionalism and quality. Last I put a box on the bottom of the page indicating in which cities the company is located.

I made some changes to the design. I did not like the box on the bottom and took it off. I thought that we shouldn't indicate the city names because when clicking on Contact Us all three location would appear. Instead, I placed the city names under the logo. I added home contact us, and terms & conditions on the bottom. I also drew to parallel lines on both sides of the sheet to give it some more focus

First sketches and flowcharts for the web design

This first sketch is a brainstorming page looking at different web sites and then writing important words and explanations of what the company does.

Second sketch shows how I started thinking of the Home page design. Having the company's logo on the left and putting an English/French tab on the right with a search option. Also a menu was thought. You can also see a flowchart created to show the sub-menus and what they would show and explain.

Third sketch shows a progression of the previous 2.

Fourth sketch shows how the rough draft of my design would be. I chose a similar design to Schneider electrics concept. The menu is designed with boxes and when the mouse approaches a menu tab, the sub-menus appear in a bigger scale. Also I like the idea of having 1 or more pictures in the middle. Makes the site more interesting and people can get a better understanding of what application this company can provide.

Final sketch shows how eventually the sub-menus would look and what each one would consist of.