Why and How Did We Build This Project?
It can be limiting and intimidating to draft a portfolio without any idea on knowledge on the kind of portfolio designs that exist. Additionally, some users may need varying portfolios for different types of positions they seek. Hence, our team created a website that links to three different types of portfolio templates for user’s to customize and edit based on preference. We began by outlining the different types of portfolios that people can choose from, as well as planning the features of each portfolio. Once we formed a general idea, we set up our individual environments to support Flask, Python3, CSS, and HTML. These are the technologies we used to build our project.
What it does
The home page links to the three types of portfolio templates, and each template links back to the home page.
A professional portfolio is an excellent way to present your work to potential employers and display the skills that qualify you for a position. This standard portfolio does exactly that. With its clean and simple design, it won't get in the way of the content. Starting with the About Me section, the portfolio aims to deliver the required information in the most simplest of manners. It also exhibits your education, accomplishments and experiences. The quick links to your social media pages and the latest articles there helps the viewers gain a comprehensive view of you.
The detail-oriented portfolio allows an interactive interface for portfolio viewers. These interactive features include an editable text box with a default message that can allow viewers to take notes, active links, and a map for viewers to see the location of the portfolio candidate. The map can be zoomed in and out with a pinpoint on the candidate’s location. The header of the page includes links to the home page, GitHub profiles, and LinkedIn profiles. Below these active links, are icons or gifs relevant to the candidate’s companies. Within the site, there is a background image to the profile picture, and a headline of the candidate. To gain insight of the portfolio owner’s professional experiences as well as personality, there are tables of candidate information. The tables are two column tables. The first column supports professional titles, with drop down menus to provide further information regarding their professional experiences or licenses. The second column supports bulleted information for the candidate to place any fun facts or comments that generally are not covered in interviews or resumes. There are checkboxes aligned with interests of the candidate for viewers to check off for any interesting interests to bring up as topics of discussion with the candidate. There is a series of photos in a table for the candidate to display any images related to their professional details or interests. The footer of the page has direct “mailto:” links to the candidate’s email as well as a LinkedIn link for contacting the portfolio owner, conveniently near their checkboxes of interest for topics of discussion. There is a drop down menu in the footer to further display the addresses of the active links, which allows viewers to copy and paste any contact information or relevant links.
The design-Portfolio is more focused on the design of the template but it also has important functions. In the main page, you can see a background image, a main image, a title and the main information of the portfolio owner. There is also a wave style. The whole page contains font styles and some figures to decorate it. There are colors divided in different sections, and a navigation bar that makes it easier for the viewers to interact and get information from the page. This navigation bar links to the home page and also to other sections in the same page where the owner can put any information as they wish. The bar also contains images/icons that redirect you to other websites like GitHub and LinkedIn. In the footer is a “mailto:” link so the viewer can directly send an email to the owner.
Challenges, Accomplishments, and Lessons Learned
It was a challenge to get used to GitHub when working as a team. Additionally, setting up our coding environments was time-consuming. Learning how to use Flask was new for all of us. We’re really proud about the outcome of all of our portfolio templates and the final idea we achieved. We think it gives good options to the viewers about the use of templates. We learned new functions and how to properly use CSS, HTML, Python3 and Flask. We also learned how to collaborate on important platforms like GitHub.
Log in or sign up for Devpost to join the conversation.