Blog Template Design Change

After completion of my website design I decided to update and change my blog design to tie in with the theme of my website. Above is a picture of my previous layout. The key changes are the background, banner and header bar.

Alternative Website Screenshots

                       

Website Screenshots

Screenshots of my Website design pages include; Home, About me, Gallery and Contact Me.

Reviews

One of the outcomes for this project was to evaluate. I produced an evaluation of my own design aswell as a review of the website program we used to make our designs.

Building website Presentation

https://docs.google.com/open?id=0BwzH5cSPqMGMRUd4SXp5U2JnVlE

During the process of building my website I took several screenshots of developments, experimentation and mistakes. I annotated these in a presentation format to explain how I built my website.

Cursor for Blog

I tried to create a cursor for my blog using my own images. I managed to successfully create the cursor on my blog but I needed a link for the html to work. I uploaded the cursor to google docs therefore creating a link but when I inserted this link into the template of my blog it didn't work.

Design Moodboards

To help inspire my website design I created a series of moodboards. These boards I can use as a reference point when I create my website. On each board I outlined the potential colour palette, the patterns and textures I might use, the images that have inspired the theme of the website, and practical things such as font face and buttons.

Site Map Design

As part of my website development I used created a site map to help me decide what pages will link and what pages wont on my website. The design of the map ties in with my logo variations page.

Logo Variations

For my website I needed to design a logo that represents me. These are the styles I came up with, I experimented with different colours and variations. I decided to base the logo around my name, I made a K out of spiked petal shapes and the swirl represents the G in my last name. I wanted the overall look of the logo to be vintage so I added a textured background underneath, so it wasnt a block colour.

Flash Gallery

To display my work on my blog in an easy way I decided to install a flash gallery onto a separate page on blogger and link it, unfortunately the page layout cannot be changed from the normal blog layout so now my gallery has links on the screen and is pushed into the side bar.

Adding Links

http://www.elegantthemes.com/blog/resources/beautiful-free-social-media-icons

To get the buttons for various social networking sites I googled social network buttons and went to the above web address. I downloaded the buttons, extracted them from the zip files then uploaded the images I went to photo bucket and used html to edit the images and make them linkable.

I did a similar process with the links on the owls but I also added my own html called hspace and vspace to seperate the images out.

Research Powerpoint

https://docs.google.com/open?id=0BwzH5cSPqMGMX1A3NW1FcDZEbWs
My second task was to research different websites, blogs and demographic groups and put all this research into a Powerpoint Presentation located in the link above.

Web Design Glossary

My first task was to design a web site glossary explaining what certain web design words means, this was to be presented graphically using photoshop or another program.