RnB Collection

Renewal · UX/UI design · Website · Research
Totally revamped the R&B website to better showcase the brand and improve the user experience, doing so with a limited budget.
# Branding
# Renewal
# Problem Solving
# Responsive website
# B2B
OverviewResearchDesignFinal ScreensConclusion
View FigmaView Website
Projects
Team Project
2 Designers
Duration
2 Months
Sector
Beauty Hair Wig, Whole Sale, Catalog, e-commerce, B2B
Methods
User Research, Information Architecture, User Interview, Competitive Analysis, Brand design, Prototyping, Testing
My Role
I researched the beauty wig market and analyzed the current site’s issues to plan a branding-focused redesign. While I contributed to both design and planning, the final visual direction was aligned with the overall team consensus.
Project Overview
Overview
R&B Collection has been a trusted brand in the beauty wig market for 20 years. However, its existing Magento-based website suffered from low accessibility, frequent errors due to updates, and difficult maintenance, leading to increased customer dissatisfaction and a negative impact on brand image. To address these issues, we decided to revamp the website within a limited budget to enhance the customer experience.
Goal
We will conduct market research on our main customers, African-American consumers, to understand their preferred colors and brands. Additionally, we will analyze competitor websites to identify and improve any shortcomings on our own site.Our goal is to make it easier for both store customers and our sales team to access the website, obtain product information, and drive sales. By enhancing the user experience, reducing inconvenience, and lowering the site’s bounce rate, we aim to support overall sales growth.
  1. Detailed Wig Information Page: The page should allow users to easily check actual wig color chips, brand information, detailed wig textures, and cap structures.
  2. Accessible on Various Devices: The website should be optimized for seamless access on desktops, tablets, and mobiles, allowing users to use it flexibly from anywhere.
  3. Product Quantity Check via Website: Users should be able to find nearby wig stores and check the stock of their desired wig brands on the website. Additionally, the company should connect an inventory management program to the website to monitor stock efficiently, helping customers quickly and easily find the products they need.
  4. Brand Identity: By consistently applying the logo and primary color palette across the website, we establish a strong and cohesive brand identity. Additionally, storytelling content is used to effectively convey the brand's values and messages, fostering emotional connections with users and enhancing overall brand value.
These features allow users to conveniently use the website regardless of their device or location.
Initial Thinking
Target Users
  • Beauty conscious African-American women in their 20s and 30s.
  • African-American women across various age groups who regularly use wigs.
  • Fashion conscious African-American men interested in durags and grooming products.
  • Wholesale and retail stores that sell wigs and hair accessories.
  • New wig users seeking trusted brands and clear product guidance.
  • Salon owners or hair stylists who recommend or purchase wigs for clients.
Research Methods
  • Online survey.
  • 1:1 in-depth interviews with wig users and store owners.
  • In-store observation at local beauty supply stores.
  • Customer Survey via Phone.
  • Analysis of Competitor Websites.
