Project
Yardley Refillery
Industry
eCommerce
Role
UX/UI Designer
Date
Dec. 23'-Nov. 24"



Yardley Refillery
Yardley Refillery
Yardley Refillery
Providing a responsive web experience for a low--waste living. A community destination for environmentally and heath conscious shoppers to browse a robust menu of refillable household items.
Providing a responsive web experience for a low--waste living. A community destination for environmentally and heath conscious shoppers to browse a robust menu of refillable household items.
PROBLEM STATEMENT
How might we improve the consistency of the website to effectively articulate the company’s identity and introduce its offerings of low-waste products.
How might we improve the consistency of the website to effectively articulate the company’s identity and introduce its offerings of low-waste products.
OJECTIVES FOR USER PAIN POINTS
• Develop a responsive fill menu for users interested in browsing to learn more.
• Create a personalized user profile to incentivize shoppers to understand benefits of refilling and buying low-waste products.
• Develop a responsive fill menu for users interested in browsing to learn more.
• Create a personalized user profile to incentivize shoppers to understand benefits of refilling and buying low-waste products.
User Flow #1
User Flow #1
Responsive Fill Menu. Users can easily navigate and interact through categorized products.
Responsive Fill Menu. Users can easily navigate and interact through categorized products.



User Flow #2
User Flow #2
Multi-Functional Profile. Users enjoy a personalized experience to view orders, favorites, and scan for rewards.
Multi-Functional Profile. Users enjoy a personalized experience to view orders, favorites, and scan for rewards.



End-to-End Process
End-to-End Process
INSIGHT
INSIGHT
Competitive Analysis
Competitive Analysis
I analyzed four companies specific to the low-waste industry. I compared two very similar local low-waste refillerys as well as two large direct to consumer companies. I determined there existed an opportunity to develop a more responsive and personalized experience targeted directly to the local eco-conscious consumer.
I analyzed four companies specific to the low-waste industry. I compared two very similar local low-waste refillerys as well as two large direct to consumer companies. I determined there existed an opportunity to develop a more responsive and personalized experience targeted directly to the local eco-conscious consumer.



User Interviews
User Interviews
I conducted interviews with 6 participants including the two co-owners, 2 stakeholders, and 2 customers. A consistent pain point was updating the website to reflect a more responsive user friendly experience. To transform the website to more closely resemble the "approachable " instore shopping experience. Also, identified was the need to provide users with a personal profile to encourage repeat customers.
I conducted interviews with 6 participants including the two co-owners, 2 stakeholders, and 2 customers. A consistent pain point was updating the website to reflect a more responsive user friendly experience. To transform the website to more closely resemble the "approachable " instore shopping experience. Also, identified was the need to provide users with a personal profile to encourage repeat customers.
Jamie Alford
Co-Owner
"There's a clear need for detailed information about our menu and the great companies we work with."
Karin Mclaughlin
Co-Owner
"Our website just doesn't provide the great experience that our in store experience provides."
Dan Mclaughlin
Stakeholder
"Our current website doesn't do anything to inform our customers about what we offer."
Rob Knab
Stakeholder
"Our site did a great job of introducing us. And we are at a point we need it to provide more for our users."
Robin T.
Customer
"I love shopping at store. The website is just not useful tool at the moment."
Jeanette H
Customer
"The site doesn't tell me much about what to expect or compel me to be customer.
Jamie Alford
Co-Owner
"There's a clear need for detailed information about our menu and the great companies we work with."
Karin Mclaughlin
Co-Owner
"Our website just doesn't provide the great experience that our in store experience provides."
Dan Mclaughlin
Stakeholder
"Our current website doesn't do anything to inform our customers about what we offer."
Rob Knab
Stakeholder
"Our site did a great job of introducing us. And we are at a point we need it to provide more for our users."
Robin T.
Customer
"I love shopping at store. The website is just not useful tool at the moment."
Jeanette H
Customer
"The site doesn't tell me much about what to expect or compel me to be customer.
Jamie Alford
Co-Owner
"There's a clear need for detailed information about our menu and the great companies we work with."
Karin Mclaughlin
Co-Owner
"Our website just doesn't provide the great experience that our in store experience provides."
Dan Mclaughlin
Stakeholder
"Our current website doesn't do anything to inform our customers about what we offer."
Rob Knab
Stakeholder
"Our site did a great job of introducing us. And we are at a point we need it to provide more for our users."
Robin T.
Customer
"I love shopping at store. The website is just not useful tool at the moment."
Jeanette H
Customer
"The site doesn't tell me much about what to expect or compel me to be customer.
Target Audience
Target Audience
I developed two personas based on the insight gathered during the competitive analysis and user interviews. Though different in personality both personas represent real users that face similar challenges and goals.
I developed two personas based on the insight gathered during the competitive analysis and user interviews. Though different in personality both personas represent real users that face similar challenges and goals.

