The 1st time purchase experience can be super confusing. Our products are unique and takes a bit of education for the new customer to fully grasp what Top Frames are and how they fit onto Base Frames (if you don't know, it's ok—that is why I am here!).
View prototype on:
The Outcome
A redesigned build experience in the funnel that offers additional images and animations along with educational copy that explains/demonstrates what Top Frames are and how it comes together on Base Frames. With this additional clarity into the product differentiator, the aim was to increase conversion rate and the average order value increase as a secondary metric.
Below are the steps we took to get there:
Product Discovery
Partnering with the PM and another designer, we tackled the product discovery phase which included a couple brainstorming sessions with folks from different departments, customer interviews and surveys to really dig into the problem and finally alignment with product and tech on what we hope the final outcome will be and steps to get there.
At the end of the process we gathered that the main issue with conversion in this part of the purchase funnel was:
New customers are unclear what Top Frames are causing reluctancy in commiting to a purchase.
Design phase
As a team, we had daily touch bases to discuss a countless amount of iterations and scrapped a handful of concepts after much deliberation. Once we aligned on a few amazing static designs, the next phase was to envision how this feels and how to make it feel real for usability testing.
Incorporating Variables for Usability Testing
I became obsessed with variables during this project, staying up late tinkering, trying to reduce the complexities of the amount of screens needed with the goal of having these prototypes for usability testing feel real as possible for unbiased feedback.
Tinder Tops™
We explored a playful concept, "Tinder Tops," where users could swipe through Top Frames for a casual shopping experience. While we acknowledged engineering limitations upfront, we built a high-fidelity prototype to gather valuable UX research through user testing.
To ensure authenticity, the prototype incorporated variables mimicking a real shopping experience, allowing participants to freely "shop as they normally would" (I love it when you can have that in a prompt). This approach will provide a rich collection of user insights to inform future iterations when bandwidth allows revisiting this project.
Tinder Tops prototype:
Uniting User Insights for Optimal Mobile Experience:
We conducted a comprehensive usability test where participants evaluated three distinct mobile prototypes. By carefully analyzing their feedback (thoughts, preferences), we identified strengths and weaknesses across all versions.
Leveraging these insights, we iteratively refined the user experience, creating an enhanced prototype that incorporates the most-liked elements from each initial design. This optimized version will be presented for further usability and feasibility testing with both participants and the broader team.
Fishbowl iOS Sign Up Flow
I had the great opportunity to work with the founders of Fishbowl on their first-time user experience (FTUE) with the aim of converting them into signed-in customers. I literally bought a fishbowl and goldfish and kept it near my desk so I could study its movement and buoyancy. Fishbowl was later acquired by Glassdoor.
The Deliverable
I spearheaded the creation of a series of interactive animations, delivered using Lottie (.json) files. This project leveraged my expertise in After Effects to craft engaging experiences, seamlessly integrated through the Lottie and Bodymovin plugins.
Cart Iterations for Pair
The shopping cart is a critical touchpoint for any e-commerce company. Even minor changes can significantly impact conversion rates. At Pair Eyewear, we take a data-driven approach to optimizing the cart experience. Through a combination of user testing, A/B testing, and ongoing analysis, we've implemented and refined various features, as demonstrated by the following examples...
Micro Cart
At Pair Eyewear, our previous mini shopping cart experience relied on a disruptive side drawer, especially cumbersome on mobile devices. Aiming for a smoother checkout flow, we designed the Micro Cart. This innovative solution seamlessly integrates into the browsing experience. Validated through user testing, the Micro Cart provides clear cart confirmation without interrupting the shopping journey. Users can easily access their cart and proceed to checkout directly, all without sacrificing valuable screen space. This streamlined Micro Cart flow is designed to boost conversion rates for Top Frames purchases by simplifying the path to checkout.
American Express
At American Express, I brought meaningful design to their risk and information department, tackling challenges related to big data. I played a key role in leveraging our vast data sets by designing products and solutions. Furthermore, I spearheaded the design strategy for Cornerstone, the company's internal big data warehouse. This initiative empowered employees across the organization by making big data accessible and fostering data literacy through a user-friendly platform.
Democratizing Data at Amex
At American Express, I played a pivotal role in democratizing data access by leading the design and launch of Cornerstone, our internal, centralized data warehouse. This project presented a unique challenge: fostering widespread user adoption for a complex data platform. I tackled this by leading the end-to-end design experience, encompassing branding, UI/UX, scripting, illustration, and motion graphics. Additionally, I maintained close collaboration with stakeholders throughout development, guaranteeing the platform addressed their specific needs. The accompanying explainer video (above) effectively communicated Cornerstone's value proposition, driving user adoption across the organization.
