HgbEdit.com

This was my first ‘real world’ project in the sense it was not part of my university course – I was hired to create a portfolio website for a client who works in post production.

Task Brief

The client required a simplistic, clean and streamlined website to showcase the projects he had worked on and to share his experience and contact information.

I began by creating basic wireframes for each page as well as a mood board.

Mood Board

Mood Board showcasing themes and colours that inspired me for the creation of the website

Wireframes

The mood board enabled me to collect ideas, themes and colours that would help me with the design of the site and the wireframes provided a very simplistic prototype to show to the client. The great thing about wireframes is they are quick and easy to modify – so any changes the client requested could easily be added. It saves a lot of time modifying wireframes compared to modifying an actual coded version and it also shows the client a rough version early on of what the site will look like.

Development and Testing

Using the wireframes I then began developing and testing the site. Development time was not too long (around 2/3 weeks) but what took the largest amount of my time was making the site fully adaptive so it would look professional and work as intended on every device. Browser Stack was extremely useful to help me test the site on a large pool of devices.

My first round of testing can be seen here

Website

Eventually, after mass rounds of testing the site was finished and the client was happy with the final product. I am proud of how it turned out and enjoyed my time creating it as it required me to use parts of HTML, CSS and JavaScript that I had not touched on before – Therefore allowing me to improve my skills further.

The finished site can be found at HgbEdit.com


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s