Responsive Website
Project Overview
I built my portfolio website during my Front-End for Designers course as a central place to showcase my design work, share my process, and connect with potential employers and collaborators. I used basic HTML, CSS, and JavaScript in Visual Studio Code to build a responsive website and practice translating design into code. The site is fully responsive and highlights projects through case studies, skills, and tools. Beyond presenting my work, it demonstrates my ability to apply design principles in code, structure content effectively, and deliver a polished, user-centered product.
Tools Used
Figma
VSCode
GitHub
Context and Challenge
Coming from a music background, I needed a way to establish credibility as a designer. A traditional resume alone couldn’t fully capture my skills or story — I wanted a portfolio website that could highlight both my design thinking while also enhancing and demonstrating my ability to execute those designs technically.
The main challenges I faced were:
- Storytelling: Framing my career change in a way that feels authentic and compelling.
- Skill demonstration: Proving I can not only design in Figma but also understan how the code is built.
- Accessibility & usability:: Ensuring the site works across devices and meets usability standards.
Process and Insights
Solution
The outcome of this project is a responsive, minimalistic portfolio website that highlights both my design work and my technical initiative.
- Clear storytelling of my transition from music to design.
- Responsive design for mobile, tablet, and desktop.
- Smooth scrolling and navigation for easy usability.
- Interactive elements like a back-to-top button.
- Project case studies that emphasize process, not just outcomes.
- Accessible color contrast and typography to support readability.
Insights
- Iteration was crucial — feedback led to improvements in clarity and user flow.
- Building from scratch strengthened my ability to translate design into functional code.
Thanks for stopping by!
If you have any questions or would like to connect, please reach out via the contact form below.