Personal Portfolio Site Plan

Overview

Purpose

To build and design a digital portfolio that is eye-catching, simple, and straight to the point.

Audience

Employers all around the world who are looking for a demonstration of programming and design skills from the applicant.

Branding

Website Logo

Style Guide

Color Palette

Typography

Heading Font: Quicksand

Paragraph Font: Mooli

Normal paragraph example

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Colored paragraph example

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Navigation

Site Map

Content

Home page

People would visit my website for a variety of reasons. First and foremost, they would come to gain insight into my skills, talents, and accomplishments. Potential employers and clients may be interested in assessing my abilities and determining if I am well-suited for their needs. Additionally, educators and mentors could access my personal portfolio to offer guidance and check on my progress. Visitors to my website may be looking for inspiration or a source of expertise could also be drawn to my portfolio. This website can also serve as a platform for networking and collaboration and finding individuals or companies I can work with in the future. Ultimately, this portfolio website of mine will offer a glimpse of my creative and professional journey, making it a valuable resource for anyone who is looking through my work and to anyone who is assessing my skillsets. My personal portfolio website will provide information that will help future employers or collaborators to understand exactly what I am familiar with. That means that they can expect to find information about successes and failures on my projects, see reviews of my products (if any), and understand what programming languages I know. They will also want to know the qualifications I might have and the technologies and skills that I have related to them. Visitors might be curious to know more about my problem-solving skills and my ability to tackle complex challenges. Questions might also arise regarding my work methodology. Some visitors might also be curious about what future projects I plan on tackling.

Images for the Home page

My Projects

As with any digital portfolio, visitors to my website would want to be able to explore for themselves. They would most likely want access to working examples of projects and access to code resources (such as repositories on GitHub) to provide themselves with a better understanding of my skills. They might also seek detailed descriptions for a deeper understanding of my problem-solving abilities and challenges I’ve addressed or experienced. Visitors to my portfolio website might also like to see information about what I’m currently doing to learn from challenges I’ve experienced and resolved. Some may also wish to get in touch with me for collaborations, job opportunities, or to seek advice, which would stress the need for and importance of having multiple ways of getting in contact with me. Overall, my personal portfolio website should be a great demonstration of my programming capabilities and offer a smooth and eye-catching experience for any user who is browsing my page.

Images for the Page 2

Interact

What would set my personal portfolio apart from every other portfolio website? I plan on making sure that the website has clean and intuitive navigation allowing users to find the content they are looking for quickly. I also plan on having a clean color scheme that is safe for all users (including those who are color blind) and makes elements pop. I also plan on having interactive features such as hover effects, animations, and if time permits, interactive code demonstrations to help drive home my points. I also understand that this website would need to be designed for mobile users as well as PC users. I plan on ensuring that I can load the webpage quickly by using smaller image files. In order for my portfolio to stand out above the others, I plan on taking the time to make sure it is optimized for search engines using SEO and regularly updating the webpage to display my most recent accomplishments and achievements. I plan on using Chrome Developer Tools to help me accomplish some of these tasks by running in-house testing through the Lighthouse reports feature and by validating my code.

Images for the Page 3

Wireframes

Create three wireframes for your site. One for each page and list them here

Home

The projects navigation menu item will be a dropdown menu.

About

Projects

Each project would link to a subpage with more information about the project.