My current capstone portfolio UI screens. Two screens of the portfolio side by side.

Portfolio Redesign

Overview

For my capstone project at Indiana University I created a portfolio website in Figma and then coded the website in HTML, using some json and styled it with SCSS. This project was a blend of practicing my coding as well as my visual design.

Duration

August 2020 - December 2020 (1 semester)

Role

Visual Design
Web Development

The Problem

How can I redesign my current portfolio to be more user friendly and easily scannable? What content is irrelevant and can be removed from the homepage?

The Solution

A primarily one page design with projects, about, and contact all located on the home page. Social media links are located on the bottom, and long descriptions would be removed in the redesign to make easily scannable.

An image of a laptop on a desk with Jaymee's portfolio displayed on the screen.

Research

For this project I looked at other examples of designer portfolios and best practices for portfolios. I didn't have to do as much research as my other projects since this is solely a personal project, and most time was dedicated to development.

Current Portfolio Design

A UI snapshot of Jaymee's old portfolio homepage.

Wireframe for work page (scrapped)

A wireframe image of Jaymee's work page.

Prototype and Takeaways

After creating the prototype in Figma, I developed the website with HTML and SCSS. The website was responsive and you can find the code on github here.

A UI image of the redesign of Jaymee's portfolio homepage.

Takeaways

I learned the importance of feedback and iterative design from doing this project, and also thinking about how the developers will code the design I create when handing it off in the design process. I got feedback from my mentor throughout the process, but I should have asked more people for their thoughts, which I will do going forward.

An image with a side by side comparison of the old portfolio homepage compared to the new homepage design.