This is a portfolio for potential employers to review to get a quick overview of my work experience and to demonstrate my ability as a programmer. It will contain a standard CV as well for employers looking for a more traditional resume. This version is however more user friendly and pleasant to look at giving a quick synopsis of my experience, personality and abilities.

As a first time user I want to find it easy to navigate the site and the content should be useful and user friendly. It has to be visually appealing so that I will want to return and have a positive opinion of the developer's skills. It should be informative and make me want to pick up the phone and give the developer an interview.

As a returning visitor I would like to be provided access to further information as I would have had time to think and discuss the portfolio with others. I would likely want to readily have access to contact information where my questions can be answered and have access to a formal standard CV. The interest page should help me gage the developer's potential personal contribution to the company's culture and relatability to their collegues.

I would want to have ready information to the developer's contact details should I wish to call her for an interview. I would likey want access to a summary of the developer's skills should I be considering shortlisting the developer and comparing the developer's skills to other candidates. That being the case I would expect the developer's skills to be favourably presented and readily available.

I used a simple but bright color scheme. I felt that corporate colors like blue are not the most suitable for a web developer as a developer needs to show that they can be relied on for fresh new ideas which brighter colors convey. However I used charcoal to tone down the color scheme so as not to scare away more traditional corporations. I felt a balance between the two would cast a wider net.

The Roboto font is the main font used throughout the whole website with Sans Serif as the fallback font in case for any reason the font isn't being imported into the site correctly. Roboto looks professional and attractive.

Imagery is important. Unfortuately I had to tone it down for this type of site. I used the ideas and coding from the Code Institute lessons as felt it took the portfolio to the next level. I borrowed the ideas and coding of a timeline and visual persentage bars from the Code institue lessons which are visually stimulating, together with the recommended use of font awsome and inputting a map in the interest page to demonstrate js skills.

I used an excel file for the wire frames as I am comfortable and familiar with it and I wanted a vivid clear structure. I have saved it in the wireframe folder as a PDF in the Wireframe folder.

I followed the structure from Code Institute Mini Project with Bootstrap and Putting it all together section so I could have a set up guide and structure. Then I made asthetic changes that I felt were in keeping with the type of information I was presenting

This is the home page, designed to draw the users into the site and build confidence in the developers skills.

This is a mini resume with a synopsis of my skills and peronal interests.

This is a contact form for companies interested in using my skill for specific projects.

This is a page that highlights my personal interests and potential contribution to the culture of an organisation

This page shows potential clients my skills as a developer, by introducing them to previous projects I have worked on.

The CV is made readily available for download on a seperate page, both in the footer and the header.

I have left room for further skills to be added in resume page and will addapt the page to more acurately reflect my skills.

https://fontawesome.com/

https://getbootstrap.com/docs/4.5/components/buttons/#toggle-states

From my mobile.

Used mostly coding from Code Institute User Centric Mini Project Lesson and Putting it all together section.

https://validator.w3.org/nu/#textarea

https://jigsaw.w3.org/css-validator/validator

For the coding, most was borrowed or advised from the modules. The structure and coding was from the portfolio project and Putting It Together lessons.

Git was used via the Gitpod terminal to commit to Git and Push to GitHub.

GitHub is used to store the projects code after being pushed from Git.

The W3C Markup Validator and W3C CSS Validator Services were used to validate every page of the project to ensure there were no syntax errors in the project.

• W3C Markup Validator - Results
• W3C CSS Validator - Results
• I tested the pages using - (python3 -m http.server) in Gitpod so I could see and adapt changes.

I started out by creating a Git pod project on Git hub. Set up a new README.md file and used the structure from Code Institute as a guide. I copied the coding from my first project making minor adjustments to set the 3 pages, [Home (index.html), Resume (resume.html) & Contact (contact.html/sendEmail.js - from Putting it all Together lessons)] Then I used coding from the Putting it all Together lessons to add the [Interests(maps.js/inetersts.html) and Github(github.-style.css/github.html/github-information.js)]. I created a Wireframe in excel, then print screened it and converted it to PDF so I could drad and drop it to the WireFrame folder I creaded in Gitpod. I followed Code Institute lesson format for the structure and coding. I paid close attention to the guidance from the institute and noted the various methods used to remove unattractive gaps.

Much of the coding was copied from Code Institute Mini Project lessons & Putting it All Together and asthetically adjusted.

The photo used in this site were from my mobile. The loader GIF was from google (https://flevix.com/free-loading-images-gif/)

• I received the original inspiration for this project from my user friendly portfolio in the Code Institute Lesson "Putting it All Together Mini Project." Then used the updated skills from the "Putting it All Together" section of the Interactive Frontend Development lessons from The Code Institute, making minor asthetic adaptation to suit my personal tastes. I felt this was appropriate as I can adapt it in the future to reflect my actual skills and use the structure to create something similar.
• My Mentor for continuous helpful feedback.
• Tutor support at Code Institute for their continued support throughout the course.