Project Six
The final project for this course is to create a showcase website in our group, this then links to the portfolio site for each member of the group. The idea of working in a group is to give us a real hands on feel for what it’s like to work on a website as a team. It will involve working out costs and distributing the work load evenly. We have been assigned groups, and are now discussing possible ideas and names to link all the websites together for this final showcase site. Our intial idea for the name of our company is “Man Down” design. The idea behind this was that we were the only group in class that constited of three memebers, therefore we are man down in the project.
Ideas for showcase
After considering possible ideas for the showcase website we came up with a background theme of a theatre stage that would move and link to all the individual website portfolio’s.
This is the sort of background we were thinking of using for our showcase stage.
The idea would be to add moving lights and interactive elements over the top of the background. We tried to shoot photos in a few theatres in Brighton but unfortunalty we were told that no theatres allow it due to copying of sets. Instead I think we will have to find and possibly buy an image online.
Logo Ideas
We has the idea to use a crime scene photo of someone’s outline to link to the name “Man Down.” Below are a few exmaples of the research and designs for our logo.
This image is really nice we are going to try to use this as an outline to trace round and illustrate as part of our logo design.
Logo Designs
Below are our designs for our final logo to be places on our showcase website. We began by tracing round a few images we found online.
Above is the first trace I tried out on illustrator, I’m happy with the idea and think it’s heading in the right direction.
Ben has traced round an image and begun to work on a logo. We decieded to keep it simple and tried a few web 2.0 style designs.
These two final images are most likely the images we will go with for our final logo designs. They are simple and well layed out and would work well in most situations as the colour theme is very neutral.
Photographs
The next stage for us was to create a banner saying SHOWCASE on our main page. As we wanted to stay with the theatre style theme we decided that light bulb fairground style lettering would work best. I went out with an SLR camera and shot a collection of nice lettering I could find. The idea was that we would then take these elements and photoshop them to create our title. I’m pleased with the lettering I found but may shoot them again in the dark to get a diffrent effect.
Secondary showcase feature
Below is our design for the central element based on the style of the moulin rouge the idea is to add sparkling lights in order to make it animated.
Below is the Gif version of the showcase element with the lights that will sparkle and move in the background. If you click the Gif below you can view the image with the moving sparkles.
Final Giff version with sparkle.
Background
Below are a few background images I have managed to collect using Flickr I think by photoshopping these elements we will be able to start building our Showcase website.
Beautiful interior of a theatre that we could use for our background image.
Header Design
Using the photographs I shot of the lettering we have created a header for showcase in photoshop. The letters have been cut out and manipulated one by one and then lined up. We will add effects to this at a later stage.
Final Showcase Screen Grab
This is our final showcase webiste. I think we have done very well and all the elements we have captured and designed have come together very well. We have added sound effects and the photos of our group will link to our own personal websites. The next stage is to actually create my own portfolio site that I can link from this.
Personal Portfolio Site
The next stage is to create my own personal portfolio site that I can link to the showcase page we have already created for this project. I have explored portfolio sites in great detail in section one of this project and have a very good idea of what I would like to produce for this final project. My idea is something very simple with easy navigation and the work being the main focus of the whole site.
Research
The images below show sites that I have looked at and really like the design of. I think the white background is always the smartest and cleanest looking so I will definatley use white as my background colour.
This site above has an amazing design and very impressive content throught. The simple layout of the site appeals to me greatly and I’d like to take away some of the ideas to my own site
Again a very nice simple design and layout with images being large and centre stage
Really like the look of this portfolio it has a really nice 3D look to it which gives it an amazing impact.
Website Ideas
Now I have an idea of what I want the design to look like I can begin to build the elements for my final site.
My first design ideas for a layout are all very simple and minimal in keeping with my aim.
More in depth ideas but still keeping the style very minimal.
This is my final design idea the next stage it to try and produce something similar on photoshop.
This is the basic layout I will try to stick to throughout the website. The images will go in the boxes and be very large to stay the centre of attention for each page.
I will place the photos in small boxes and then add javascrpt to them to create a lightbox effect which I think will look really good.
This is the design layout for my photography section, I think its looking really good I just hope that I can move this across to dreamweaver without too much trouble.
Final Website layout
Below are screen grabs of my final site. I’m really happy with how it has come out and think I have managed to keep is simple and user friendly like I originally set out to do.
The photography page is the main page that you first land on. I decided to do it this way because I wanted people to go straight into my work and not have to read lots about me first. I saw a lot of portfolios make this mistake and I didnt want to go down the same route.
The design section is the same layout as the photography page. using a lightbox effect the gallery is easy to browse through. I think this system works very well and once you know how to do it it doesn’t take that long. The most time consuming thing is actually re-sizing the thumb nails and slimbox images.
I tried to keep the “About Me” section short and sweet with a small amount of information if people really want to read about me. I don’t want to put too much personal information on the site at this time but may decide to at a later date. I have put what I feel is enough information for now though.
The final page is a contact form that people can contact me directly from. Very simple and minimal in keeping with the rest of the site. The forms link directly to my email so this is very helpful for the future if I get any clients.
Conclusion
This was the final project for my web design course. I am happy with my final outcome and feel that I have created something decent for someone who had never used dreamweaver a few months ago. When I look back at my work over this course I can see a drastic improvment from start to finish and I think this final site has given me a decent portfolio site to promote myself in the future.
Review of the production Process
Overall I feel the showcase and my personal porfolio site have come out just how we had planned them. We began but coming up with a few ideas, from the begining we decided Ben was the best person to organize the groups requirements as he has had the most experience. Me and Ben came up with the name and the idea of making it a theatre style show with a stage and sounds. We came up with the name “Man Down” because we began with we were the smallest gorup in the class.
For the production of the main showcase website me and Ben did the majority of the work. I went out and shot all the elements on my DSLR camera. I shot each letter for the header individually as we wanted it to look quirky and intresting. I then shot each member of the group from behind so that they could then be placed into the showcase site as links to individual sites. I also collected the images that we used for the background and curtains around the theatre, this took longer then expected as they were very specific and hard to get hold of. Ben then photoshoped the elements together and added the sound effects to create the final showcase website. Ben voluntered to put all the elements together on dreamweaver and even though I offered my help he was happy to put the final parts together himself. He did a fantastic job finishing the site off and has worked very hard on the whole project. David has collected all the written work as this is right up his street with his day to day job. May has helped with the smaller jobs when they have been requierd such as the creation of the Giff element sparkels.
My personal website is very simple and minimal and I will probably add to it as I gain more experience. My final thoughts are that this project has been a success and I think that without Bens hard work on this project we wouldn’t of been able to produce such a great looking showcase site.
Tom Taylor 
