Vinyl Loop
Vinyl Loop isn’t merely a store where you can purchase records, it’s a sanctuary for true vinyl aficionados .
Industry
Retail
Services
Web Design
Branding
Development
Credits
Creative Director: Jon Bantados
UI/UX Designer: Hobert Nguyen
Year
2024
Approach
Our approach is rooted in how people connect with vinyl today. Shaped by nostalgia, sensory collecting, and a renewed interest in analog rituals, Vinyl Loop slows the pace with a simple ritual: browse, choose, drop the needle. We curate records and gear that turn everyday listening into something tangible, warm, and worth returning to.
User Research
To ground the experience in real buying behavior, we mapped user needs, built personas, and organized insights through an affinity diagram. The patterns showed that vinyl shoppers buy with intention and rely on trust signals.
Key friction points were unclear stock availability, shipping costs that break budgets, and uncertainty around condition and sound quality. These insights shaped a clearer, more confidence-driven flow with fewer drop-off moments during checkout.
Wireframing
We mapped the full user flow from browsing the catalog to product pages, wishlist, cart, and checkout. A key focus was the filter panel, which helps users search faster by narrowing results through record details like genre, artist, format and price range. Alongside the structure, we built a style reference covering logo usage, color palette, typography hierarchy, buttons and links, and a consistent icon system.
Prototype
In final stage, we brought the wireframes into a clickable, high-fidelity experience to validate key interactions across the full shopping journey. The prototype includes core screens such as the homepage, vinyl catalog with filtering, product details, wishlist, cart, checkout, and confirmation, ensuring the navigation and layout feel consistent from start to finish.
This stage helped us test the flow, refine page transitions, and confirm that the interface supports fast browsing, clear decision-making, and a smooth path to purchase.
