/old_folio

Portfolio project created for She Codes Plus

Primary LanguageHTML

Portfolio Project

This portfolio project is the first assignment for the She Codes Plus course. Its main purpose is to showcase the collection of projects completed.


Wireframe

The wireframe for this portfolio project was created used Mockflow. It consists of three pages:

  • A home page with a brief "about me" section as well as "my stack" section, highlighting the technologies I know (or will know, by the end of the course)
  • A projects page with links to the different projects;
  • A contact form to get in touch.

The wireframe started as a very simple black and white layout.

Throughout the development of the portfolio, as I was implementing the features, I gradually and exponentially added graphic elements.


Typography

The font used for this project is Montserrat sans serif: I chose it because of the easy readability.

I tried to make the website as accessible as possible, using "alt" attributes and mouseover titles for images.


Brand Colours

The original wireframe only consisted of a simple black and white layout with neon green accents, as I was focused on the functionality. The subsequent iterations saw the colour palette change dramatically.

The background colours alternate between pages:

Home Page and Contact Page Body background : #f5f0e1 Text and header/footer background : #1e3d59 Active states and decorations are #ff6e40 Hover state for the nav bar is #ffc13b

Projects Page

Body background and nav bar text : #1e3d59 Text and header/footer background : #f5f0e1 Active states and decorations : #ff6e40 Hover states for the projects: #ff6e40 Hover state for the nav bar : #ffc13b