BY SARAH PALUSZNY
As both an audio engineer and a front-end developer, I wanted to create a portfolio that showcased more than just my sound production work—I wanted it to reflect my ability to design and build interactive, well-optimized websites. This project challenged me to merge two creative worlds: audio engineering and web development. By combining thoughtful design with HTML, CSS, and JavaScript, I built a retro-inspired portfolio site that highlights my recordings while also demonstrating my skills in performance optimization, accessibility, and user experience.
Designing the Concept
During my time at the Jacobs School of Music at Indiana University, I spent countless hours in the recording studio working on live sound, studio recording, and post-production. To capture those experiences online, I leaned into a retro aesthetic. Each category—live sound, studio, and post-production—was represented as a vintage album cover designed in Photoshop. With CSS hover effects, I recreated the feeling of opening an album to explore the content inside.
Adding Interactivity
Static visuals weren’t enough—I wanted the portfolio to feel alive. For the studio section, I implemented an interactive record player built with HTML, CSS, and JavaScript. Users can press play and listen to one of my tracks, simulating the experience of spinning vinyl.
Inspired by that, I extended the concept into the post-production section, where I styled a video player as a retro TV set using CSS. This tied the design back to the album artwork while adding a playful, immersive element to the site.
Optimizing Performance
Once the site was complete, I ran a Lighthouse speed test. While I was happy with the design, the results showed there was significant room for improvement in performance, accessibility, best practices, and SEO.
The main issues were large image sizes and missing metadata. I optimized the images, improved semantic HTML, and added SEO-friendly tags. These changes not only improved page load time but also boosted accessibility and search visibility.
Takeaways
This project started as a way to showcase my audio engineering work, but it became just as much a front-end development challenge. I learned how to balance creativity with usability—crafting an experience that’s visually engaging, interactive, and optimized for performance. It’s a project that reflects both my background in sound production and my growing expertise as a developer and designer.