OUGD602 - Website design

Towards the back end of 2017 we were tasked with creating our own website to form the backbone of our personal identity. Having a website today is the first impression many of the times so I approached this task seriously as I literally wanted the site to be the backbone of my identity, with me designing the site long before I would consider any of my personal identity. For the task we were informed of the many hosting sites available, and after experimenting with a few and budgeting the cost of each I decided to use Cargo Collective to host my site. I chose it as I felt it was fairly easy to use after some messing around with, but also the site gave me the chance to create a blank template for my site. This was important for me as I didn't want to use a stock template and look like thousands of other creatives out there. Being able to put my own touch on the site was crucial, and through Cargo Collective I was able to reflect my own style through the site design.

From the off I had an idea of what I wanted my site to look like, simple, functional, characterised through type and use of symbols if possible. However, I knew the work come first as I didn't want to overshadow my work with elaborate design. I looked at some of my favourite studios and designers sites for inspiration but in truth, my site naturally developed once I spent a few hours or so on Cargo. I messed around with numerous layouts but felt the simplest compositions worked best. Another beneficial aspect of Cargo was also it having many web fonts already installed. This saved me to hassle of buying web fonts and coding them through CSS. And luckily Space Mono, my favourite typeface was installed so I felt it was necessary to use this, as it represents me but also helps the simplistic layout of the site stand out.

EXAMPLES OF SITE ARE MOST UPDATED VERSION/ DIFFERS TO ORIGINAL

https://tomdixondesign.com/

Homepage
I wanted all my work on the homepage so its allows the viewer to jump straight into my work. On the masthead it includes my logotype, about and contact. Once you scroll down you can access all the work, with a thumbnail image left aligned with the project name, category and learn more all situated below the thumbnail. You can access the full project through either clicking the image of 'Learn more'. At the bottom of the page you'll find a footer with my email address and number which gives the viewer a quicker way to reach me. The white space on the site really gives it a structured feel I believe, it also helps the left aligned thumbnails stand out within the site.

About page
The about page again is simple and uses white space to create a structured feel. The page is stylised by a duotone image of myself (Temporary) and all my relevant details and how to contact me. It includes a basic bio (Needs developed) and other little touches such as giving links to my Spotify and Instagram which makes the experience a lot more personal but also gives the viewer a broader image and perception of me as a person and a designer.

Project pages
The project pages are high impact with the work covering the entire page at once. Once choosing a project the viewer is shown a introduction of the project which cover what?, how? and why? then from here they are able to scroll through the work which is all in landscape image form. At the bottom of the page is a navigation which can either link the viewer back to the homepage or to the next project.

 

One necessity of the site was that it was responsive with both desktop and phone devices. From constant tweaking here and there Ive been able to create a cohesive site that is functional on all devices.