![](https://static.wixstatic.com/media/84770f_0cf5b6c1550a4b8c92f92f1064cc68de~mv2.jpg/v1/fill/w_1900,h_1074,al_c,q_90,enc_avif,quality_auto/84770f_0cf5b6c1550a4b8c92f92f1064cc68de~mv2.jpg)
![](https://static.wixstatic.com/media/a3c153_6f27754e06844d62a1708b316797fc08~mv2.jpg/v1/fill/w_980,h_653,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/a3c153_6f27754e06844d62a1708b316797fc08~mv2.jpg)
Portfolio Case Study
Overview
For this particular project, my task was to create a website that would highlight my skills and experience. I began the process by utilizing Figma to craft a design that accurately represented myself and my professional pursuits. Within the design, I included a navigation bar that featured an About Me section, my Resume, a Contact Me form, and social media links- specifically, my LinkedIn profile to connect with my portfolio. With the design complete, it was time to move on to coding the website while maintaining the integrity of the original design.
Problem, Solution & Impact
Problem
In today's competitive job market and creative industries, individuals often face the daunting task of creating a portfolio that effectively showcases their skills, experiences, and unique talents. However, numerous challenges arise in this process, hindering the seamless development of a compelling portfolio.
Solution
To overcome the challenges associated with creating a compelling portfolio, individuals can adopt a systematic approach that integrates strategic planning, creativity, and ongoing refinement. Utilize user-friendly website builders or design software that offer templates optimized for portfolio presentation.
Impact
A well-crafted portfolio serves as a powerful tool for showcasing skills, experiences, and achievements to potential employers, clients, or collaborators. It enhances credibility and demonstrates competence, increasing opportunities for career advancement and professional growth.
How Might I?
Develop user-friendly digital tools or platforms specifically designed for portfolio creation, incorporating features such as customizable templates, portfolio analytics, and integration with professional networking sites. Streamlining the portfolio creation process reduces barriers to entry and empowers individuals to showcase their work effectively.
My plan for the next 60 days since starting the case study
My professional objective is to become a UX/UI Designer. I am committed to using my expertise to create seamless user experiences that facilitate the process of finding desired information. My compassionate disposition enables me to design interfaces that cater to unique user demands and inclinations. By dedicating myself to this field, I aim to enhance daily lives by making technology more user-friendly and accessible.
To achieve my objectives, I am determined to acquire the essential skills and knowledge required to succeed. As part of this effort, I have enrolled in a boot camp course to build a strong foundation and gain practical experience. Throughout the course, I am dedicated to completing all given projects with utmost excellence. I am confident that by doing so, I will acquire the necessary skills to propel my career and attain my aspirations.
During this time, I plan to update and refine my UX skills, improve my UX writing, update my resume, and seek feedback for it.
Next steps
Next, we proceeded to create the designs for both the Mobile and Desktop versions. Our team then put the designs into Wireframes and conducted thorough testing. We scoured various websites to gather inspiration and determine the appropriate color scheme. From there, we developed a comprehensive Style Guide and designed a Logo. Additionally, we created all necessary images and sourced the perfect visuals for our Hero space.
​
After collecting the necessary color specifications and design format, we commenced the website's creation on Figma. Thorough testing and subsequent iterations were carried out with the team, using the feedback received. Once the site became user-friendly and met our expectations, we progressed to the UI phase, where we incorporated the required hues. Finally, we evaluated the site once more, testing for user approval on the added colors, icons, and typography.
![csportfoliodesktop.gif](https://static.wixstatic.com/media/cc24cb_3e0c44e3edaf4cc59f98388eb2356e11~mv2.gif/v1/fill/w_600,h_364,al_c,usm_0.66_1.00_0.01,pstr/csportfoliodesktop_gif.gif)
Figma Prototype- Desktop
![](https://static.wixstatic.com/media/cc24cb_0cdd7b3dfb324f8ca2e2152c1e158ad5~mv2.gif/v1/fill/w_216,h_449,al_c,usm_0.66_1.00_0.01,pstr/cc24cb_0cdd7b3dfb324f8ca2e2152c1e158ad5~mv2.gif)
The subsequent phase involved the initiation of the coding process. Despite my lack of prior experience in coding, we were able to proficiently acquire knowledge and competently apply HTML, CSS, JavaScript, and Bootstrap to construct my portfolio website.
Below is the link to the coded website.
![](https://static.wixstatic.com/media/cc24cb_c5613635095d4ae387e25b8a84027725~mv2.png/v1/fill/w_511,h_297,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/cc24cb_c5613635095d4ae387e25b8a84027725~mv2.png)
![](https://static.wixstatic.com/media/cc24cb_34a0aab3499b47d284b0041765d3f127~mv2.png/v1/fill/w_396,h_340,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/cc24cb_34a0aab3499b47d284b0041765d3f127~mv2.png)
![](https://static.wixstatic.com/media/cc24cb_b33d9222afba40809699194827457a5f~mv2.png/v1/fill/w_599,h_277,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/cc24cb_b33d9222afba40809699194827457a5f~mv2.png)
![](https://static.wixstatic.com/media/cc24cb_334b294776554d3daebf078679ab88a3~mv2.png/v1/fill/w_599,h_337,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/cc24cb_334b294776554d3daebf078679ab88a3~mv2.png)