GolfWang: Optimizing the add-to-cart process
Golf Wang, the streetwear brand by Grammy-winning artist Tyler, the Creator, is famous for its striking designs. While items are sold in flagship stores and at concerts, the website is the main source of revenue.
While exploring the Golf Wang website for a gift, I encountered significant challenges in finding essential product details like pricing and stock status. This cumbersome process not only led to frustration but also revealed that many items were either beyond my budget or sold out after I had invested time in browsing. This experience underscored the urgent need for a redesign, as enhancing the shopping experience could greatly improve cart conversions and boost overall revenue for Golf Wang.
TIMELINE
4 weeks
PROJECT TYPE
DesignLab Capstone Project
DISCIPLINES
UX Design, UI Design, User Research, Prototyping
PROJECT HYPOTHESIS
Product details drive conversions.
Enhancing the shopping experience by providing users with essential product details will boost overall revenue for Golf Wang.
USER RESEARCH
Identifying growth opportunities
User Interviews
To prove my hypothesis and uncover opportunities for growth, I conducted interviews with four participants. I observed their interactions as they browsed for items they were genuinely interested in, noting key pain points that disrupted their shopping experience. My key findings pointed me towards the direct issues and the impact they had on users.
It became clear that users prefer a more informative shopping experience where key details are easily accessible. By improving product visibility and reducing navigation friction, Golf Wang can create a shopping experience that meets user expectations with less steps.
Competitive Analysis
Next, I looked into additional streetwear e-commerce websites to observe how Golf Wang’s competitors provide product detail visibility for their users.
Based on my analysis, competitors regularly displayed a product’s image, name, price, and color options; highlighting the basis of information needed for users. Saving the users additional time, competitors clearly indicated stock levels of products to prevent users from engaging with items unavailable to them.
IDEATE
Brainstorming solutions
My ideation phase began with empathizing with the users’ needs through this HMW statement:
Priority Feature List
To guide my sketches, I created a priority feature list. This helped me focus on ideating solutions that would speak to the entirety of user’s issues and take full advantage of the opportunity to improve the experience.
Low Fidelity Wirefames
This checklist guided my low-fidelity wireframes, ensuring clear product visibility, minimizing navigation, and helping users quickly assess if an item fits their style and budget without extra clicks.
BUILDING & PROTOTYPING
Refining the experience
After sketching, I worked on creating high-fidelity wireframes that spoke to each priority feature.
Display key product details upfront
To include essential details for users early in the shopping journey, I enhanced the product cards on the product listing page by adding the product’s image, name and price. This met user’s expectations of seeing the price of an item while scanning through the website.
Current design:
New design:
Clearly indicate unavailable items
Marking if items are sold out was important to the user because it assisted them in refining their shopping journey. In place of listing the price of an item, I listed items as sold-out allowing users a familiar way to recall details of an item.
Current design:
New design:
Enhance product scannability
Marking if items are sold out was important to the user because it assisted them in refining their shopping journey. In place of listing the price of an item, I listed items as sold-out allowing users a familiar way to recall details of an item.
Current design:
New design:
Responsive mobile design
To ensure a responsive shopping experience, I optimized the mobile design to maintain feature parity with the desktop version. I incorporated color options directly into the product cards, allowing mobile users to easily view and select different variations without extra navigation.
Current design:
New design:
USABILITY TESTING
Putting design to the test
After creating my prototypes, I facilitated usability testing with four participants to evaluate the usability and functionality of the redesigned user flows on both web and mobile. The sessions helped identify key pain points and validate areas of improvement based on direct user feedback. Results showed a positive impact in clearly informing users throughout the shopping process, confirming that thoughtful design decisions led to a more intuitive and satisfying experience.
Addressing areas of opportunity
After sketching, I worked on creating high-fidelity wireframes that spoke to each priority feature.
Improve color swatch buttons
Users found it difficult to select color swatches due to the small size and limited spacing of each color swatch icon. Increasing both the icon dimensions and the padding between them was identified as a key improvement to enhance visibility and selection accuracy.
Current design:
New design:
PROTOTYPE
Demonstrating solutions
Proving the hypothesis
Once I implemented the iterations taken from user feedback, I prototyped my design solutions to further emphasize that adding product details allows for a more efficient shopping experience for users. The design changes made offer users the ability to conserve time, and browse through and discover items with ease.
Final  Prototypes
CONCLUSION
Takeaways and next steps
I set out to improve the Golf Wang shopping experience by making product details easier to find, reducing friction, and creating a smoother browsing flow. Through research, testing, and iteration, I was able to address key pain points such as improving the visibility and tap targets of color swatch icons on mobile. This project reminded me how important it is to design with clarity and usability in mind so that users can explore and shop with ease.
Next Steps
Now that this design streamlines Golf Wang’s shopping experience, the next step is to honor the brand’s roots as a magazine. Based on my research, Golf Wang has a unique opportunity to showcase more photography from past and current drops. Here's how I envision the Home Page with an "editorial magazine" treatment.