Monday, November 7, 2011

the how

index- the color orange- large image was a royalty-free image cropped, and i added text and small pumpkins in Photoshop.I wanted all the color to flow on the page to have a color theme.The previous splash page was horrible and needed to go far far away from the website universe.

the buttons-i used the same font and same pumpkin image and out together again in Photoshop, cropped it and placed it into the site. Each page had a reoccurring theme of small images that include the ingredients of each item being talked about, including the home page

the headings- each heading is based on the same design except for the pumpkin bread page, because it was done at school, and the other images were redone at home.i did not have the files nor the time to change it up. i spent quite some time on the pumpkin bread page, i like the way it looks

the bread page-the images are step by step of how i mixed the batter, all the supplies and there is also a link on the prep time and and how to mix wet and dry batter togther.

the jack page- pumpkin roll over were added because my original page looked like crap and wasn't very well planned out while i was designing it. there is also instructions on how to make one and a link when you click the 3 images that are together.

the mask page-this is the last page, simple, clean, one roll over. and the roll over leads back to the home page once it is clicked on. all images cropped and Photoshopped to have an orange hue in it. i wanted all images to have an orange hue in it

1 comment:

  1. Mandy
    DESIGN: I am really intrigued with your use of the roll over. The fact that a section of the image changes, implies that it does not look like the image is changing but just a small section – very creative use of the rollover. You really worked on your technical, which is finally working. Watch your use of the grid, and there are big space between the boxes and how the page looks – perhaps all a bit to big for the browser. I feel this could be a very bold and dynamic space but you need to work on your negative space. I feel you have a affinity to the bold graphics - look again at Sheppard Faireys (Obey) or as Elileen stated work of the logos or Michael Schwab. The best page is the one where you took the pictures, I seems that when the time is taken with the making of the objects, and taking of the pictures your design and spacing works better. Why? More pride. I want to see roughs and more roughs
    TECHNICAL: CODE: basically you have done a good job, all the links work, pictures not really stretched, all the images and menus work and your roll overs are excellent!!
    BUT –
    1. Why are you using p tags to define extra space - remember they are marginally different in each browser and should have a style attached to it. You should set this space up in the margins of your styles. you didn't style a p tag or an h tag, doing this is good, proactive coding and makes for user defined scanning with the search engines
    2. div id=":3r", div id=":3b"
    3. never name anything close to a piece of code, - for example .Bgroud
    4. Where is you commenting out?????

    BLOG/RESEARCH/WIREFRAME: Fabulous job with your process – congratulations. I get a full understanding of how you got through your process – congratulations – On a design level – perhaps your general text typeface should be smaller and less funky if you are going to use this as a part of your portfolio. I need the 3rd exercise – boxes with text and set images on you r blog

    ReplyDelete