Design Process
How might we..
How might we renew the website to effectively convey the company’s wig information, enhance brand identity, and improve website accessibility?
Jump to Solution
Research
Part 01
Identifying Opportunity.
We conducted research with approximately 30 customers to identify the website’s strengths, weaknesses, and areas for improvement. Based on 12 key questions, we held 5–10 minute interviews, gathered feedback at a beauty show, and conducted in-depth interviews with 3 sales team members and 5 beauty supply customers. These insights helped us develop clear strategies to improve the customer experience.
Method :  In-depth Interview, Phone Survey, Q&A, Market research and Reviews
Q&A Interview
In-depth Interview (Georgia Beauty Show)
Q1. What do you like most about the current R&B website?
Q2. Have you ever experienced any difficulties or inconveniences while using the R&B website?
Q3. How easy is it to browse and filter through different wig categories or styles?
Q4. Any features you'd like to add or improve, like virtual try-on or color comparison?
Q5. How would you rate the overall design and appearance of the website?
Q6. Do you prefer shopping on desktop, mobile, or both and why?
Q7. On a scale of 1–10, how likely are you to recommend the R&B website to others? Why or why not?
Q8. Did you find the information you needed to make a purchase decision?
Q9. What aspects of the shopping experience do you wish felt more personalized or enjoyable?
Q10. What changes or features do you think are absolutely necessary to improve your shopping experienceon the current R&B website?
Q11. How do you usually discover new wig products or trends online?
Q12. Have you used other wig brand websites? What stood out as better or worse compared to R&B?
Interview Hight-lights
01
It would be great to access the website more easily on mobile and iPad, without being limited by location.
02
I would like to be able to check wig availability on the website and easily find information about nearby stores and their stock.
03
It would be great if social communication, like on Instagram, was more active, and if the website had a younger, trendier vibe
*Certainly, there's room to refine my research approach here! I explore this further in my conclusion...
Customers want easier access, mobile-friendly features, and more detailed information about wigs. They also feel the current design is outdated and lacks R&B’s unique identity. A modern, branded design is key to improving the experience.
80% of customers browse the site across multiple devices and rely on detailed wig information to make purchasing decisions, making clear and easily accessible product details essential.
75% of wig retailers reported that they review product details on the website before purchasing and use this information when selling to their customers. The more comprehensive the wig information, the easier it is for them to close sales.
70% of the R&B sales team observed that retailers are actively purchasing wigs through the website, and that the provided product images and detailed descriptions directly contribute to increased sales performance.
Based on these findings, renewing the website is an important opportunity to make shopping easier for customers across different devices and to strengthen our brand identity. Providing useful information on the site is also expected to increase sales. Therefore, a website renewal is essential to improving customer satisfaction and enhancing our brand value.
We quantified and visualized key pain points based on interviews and surveys with 30 customers, retailers, and sales representatives.
This research allowed us to identify which areas should be prioritized in the website redesign and which issues were most frequently reported as pain points.
Part 02
Researching E-commerce solutions
After comparing three different e-commerce solutions, we decided to choose a company that fits our budget, site maintenance needs, and design specifications to renew our website.
Conclusion: We selected WordPress as our platform to build the website within a limited budget of $2,300. Due to budget constraints, we were unable to implement real-time inventory tracking. Additionally, since we do not sell directly to consumers but through wig retailers, we chose not to include shopping functionality. Instead, we focused on presenting detailed product information in a catalog-style layout to effectively inform customers about our wig offerings.
Part 02
Understanding the problem.
R&B is a beauty fashion wig site that helps users easily find various information about wigs and discover styles that suit them. Through the website, users can set and achieve the following goals:
1. Reflecting the Latest Wig Trends:
  • Visually curating content that showcases the latest wig styles and trends can help customers easily stay updated. Regularly updating trend collections and styling guides will strengthen the brand’s modern and professional image.
2. Website Renewal Centered on Brand Identity:
  • By redesigning the UI/UX to align with the new branding direction, R&B can clearly communicate its core values and personality. Incorporating visuals and copywriting that resonate with younger audiences can lower the perceived brand age and attract new customers.
3. Responsive Web Design and Improved Accessibility:
  • Implementing responsive design that offers a consistent user experience across mobile, tablet, and desktop devices will allow users to access the website seamlessly, regardless of location or device. This can also lead to increased session duration and engagement.
4. Enhanced Product Browsing and Filter Features:
  • Strengthening filter options, such as by color, style, length, and cap type can significantly improve the user experience by helping customers find wigs faster. Including real-life photos or video reviews can also increase product trust and credibility.
5. SEO Optimization and Content Strategy:
  • Running a blog with topics like trend insights, hair care tips, and styling tutorials can drive organic traffic through search engines, contributing to long-term brand awareness and customer acquisition.
