Dreamweaver

working website showing the contact form

working website showing women clothing

the homepage in dreamweaver

working animation on the website

womens clothing page in dreamweaver

The next stage was exporting the Illustrator files into Photoshop. Then I had to slice them up, and have them as html. and images into a root folder. Then I opened the files and Dreamweaver and started getting the website to work. I have used hotspots to connect them and made the women and men clothing so that when you hover the mouse on one of the smaller photos they show next to them as the big photo. The most difficult part was making the contact form. Then I had to make an "Introduction" page and add the animation to it and add a hyperlink to take you to the website when you click on it.

Photos

one of the group photos used for the homepage

one of the photos used for womens clothing

one of the photos used for the homepage

the edited photo

the original photo

the original photo

the edited photo

I have asked my friend who has a good camera to take photos of me and two of my friends from college and she agreed. We also took photos of her. We chose a mixture of elegant and skate clothes. We did individual and group photos. The group photos where to be used on the homepage and the individual ones on the women and men clothing. It took a few hours to shoot the best photos we could, then we only had to choose the ones we wanted for our websites and edit them in Photoshop. I have decided to change the red background (wall in my room) to a brown one because it suited my website more. I also had to get them all to be the right size - that took a lot of time. After that I pasted them into the spaces I left for them on my website and that was it.

Designing Damage in Illustrator

men clothing and women clothing

the homepage in Illustrator

about page and location map

The next stage was designing the website in Illustrator. I have scanned some of the sketches I liked and experimented with them. I have thought about the colours. At first I wanted to use black, red and white but then I thought it would be better to choose more mild colours so that the photos which I would add to my website will stand out more. And the brown-orange-yellowish colours suited the graphics I made.  I spent a lot of time on layout to make the website look the best it could look. I researched other clothes websites to see what adverts they have such as "25% student discount" or "Winter Sale" and used some of them in my website. Then I just needed the photos.

Sketches for Damage

homepage sketches

sketches for the graphics

sketches for the graphics and for the location map 

sketches for the menu bar

Next I had to make sketches for the website. In the animation I used building images and circles and I had to used them on my website. I experimented with different drawings made with different media, menu bars, search bars, maps and layouts of the homepage and both women and men clothing.

Splash Page

animation made in Flash

I had to make a splash page for my website next. I have made coloured sketches for it and also a bigger pencil sketch to make it easier for myself because then I just had to scan it in and made it in Illustrator. The theme was urban city. I spend a lot of time researching it on the Internet and developing the final image. Then I made the animation in Flash and added sound to it. I enjoyed this part as I really like to use Flash.

Logo Sketches

The next stage was making sketches. I started by with the logo. I experimented with type and design using different media. At first I chose a blocky strong type and made the logo in Illustrator but it didn't work so I decided to go for a handwritten font which I think suits more. I scanned the sketch of the logo I have chosen and developed it in Illustrator. This way my final logo was made.

The Beginning of Damage

Parts of the reasearch:

I have started making my website by reading the web design brief. Then I chose a name for my website - Damage. The next stage was research. I added images that I associate with the word "damage" such as fire, explosion, broken glass, smoke etc. I also researched logos of well known clothes websites. I looked at the type mostly. I also made screenshots of the websites I liked and that were suitable and added them to my research. I decided to go for a skate and also elegant look for my website. I added photos of models and clothes.