01

Soul Waves Website

A responsive product website to create seamless shopping experience.

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 first and final mockup iteration of Soul Waves website — First mockup iteration (left) and final mockup iteration (right) of Soul Waves website.

User Research

To improve from my first iteration, I researched on the visual language of modern and professional product websites in the real world, which led me to develop a more refined art direction that better aligned with the goals of focusing more on product features by reducing visual noise.

Design Thinking

The final design aims for highlighting product features to ensure the user interface supports users to appreciate vinyl records 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.

Final Design Iteration

The colour palette was simplified 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.

Go to last slide Go to next slide
Go to previous slide Go to next slide
Go to previous slide Go to next slide
Go to previous slide Go to first slide

Challenge

The initial style distracts users from understanding vinyl records, such as having layered elements incorporated in most of the buttons and forms. To achieve a more refined and modern aesthetic while minimising visual distractions, I opted for a clean design with rounded borders, replacing the previous layered style and deliberately avoiding bright, contrasting combinations like blue and orange.

Key Takeaway

Through this project, I learned how to leverage visuals to support and enhance user experience, ensuring that design elements serve a clear and functional purpose. This balance ensured the design was not only visually appealing but also met user needs of understanding product features effectively.