Method :  Competitive Analysis, Persona, User Journey map, UX Insights
Competitive Analysis
We should focus on branding and increase site usage across various devices.
Many wig companies focus on branding and making it easy for customers to find wigs and information across devices. We should also identify customer needs and find ways to highlight our brand.
Persona
Based on insights gathered from interviews and competitive analysis related to the R&B wig market, I developed two primary personas that reflect our core customer segments and their needs. These personas capture behavioral trends and purchase motivations, and they serve as a strategic foundation for tailoring the website experience to actual user expectations, particularly in terms of styling preferences, browsing behavior, and device usage.
User Journey Map
We developed a user journey map based on three key personas: the Beauty Influencer, Beauty Supply Store Owner, and an additional persona, the Store Manager. Each persona reflects distinct perspectives and needs, helping us understand the broader user experience from multiple angles. By incorporating these diverse viewpoints, we ensured our strategy provides a well-rounded understanding of user behavior allowing us to align brand direction and website UX improvements with the expectations of real-world stakeholders.
  • The Beauty Influencer considers brand image, trends, and styling appeal. Their social media presence strongly shapes consumer perception.
  • The Beauty Supply Store Owner focuses on inventory stability, supply chain reliability, and wholesale terms key factors in making B2B purchasing decisions.
  • The Store Manager monitors product placement, customer reactions, and sales performance to support daily operations.
Current Website Analysis
Design
Information Architecture
We restructured the menu of the redesigned website and analyzed which information users should see first to enhance accessibility. Through user interviews, we identified key needs and expectations, while also aligning with the company’s direction and business goals to prioritize content effectively. Based on these insights, we brainstormed essential features, quickly sketched ideas using the Crazy 8 method, and developed them into detailed wireframes to deliver a user-centered design.
Crazy 8's
Grid System
The web was redesigned using the grid system. I worked on three devices: web, tablet, and mobile.
Desktop - 1920px / 12 Columns
Tablet - 834px / 6 Columns
Mobile - 390px / 4 Columns
Style Guide
Muhtar Kent, former CEO of The Coca-Cola Company.
“A brand is a promise.
A good brand is a promise kept.”
What’s new?
We used modern visuals and a clean layout to make wig information easier to understand and more appealing. Better navigation, search, and downloadable materials help users have a smooth and simple experience on any device. Now, users can quickly find clear and detailed wig information no matter what device they’re using.
Final Screen
Final Design for Website
Steve Jobs
“Design is not just what it looks like and feels like.
Design is how it works.”
Usability Test
To support the R&B website redesign, we conducted user testing with young African-American consumers who are highly trend conscious. In addition, beauty store owners, managers, and internal sales team members participated in the testing, offering practical feedback from a business and frontline perspective. Their insights helped us refine the design to better align with both user expectations and business needs.
Female 27, Beauty Influencer
After the R&B website was redesigned, it felt much more polished and modern. Previously, it was hard to use on mobile. the buttons didn’t respond, and the overall access was limited.
But now, it’s much more user-friendly and accessible, especially on mobile devices.
Male 40, Sales
The new website makes it easier to find and show products to customers.Clear images and layout help us respond faster, and customers recognize styles more quickly.It’s definitely improved our sales process.
Male 45, Beauty Supply Store Owner
The product image and key information are well-organized on the side, making it much easier to help customers find what they need quickly.The structure allows customers to understand the wig style at a glance, which is also effective in offline settings.The clear presentation of information is truly helpful for driving sales.
Female 40, Customer
The redesigned R&B website looks much cleaner and more modern.It’s easy to browse and see wig styles at a glance.But unlike other brands, there’s no store locator to help find specific wigs nearby or online, which is a bit disappointing.I understand it was built on a limited budget, but a feature like that would really improve the user experience.
Conclusion
Moving Forward
  • To increase user engagement, the website must be designed for an intuitive and seamless experience.
  • Provide valuable content to enhance customer loyalty and continuously improve the website through regular customer interviews.
  • Continuous research is essential to explore effective strategies for strengthening the company’s brand identity.
What I  learned
  • I gained research experience by conducting extensive analysis to optimize the website within a limited budget.
  • I learned to balance perspectives and ensure usability through problem analysis and stakeholder engagement in website renewal.
  • Although my design proposal was not selected, I played a key role in user research and design direction, reinforcing the value of adaptability and collaboration.
  • Communicating with executives and persuading resistance to change was challenging but rewarding, strengthening my skills in logical arguments and data-driven decisions.
Up Next
Pointree
MOPD
© 2025 Designed by Jisoo Kim