Portfolio Implementation

After experimenting with hotglue, I began to plan and implament my portfolio. I had to think carefully about layout, content, design and navigation to make sure my portfolio served all of its purposes well.

The first stage of implementing my plans in to hotglue was to design and choose the graphics that I would use in my website. I used a logo that I have previously created in Adobe Illustrator for a personal project and then found the wooden texture on fudgegraphics.com, which supplies textures for free for both commercial and personal uses.
I then had to figure out how to center the splash screen to any browser and any device. I did this by uploading the image to imgur and adding it in using html rather than uploading it straight to hotglue. I then created a class in CSS, defining the size of the image, the center of the image and the positioning of it. I then changed the position style to "fixed". This means that the image will not move from the center of the screen, no matter what resolution or window size.

I then added a hyperlink to the image so that it would lead to the next page on hotglue. I then used the "alt" and area title styles to add the "click to enter" pop up when the mouse hovers over the image.

I then began to build the pages one by one, starting with the home page. I first set out the side bar using the custom HTML and CSS. I did this because I wanted the sidebar to stick at the side all the time and this function is not available using just hotglue.
I made the sidebar by arranging several images that I had uploaded to imgur using simple CSS to set the position and change the position style to "fixed", meaning it will not move when the page is scrolled. I also used the z-index function to ensure the objects were in the right order. I then hyperlinked the appropriate images to link to different pages.

I then began to contstruct the main body of each page using the features of hotglue and creating some basic graphics myself such as the thumbnails for each project. I also found some vector social media icons online for free use.