Soul Waves Project

Overview

Soul Waves is a responsive product website designed and developed for purchasing vinyl records. This project was created with Stephy Wong during a web design and development course, with the requirement of designing a functional and responsive product website.

An image of a tilted Apple iMac displaying Soul Waves website

An image of a style guide of Soul Waves website — Style guide of Soul Waves website.

Design Thinking

The initial style of user interface distracts the users from understanding vinyl records, such as having layered elements incorporated in most of the buttons and forms. To improve, I conducted a more in-depth user research and found that shoppers trust product websites with clear and straightforward visuals. Product-based website should highlight product features and its user interface should support it instead of distracting from it. With a cleaner, less visually distracting style, users can browse products more efficiently, guiding them smoothly toward their goal of purchasing vinyl records. This streamlined design removes unnecessary complexity, making it easier for users to navigate the site and complete their purchases without frustration. The updated design provides a clean and modern look, providing users with a satisfying, visually simple experience that highlights the products without distraction. The colour palette has been adjusted to black and white, accented with ash green. The typefaces have been updated for better legibility, aligning with the minimalistic design and smooth curves. I also designed the 2 logos according to the colour scheme updated.

Challenge

The initial art direction for the website felt more playful and fun rather than realistic and professional. Through the design iteration process, I realized it lacked the texture and depth needed for a product-focused site, failing to convey the tone I envisioned. To address this, I conducted further research on the visual language of modern and professional product websites in the real world, which led me to develop a second, more refined art direction that better aligned with my goals for the website that is to focus more on product features by reducing visual noise.

Key Takeaway

Through this project, I have learned the importance of balancing creativity with functionality to create designs that are not only visually engaging but also user-friendly and effective. Striking this balance ensures the final design meets the aesthetic aspirations while effectively solving user needs.