WD2~Redesign website interface

Now i show my redesign web interfaces~~stabilo~~

the style use more graphic combine with some collage~~

here my result~~

home page

product page

product info page

feature page

news page

ergonomics page

WD2~Moodboard

WD2~Redo tutorial page

Finally finish de redo section~-.-
this time hav to try separate the background with the navigation bar and images~~
and oso add overflow and background-margin that learn last week~=3

firefox

IE

WD2~Grantt Chart and Sitemap

p/s:~Above layout no my final idea and concept juz try research more about more graphic combine some college style~:|

WD2~html and css code library

I have found some nice html library and css tutorial,oso java script~~

those are great work for enhance my html and css skill~~ 

http://www.entheosweb.com/website_design/jump_menus.asp
http://www.web-source.net/html_codes_chart.htm
http://www.web-source.net/javascript_tutorial/javascript_events.htm
http://www.1keydata.com/css-tutorial/codes.php
http://www.htmlfreecodes.com/
http://www.hypergurl.com/easyhtml.html

WD2~Design tutorial

Some Photoshop skill tutorial in different style~~

-Create an Impactful Child Welfare Poster

~~>http://www.webdesign.org/photoshop/web-layout/create-an-impactful-child-welfare-poster.16440.html

 -Create a Dark and Grungy Digital Art Piece in Photoshop

~~>http://www.blog.spoongraphics.co.uk/tutorials/create-a-dark-grungy-digital-art-piece-in-photoshop

-How to make simple gree wallpaper in photoshop

~~>http://www.webdesign.org/photoshop/textures-patterns/how-to-make-simple-gree-wallpaper-in-photoshop.18893.html

-Design Watercolor Effect Menu

~~>http://www.webdesignerwall.com/tutorials/design-watercolor-effect-menu/

WD2~Beautiful and useful website

i have found some beautiful commercial website that are creative~~
let check it out~~

~wishbone~

-overall the layout and structure very nice~~~

-have interesting graphic and good hierarchy, type treatment~~

- the interesting on the website is the navigation can drag anywhere~~

- sub menu have interesting way to show it,
that have a cute animation to open the sub menu~~

- the overflow have creative way to make overall interesting~~

-the hierarchy of info quite good~~

~ Brown Bag Films~

- interesting graphic and collage style~~

- have different layout at different pages~~
make users no feel boring that the website try to use different visual to attract users.

~EDesign~

  

- have different visual at different pages~~

- some fun animation~~

- different idea at some pages make whole website be creative~~

~modatrading~

 

 

- nice design and typeface~~

-the equipment can drag anywhere~~

other website~~

goochicoo

5pts-interactive

kinoz

WD2~Competitors' website

Here are some competitors' website of stabilo~

Competitors' website1--Crayola
http://www.crayola.com/

Analysis~~

- the style more suitable for it~

- color of layout can be improve,color too oldish~~

- in product pages，have interesting intro flash but the categories too balance.

- try different structure in different pages,but too more style treatment.



Competitors' website2--Faber Castell
http://www.faber-castell.de/36880/Startpage/fcv2_start.aspx

Analysis~~

- Classiss style layout and structures~

- good treatment on typeface and information~

- have images support make eyes-catching~

- the typo color can be better, some of type color too similar with background caused hard to read.

Competitors' website3--Pentel
http://www.pentel.com/

 

Analysis~~

- overall color no bad~

- structure of website still ok~

- type treatment can be better,too more space between the sub navig which at right side.

- the navigation will suddenly disable at some pages.

- have a good treatment on jump menu.

Competitors' website4--Pilot(Singapore)
http://www.pilotpen.com.sg/home.html

Analysis~~

- have a nice and cute background music and sound effect~

- nice layout and structure~

- have some fun animation button.

- nice typeface.

- the icon design can be improve.

- can try more color on information type, some pages of information too boring without any type treatment.

WD2~Redesign Commercial website- Stabilo

ok~~~this is the web design 2 project-redesign commercial website~~

My client is stabilo.

Bottom will show the pages that i have analysis.

~Home page~
 

~Feature~

~Categories of product page~

~product page~

~Environment~

~Ergonomics~

~News~

~Win&fun~

~Contact~

Analysis~

-the site characteristic is colorful but:
-overall too squarlish~~
-layout too simple, no attract user to read it~~
-have graphic or image support but the treatment too common~~
-navigation too messy, easy confuse which are the main navig and sub navig~~