Afterpay: Shopify Merchant Onboarding App

What's the problem?

The original Afterpay Shopify App — built without design input — was confusing and difficult for merchants to use. Designed as a chatbot but functioning more like a tooltip and onboarding flow, it created frustration and required frequent customer service support. The challenge was to reimagine the app’s UX so merchants could independently integrate Afterpay into their Shopify stores with minimal friction.

What do we want to achieve?

• Enable merchants to integrate Afterpay without assistance.
• Provide a clear, easy process to install the gateway, place Afterpay assets on product pages, and customize content.
• Reduce merchant frustration and minimize contacts to customer service.

What are challenges we faced?

• Limited time and resources.
• Balancing stakeholder expectations with business needs and budget constraints.

What was part of the team and what was my role?

As the sole Lead UX Designer, I worked closely with the Product Manager, Lead Engineer, and key stakeholders to ensure the design aligned with business goals and technical feasibility. This collaboration involved regular meetings to gather requirements, iterating on design solutions based on feedback, and maintaining clear communication throughout the project lifecycle to deliver a user-centered product that meets both user needs and project objectives.

How was the process I followed?

The project began with comprehensive research and analysis, including conducting user research to develop detailed personas and performing a thorough teardown of the existing app. Additionally, a competitive analysis was carried out focusing on key players such as Affirm, Klarna, Sezzle, and Quadpay to identify market opportunities and gaps. Following this, experience mapping was undertaken to outline user flows and pinpoint critical pain points. Usability tests on the current product provided valuable insights, allowing the creation of a prioritization list that closely aligned with business objectives. During the design and iteration phase, initial sketches evolved into medium- and high-fidelity prototypes. These designs were continuously refined based on usability feedback and input from stakeholders, ensuring the final product met both user needs and strategic goals.

What was the final solution?

• Redesigned the app from a chatbot-style interface into a structured, customizable pop-up with clear directions and step-by-step video guidance.
• Added a built-in FAQ and contact support feature, reducing dependency on customer service.
• Created a scalable onboarding framework that better supported merchants’ needs and improved integration success rates.