Portland Leather Goods
Designing a people-centered experience from the ground up
A Portland-local leather goods startup started its brand in a garage, like many businesses and brands before it. They took an idea and their first prototyped bags and wallets to Etsy where they ended up selling with great success and growth. After a couple years with Etsy, PLG learned that Etsy had some big limitations to their brand growth and identity; They couldn’t create their own unique pathways and experiences (in the digital space) that mimicked the experience people were having in their physical stores.
As Portland Leather Goods’ first Product Designer, I owned the end-to-end experience and was involved in all aspects of the product lifecycle; I closely collaborated with a multidisciplinary team focused on improving the e-commerce experience.
How might we improve the collections page to enhance the user experience while remaining consistent with our brand identity?
To get started on this rapid project I conducted discovery and exploratory research including, heuristic evaluation of the website, accessibility review, analytics review, competitive analysis, conducted stakeholder research to uncover business goals and needs.
Qualitative interviews and usability interviews were conducted via Zoom and in person with five participants.
After exploring deep into the problem space, I analyzed, synthesized and clustered the data to create insights and recommendations for design moving forward. This research helped to inform the requirements of the designs, and in collaboration with marketing and engineering we identified constraints, concerns, and considerations.
The top three insights recommended for prioritization and design exploration:
1. It is difficult to navigate on mobile and desktop because there is no clear 'happy path' to get people to where they want to go.
Recommendation: Define the Information architecture
2. 86% of people are shopping on mobile, but purchasing on desktop or tablet because the mobile experience is not good.
Recommendation: Mobile first redesign and continued qualitative/quantitative research to uncover problems
3. There is a high bounce rate on the main collections page because people are frustrated with too much scrolling to find a product.
Recommendation: Shorten length of page and explore new layouts to increase usability; Conduct usability research and preference test before launch
Insights from quantitative research data indicated the current experience was leading to high bounce rates, low conversion rate, and low average order value (AOV). Finding a solution to these problems would solve both business and customer goals.
This research helped us to define our goals and what success looks like for users and business, also gave us a solid foundation to continue moving forward and make sure out design hypothesis and assumptions were evaluated, and how we’re going to measure success.
Based on requirements and refined scope, this is really where I got started in exploring concepts, user flow and defining the IA.
Sketches were shared out with the team for early feedback to give opportunity for refinement; making sure the sketches were including just the skeleton of what we absolutely need based on our requirements and considerations we identified.
After design review, four sketches were chosen out of the lot to work on refining further in high-fidelity and prototyping. I built out a few prototypes and ran concept testing and usability testing to get more insights on experience and usability. I collaborated closely with engineers and marketing to review quantitative data and conduct A/B testing.
Evaluating design explorations with quantitative and qualitative research.
After usability research was conducted, designs were refined further and in the final phase I focused on getting further feedback through design crits with the team to get to final level of detail and polish, finalizing and documenting design decisions, and collaborating closely with engineers to give design feedback during building, and conducting QA before the experience went live.
The shipped design had features like:
-Addition of breadcrumb; which was helpful for customers to know what page they were on. (something heard in research calls) This small addition helped to improve the overall flow and reduced frustration.
-Removal of Portland Leather Goods discount pricing comparison; This made customers feel deceived and gave the impression PLG was going out of business.
-Layout of the bag color options improved, showing all color options underneath the main hero image.
-Emphasis on the new items with a small tag in the top corner of the items image.
Increased contrast ratio with images and text to background color.
-Addition of a sort and filter mode, and different view mode where people can toggle between two images or one large image.
-Refined UX writing and copywriting.
After working with engineering to give feedback during building and QA before going live, we continued to monitor conversion rate, average order value, bounce rate, heat maps, email sign up, and more to see where further product opportunities existed and to continuously make small improvements.
• Increased conversion rate
• Average order value increased
• Newsletter sign up increased
As there was no previously existing design system with UI components, I implemented and established new patterns to ensure consistency and clarity throughout the experience.