Web Design I

Summer 2013, Web Design I class,
We had to redesign a website of a non profit organization and I selected Greenpeace.org.
We had a great experience of designing a wire frame, sitemap, Development plan and then finally our own website.
We learned how we should deal with clients of real world. We all was surprised to know that designing a website is whole 3-4 months procedure!! Too many things we need to take care about and all coding and designing issues, Oh My God..!! Such a long but fruitful journey and at the end we got a colorful, sweet fruit of the seed we grew and took care for 4 months.

We learned this website design with HTML coding, give a style through style sheet (CSS), a little bit of Java script and how to design a website so that it would be good for all the medias such as Computer, MacOS, I-pad, and phone.

So above is the recent website screen shot of the greenpeace.org. Yes, I liked the colors most but I wanted to minimize the information as it is too much and repetition. I also wanted to change the inside page so that it would be also as interesting as the homepage.

Below are some of the page screenshots of my website:

This is the Home page of the website
1. For header, there is a logo and a search bra which is helpful to move around the website
2. Minimum navigations makes it easy to understand and make the information only a click away
3. The pictures change one after another as per shown in the bottom showing their area of work
4. Illustration with the donate button makes it interesting

5. if we scroll don we will get a footer with a site map of all the links related to greenpeace and social media link which will take us to the facebook, twitter page of the Organization.

6. This is how my navigation look like, on hover it will become green so that it is easy to read even with the picture in the background.

7. This is the inside page under Mission Navigation link, I tried to make it less detailed and a More button will increase the information bar and add some more information if one wants to read the whole story

8. This is another inside page same as all other pages, less information and a link to become a member so that they can easily go to that page, fill out all the information and become a member of the greenpeace.org.

So the aim of redesigning the website was to re arrange all the information so that it will be clear and less boring and make people aware that they can easily participate and donate for such a holy cause.

To see the whole website please visit this URL:  http://mansipateldesigns.com/homepage.html

Audubon Nature Festival

Audubon Nature Festival Featuring Eyes on an Owl was a Nature festival for kids where they will be participating in different activities. I designed a paper owl patching different textures and design of papers to attract the kids.

Poster and a black and white inflate was also designed for advertisement of the event. Which was again in required colors 

 A banner was also designed. It was a large sized banner. It was not aimed to be informative. But it was to attract the viewers.

Some stickers and a lawn sign

were also designed in two color

Project Navigation

The Navigation is the visual map to see the message. It draws the path for the viewer and suggests where to go after each section. and what to raed after one another.

I-Pad Application: For the Project Navigation, an I-pad application was designed and the target audience for this application was the normal people who are not designers but still wants to know what designers learn in the designing school. " The journey of the semester I" is the title of the application.  All the description is non designer so that people can understand in general what all the elements of design are there around them. Whole design was divided in two parts: Black & White and color. Here black and white part shows the learning stage where the elements are not arranged properly or without designing while the colorful part shows how and where the designing capacity reached after getting knowledge. On landing page the two different buttons are given which will take directly to the stages named
"Learning" and "Designing". The black and white images changes dramatically with a tint of color and ends up with a colorful world. This is a surprising element which draws the viewer's attraction.
The navigation is showed with the square block of solid color or with the negative space. The navigation path draws the attention of the reader from page to page though no page is divided in page after page manner.
All the information or the pictures are from the blog but still the information is different due to different target audience.
A bunch of squares takes the reader to the blog for some more information regarding that element and a diamond near the name of the element, takes them to the project which was done for that element.

3D: For the 3D project the whole application was presented in a way that one can touch and feel what is it all about. To Continue the square theme, the dice was taken as a product and the outer part was designed with black and white learning stage. One side is with tint of some color, encouraging the viewer to open that box. While he opens the box, again the world blast with color and ends the journey from black and white to the colorful world and the dice became box, inside out folding. The joints of the box is stick together with magnets so it will allow the box to be converted inside out and black and white dice will become the colorful box.