After looking at a lot of Web 2.0 retro style sites I started to think about how my own site should look. To begin with I looked at fonts that would fit with the theme. While I was researching type I came across a designer Illustrator who had some really beautiful and inspiring work, Jessica Hirche.

I decided to try a chunky face with vintage style fabric patterns styling each letter. I found different fabrics and brought them all into Illustrator with the text I thought would work the best. I selected the text and a different fabric for each letter, went to Object > Clipping Mask > Make and I had a version which had a different pattern on each letter that I could take into Photoshop. I thought I would use the shiny effect I had experimented with in class using a repeated layer and the gradient tool.

I changed a couple of the fabric samples which looked more balanced colour wise.I tried to find social network icons that would fit with the style of my page and downloaded some which looked as if they were stitched. They are simple enough for the Web 2.0 style and relate to the fabric patterns used in the logo. I put them on to a different fabric pattern along the bottom of the page.

Before anything else I chose a colour theme for the site. I looked up some Web 2.0 themes and picked a theme that would go with the logo I had already done. Maybe I should have done that the other way round!

I started to think about the structure of the site. Once I had got an idea of how I wanted the site to look and how I was going to incorporate everything we had learnt about, I put together the layouts for the first couple of pages in Photoshop.I looked at a few different styles for the navigation. Different coloured type for each section, which I did like and different buttons, some as side navigation and some top. For the buttons I drew rectangles in Photoshop and put a smooth bevel on them, with a drop shadow. The idea was to make them look like tiles which fit in with the ‘Cleaning’ theme of the site, (tiles make you think of kitchens and bathrooms, two places which take a lot of cleaning!)

I looked at other social network icons, but decided to keep with the ones I had already found. I made some square tiles in Photoshop, using the workshop we did in class, blending a gradient for a shiny effect. I had two images on separate layers. One was the tile that I had made using the emboss and drop shadow effects. The other was an ellipse which I positioned over the tile shape. I clicked on the layer to be blended, clicked on the ‘add vector mask’ button on the bottom of the palette, then clicked on the gradient tool and drew a line across the elipse to fade one side out. I then clicked in between both layers in the layer panel, and clicked ‘alt’. This then combined the shape with the tile image to make it look shiny.

The second page I looked at when I was happy with the home page was the one which would include the cleaning tips. I put four tiles of the same colour together to make a background for the  text. I also tried the icons for Facebook etc down the side.