Sunday, 18 May 2014

OUGD602 // Personal Branding // Website

After trying to design my website myself for the past year and never being happy with it / it not working the best when put live. I decided to look into alternatives which would create the website for me on a template basis. 

After speaking to people who know more about web design and looking at different variations online, I decided to go with Squarespace. I have seen this being used a lot recently with other designers and studios. It offers many templates which are simplistic, but look great on the web, these can all be customised and be changed using html. 

The main reason i wanted to use sqaurespace was the user interface, it makes it really easy to create new pages and upload images through drag and drop. The images can all be resized and re arranged within the screen to create layouts within the page itself. 

Another reason was the fact that all the templates were responsive. With todays world and the massive amounts phones, devices and computer screens we have, a website needs to work on any device, having this enabled within the template makes it much easier for me as it does it all automatically. 

Creating the website -  
Project pages - 

User interface which works on a drag and drop basis. This is really simple to use and navigate around. You simple upload the images you want to use and you can resize them and reorder them on the page. The images can either be singular and you can add more together into a group, its very flexible and enables interesting layouts to be created within the pages. 

Creating a top heading and project description on the page, this will be consistent across the website and gives a brief description of what the project is about. 

As you can see the images are large within the pages. When images are added to the page, it make them the full width of the website template. This is great to showcase the work and means anyone looking at the website will have very clear images to see the work. 

About - 

The about section of the website includes information about me as a designer. This will be split down into sections within the page. I will speak about my own practice, time studying and information about things outside of my own practice. I also want to include information on experience and achievements, as as a graduate designer I think this is important for employers to see. 

To display the experience and achievements, I have created a column down the right hand side to include all this information. The page also has a image at the top, this personalises the website and makes it more interesting to look at.  

Contact Page - 

The contact page is vital for any portfolio website. This will include all my contact details for anyone to contact me in relation to work. I will also include links to social media website and other ways of viewing my work. 

To create the links within the page, I had to code this section myself. Adding the links was really simple and it was done through a hyperlink section on the template. Again the advantage of using the website, everything is easy to do and create. 

Live Website - 
Once I had designed the website, to put it live you had to sign up for a paid account and choose a domain name. All this came within a one off payment for the year and as a student, I got it at a discount price.

Home page. 
The template is based around creating a grid of square images which act as links through to each project page.

Home Page.
When hovering over the images, it turns orange and the project name is displayed. This is the link through to the project page. 

Project page. 
At the top of the project page there is the project description, giving a brief overview of what the project is. 

Project page. 
Scrolling through the page you can see that the images are large and create a great showcase for each of the projects. Image can be grouped and resized within the page itself, to create a more interesting layout. 

About page. 
With an image at the top of the page, this makes it more personalised. The images are related to the page and show a little bit of personality. The information is split into two columns. The main content area is about me and my practise. The right hand column displays experience and achievements. 

Contact page. 
Following the same template as the about page, this again has a image at the top of the page with contact information displayed below. In the main area is all the contact details to get in touch with me and the right hand column includes link out to social media and other sites to view my portfolio. 

I am really happy with the results of the website. Using sqaurespace was a great idea as it has made creating the website really easy for myself and for in the future. But the main thing is that it looks really professional and great to have to showcase my work.   

No comments:

Post a Comment