Eve "The Environmentalist"
Eve "The Environmentalist"
A 32 year staunch environmentalist dedicated to
shopping as low-waste as possible.
A 32 year staunch environmentalist dedicated to the shopping as low-waste as possible.
GOALS
Buy as low-waste, healthy, and ethically conscious as possible.
Buy as low-waste, healthy, and ethically conscious as possible.
CHALLENGES
Access to local businesses that support their causes.
Access to local businesses that support their causes.
MOTIVATION
Protecting the environment and supporting their wellbeing.
Protecting the environment and supporting their wellbeing.

Eric "The Local Suburban Parent"
Eric "The Local Suburban Parent"
A 34 year old busy parent that aspires to shop low-waste. But also needs to prioritize affordability and convenience.
A 34 year old busy parent that aspires to shop low-waste. But also needs to prioritize affordability and convenience.
GOALS
Buy as low-waste, healthy, and ethically conscious as possible.
Buy as low-waste, healthy, and ethically conscious as possible.
CHALLENGES
Competing with more convenient and affordable options.
Competing with more convenient and affordable options.
MOTIVATION
Being eco-conscious and while also meeting the needs of their family.
Being eco-conscious and while also meeting the needs of their family.
Affinity Map
Affinity Map
I synthesized the participant feedback I received into groupings to determine key features essential for our product.
I synthesized the participant feedback I received into groupings to determine key features essential for our product.



EXPLORATION
EXPLORATION
Information Architecture
Information Architecture
The sitemap includes the required pages for a ecommerce site with an emphasis on the services provided.
The sitemap includes the required pages for a ecommerce site with an emphasis on the services provided.



User Flows
User Flows
Flow #1 guides the user through the process of navigating through the fill menu and sub-categories discover and learn more about products.
Flow #2 guides the user to their profile to access their personalized information and reward details.
Flow #1 guides the user through the process of navigating through the fill menu and sub-categories discover and learn more about products.
Flow #2 guides the user to their profile to access their personalized information and reward details.



Lo-Fi Wireframes
Lo-Fi Wireframes
Lo-Fi wireframes focus on the the key user flows leading the user to fill menu and profile.
Lo-Fi wireframes focus on the the key user flows leading the user to fill menu and profile.
Mobile Wireframes
Mobile Wireframes



Tablet Wireframes
Tablet Wireframes



SOLUTION
SOLUTION
Hi-Fi Wireframes
Hi-Fi Wireframes
Hi-Fi wireframes showcase a more developed UI vision representative of the branding style. Also, it includes insightful iterations based on the feedback recieved from user testing.
Hi-Fi wireframes showcase a more developed UI vision representative of the branding style. Also, it includes insightful iterations based on the feedback recieved from user testing.
Mobile Wireframes
Mobile Wireframes



Tablet Wireframes
Tablet Wireframes



Revisions
Revisions
Iteration #1
Iteration #1



Original Version
Original Version
Buttons confuse user that it is an interactive button.
Buttons confuse user that it is an interactive button.



Final Version
Final Version
Squared format now indicates the feature is coming soon.
Squared format now indicates the feature is coming soon.
Iteration #2



Original Version
Original Version
List products without any indication of what is available.
List products without any indication of what is available.



Final Version
Final Version
Radio button now filters results to what is currenlty available.
Radio button now filters results to what is currenlty available.
Iteration #3
Iteration #3



Original Version
Original Version
Profile only illustrates to user their current status of rewards.
Profile only illustrates to user their current status of rewards.


