The purpose of this assignment is to design, develop and deploy a website that showcases a portfolio that will present myself as a developer and an IT professional. The online portfolio will provide information about myself which will present a biography, education, past employment, hobbies and link to various appropriate sites to a portfolio such as, Github, Linkedin, Medium blog, and twitter.

When designing the portfolio, I wanted a minimalistic design that would display all the information that the user would need on the first page.

In the navigation bar I decided to put links inside icons that would take the user to useful websites for a portfolio such as Github for past and present projects, Linkedin for a resume and twitter for social media updates.

On the right of the icons are links to different pages of the portfolio website, which I did not personally want as I was trying to go for a minimalistic design but the project rubric wanted at least four separate html file links in the website. When the user clicks on the biography, education, past employment or hobbies, it would just change the slide to the respective tab.

What I would have done instead is a about me page which displays the carousel that would allow the user to cycle through the biography, education, past employment and hobbies information. A my blog page that would take the user to my medium profile and a contact me button would drag the page to the bottom where the contact me form is displayed.

So I decided to implement a carousel that would display four different slides which would include a biography, completed and ongoing education, past employment and hobbies. The carousel would allow the user to either move the slides manually by clicking on the left and right arrow buttons on the sides of the carousel or let the carousel move automatically after a period of time. The dots on the bottom of the carousel represents what slide the user is on.

Since there are multiple different devices for users to access the portfolio such as PC, tablet or smartphone, I need a hamburger menu which would change the navbar to a collapsed version of itself, so the website would look aesthetically pleasing to the user on a mobile device. For this to be able to happen, a media query needed to be added in to the CSS file for the website to know what size display that it would need to change the navbar to a hamburger menu.

This website would be for employers that are looking to hire a developer or a IT professional. Things an employer would look for in a portfolio would be a CV, which is linked in my Linkedin profile, past and present projects which I have my Github profile linked and general information about me and a way to contact me.

Before designing the portfolio website, i went various different websites to gain inspiration and design ideas. List of websites below:

• https://www.awwwards.com/
• https://dribbble.com/
• https://webflow.com/blog/web-design-inspiration
• https://www.webdesign-inspiration.com/
• https://www.pinterest.com.au/impaigebrunton/website-design-inspiration/

Wireframes were used to create a mockup layout of the website before the coding stage began as it was useful to have a visual of what I wanted the Portfolio to look like.

To decide on a colour scheme for the website, I used http://colormind.io/ which allowed me to cycle through an assortment of colour palettes until I was happy with the colours with the example website template preview that they have on the site. For the fonts, I used Google Fonts, which has a whole library of different fonts, shows examples of the fonts used in a paragraph or title and also generates the html link and CSS code needed to implement the font on the portfolio.

I used a task checklist to create deadlines of each part of the project, as it is useful for time management.

• HTML
• CSS
• Javascript
• Git
• Github
• Github Pages