Thursday, 10 May 2012

creating my website

I created another wireframe of my home page as i found that some of my other ideas weren't working out, I feel this new idea will work better throughout my website.


After finding a design that would work with my website, i went on to create a web map, so i could plan how many pages i was going to have and what pages would link.

This shows that i will have my main homepage which will have connections to my Graphic Design portfolio, my photography portfolio, about section and contact. I have then gone onto creating 5 more pages which connect to my graphic design portfolio. and an extra one for my photography portfolio which revel larger images of the thumbnails seen on my portfolio. 



After creating the wireframe, it was easy enough to create a visual using illustrator before placing it into flash catalyst. Although i did have quite a bit of trouble deciding on a font that would work with my main font. In the end i chose to work with Couture bold for the main blue font and sheep sans for the small font.


I then transferred my work from illustrator across to flash catalyst. I made sure i had put a grid into catalyst  otherwise i don't think my page would have worked that well.


I then went onto making my buttons work, and thought i could give a taster of what was to come in the portfolio sections by placing an image in the over state of the button, with a 60% transparency, i like the way this has turned out.



I created thumbnails on photoshop. I made the thumbnails 150 by 200 pixels which is a quarter of the size of the web page. I feel this size worked well for my web layout.


After getting all my thumbnails the right size i placed them into a portfolio page, which was pretty easy to do the layout on as i already the design of the homepage to work off of. I made all the images on the portfolios buttons and then added a blur effect to them so only when you roll over the image does it clear.  
The buttons then link to a larger image with information about it.


I wanted to make the image large so the viewer could see the full image rather then part of it like in the thumbnail and read about the images.


I added a section about myself as a designer and a page for people to contact me.



No comments:

Post a Comment