Brandy Melville
Adding an In-stock availability & Store Pickup Feature
Brandy Melville, a prominent fashion brand known for its trendy and youthful apparel, has built a strong presence in the fashion industry. However, as the digital landscape continues to evolve, it is crucial for the brand to adapt and enhance its digital platform to meet its customers' changing needs and expectations.
The project's main objective was to refine the brand's mobile app by strategically identifying and implementing a new feature. Upon conducting extensive research, I designed and integrated the "In-store Availability & Store Pickup” feature.
Overview
UX Researcher
UX Designer
UI Designer
My role(s)
Zoom/Google Meet
Figma/Figjam
Adobe Photoshop CC
Tool(s)
Final Product
The Start of the Project
What improvements can I introduce to the current app to stay competitive and meet its customers' needs?
As an enthusiastic follower of fashion trends and an app user myself, I recognized that 'Brandy Melville' had the potential to significantly enhance its digital shopping experience. This realization sparked a deep sense of purpose and a desire to align the brand more closely with its customers.
Assumption: Potential Feature Options
After conducting an initial evaluation of the current app, I have identified several feature options that have the potential to be an answer to the question:
01
You may also like..
The brand offers this feature on the desktop version, but not on the app. The app only features 'Recently viewed' items.
02
In-store availability
The brand does not offer in-store availability details for its products.
03
Detailed product info
The brand currently provides a very brief description of the product, fabric info, measurements, and COO in the description section.
04
Reviews
The brand does not offer a review section where users can share their opinions on purchased products.
With those assumptions, my next step involved conducting extensive research to validate them. Simultaneously, I intended to assess the current app's usability and effectiveness while uncovering new potential features in the process.
Validation: Industry and Users
Research #1: Competitive Research
Competitive research revealed that other competitors excel in providing below features on their app, which Brandy Melville could consider for potential improvement:
✔ In-store availability
✔ Customer reviews
✔ Detailed product descriptions
✔ Style recommendations
Research #2: User Interview
The findings from user interviews show that the users:
Have mixed opinions on having..
? Detailed Style Descriptions
? Styling Advice
? Recommended Items
Would love to have..
✔ In-store availability
✔ Reviews & Ratings
Considering all the research findings, I decided to integrate the 'In-store availability' feature.
The feature aligns with users' expectations and preferences, allowing them to choose between online and physical store shopping while catering to their need for immediate access to desired items.
Additional Research: Competitive Research for “Store Availability” Feature
Following my decision to implement the 'In-store availability' feature, I conducted further research to review industry standards and gain deeper insights.
📝 Key Findings
The common approach includes allowing users to check availability by selecting a size and then choosing a store for pickup.
All competitors offered the 'checking store availability' feature combined with the 'in-store pickup' feature.
Store details such as an address, phone number, and store hours are typically provided but often hidden under a drop-down box.
Most brands display store options in a list view.
Based on the additional research findings, I opted to incorporate the "Store pickup" feature as well.
As outlined above, the key findings revealed a consistent trend among our competitors - providing the "Store pickup" feature along with the "store availability" feature.
A Reference Point: Persona
Drawing from my research findings, I established a reference point by crafting a persona that encapsulates the key takeaways.
The Proposed Solution
Adding “In-store Availability & Store Pickup” feature
User Flow “Add an Item to Cart”
As the first step of designing the new feature, I analyzed and updated the current user flow of "Add an item to cart." This is to illustrate how users would engage with the new feature, which helped me build a foundational outline of the design.
Current
Updated
High-fidelity Wireframes: New feature updates
With the updated user flow as a guide, I moved forward to enhance the current app by introducing new elements and designing additional pages.
Here's a detailed breakdown of the modifications:
Update #1: Product Detail Page
a. Relocated the 'Share' button & created a new icon
: to declutter the product detail section after adding the new shipping options
b. Relocated the ‘Product Description’
: to show that the information is a part of the product details
c. Added a new section for shipping options
: to allow users to choose the shipping option before the checkout process
Update #2: (NEW) Store List Page
A new pop-up page for in-store availability & selecting a store for pick up
Users can see the store list by tapping the 'Use my location' button or searching a zip code
The page only shows the stores with the selected item available in-stock
Hidden store details - contact info & store hours
Update #3: Product Detail Page (After selecting a store)
Showing the selected store
After browsing & choosing a pick-up store from the list, the user will be directed back to the product detail page, updated with the selected store name
I also added the 'Change store' button in case the user changes their mind
Update #4: Checkout Page
Checkout page - updated w/ shipping options
I changed the wording 'Add shipping address' to 'Select a shipping method' since there're multiple options now
I kept the same design of 'shipping options' as the one I used for the product detail page to keep things cohesive
User Testing: Gathering Feedback for Possible Iterations
Evaluate usability and intuitiveness of the new feature
Assess integration and visual coherence within the app
Collect suggestions for further enhancements
Goals
Participants
( Total 8 participants )
Add an item to cart with a store pickup option
Item: 'Ashlyn V-Notch Top' in black
Store: 'Americana.'
Review the cart and proceed to checkout to double check
Task
Test Results
The prototype got..
100% Positive Feedback! 👍😍
All participants had 100% concurrence on all questions, confirming the new feature:
is very easy to navigate
has sufficient details/information
is very well integrated with the rest of the app in terms of design cohesiveness
does not need any improvements at the moment
Final Prototype
Monitoring: Continuously monitor the performance and usage of the feature.
Some of the metrics I would use to measure:
User Engagement Rate (Measured by the number of users actively utilizing the new feature)
In-Store Traffic (If feasible, tracking the increase in foot traffic to physical stores after implementing the feature)
Maintenance: Address any issues promptly and consider regular maintenance to keep it up-to-date and functioning smoothly.
Future Feature Development: Research and plan for additional follow-up features such as “real-time inventory” to continue to improve the user experience.
Next steps
"Working within Established Systems"
I thoroughly enjoyed working on this project! Although I couldn't get the brand's entire design system, I was still able to get the fonts, colors, and its logo, and that was more than enough. I'm glad that I got to understand how its app was designed by replicating some screens and other design elements for the project. I was a bit nervous about creating new screens because it was my first time doing this type of project, and also I really wanted to make the new designs seamlessly blended with the existing design. Thankfully, my user testers and others said they couldn't tell if those were newly added. It was such a great experience, and I hope I get to work on more projects like this in the future to expand my knowledge of integrating new things within established design systems.