Shopping Experience: Flexible Learning, Modular Products, and Seamless Purchase Flow
Shopping Experience: Flexible Learning, Modular Products, and Seamless Purchase Flow
Embedded Files
Redesigned the learning experience to move from a fixed, high-commitment program to a flexible, modular shopping model, allowing users to explore, select, and purchase ESG content based on their needs.
The goal was to treat education like a product:
break it into smaller, accessible units
give users control over what they buy
create a clear, low-friction path to purchase
Context
Context
The original ESG program was structured as a single, long-format offering.
This created two main challenges:
Users found the program too long, expensive, and rigid
The business lacked flexible product options to capture different user needs
There was a clear gap between how users wanted to learn and how the product was structured.
Product Strategy: From Program to Modular Offerings
Product Strategy: From Program to Modular Offerings
Instead of forcing users into a full program, I restructured the offering into individual courses and bundles, enabling a more personalized experience.
Introduced standalone ESG topic-based products
Enabled users to select specific courses based on interest or need
Created bundled options to support different levels of commitment
Shifted the model from “one-size-fits-all” to self-directed learning paths
This repositioned the experience from a static program to a flexible product ecosystem.
What changed
Lower barrier to entry
More relevant purchase options
Increased opportunity for incremental revenue
Shopping Experience Design (E-commerce Integration)
Shopping Experience Design (E-commerce Integration)
To support this new model, I designed a shopping cart experience using Shopify, integrated with WordPress (content) and Thinkific (learning platform). The challenge was not just adding e-commerce, but making it feel like a single, cohesive experience across platforms.
Key improvements
Introduced a cart-based purchase flow for single courses and bundles
Designed clear product pages with structured content and strong calls to action
Enabled users to browse, compare, and select courses without friction
Maintained consistency across WordPress, Shopify, and Thinkific to avoid disjointed transitions
This aligned content, commerce, and learning into one continuous journey.
Design Process
Design Process
1
Research & Discovery
2
Structure & Validation
3
Prototype and Iteration
The work followed a fast, iterative cycle focused on reducing risk and validating decisions early.
1. Research and Discovery
1. Research and Discovery
Analyzed user behaviour and identified friction in the existing experience
Reviewed platform capabilities across WordPress, Shopify, and Thinkific
Identified constraints and opportunities for integration
This ensured decisions were grounded in both user needs and technical feasibility.
2. Structure and Validation
2. Structure and Validation
Created wireframes to define navigation, product structure, and user flows
Mapped cross-platform journeys (content → purchase → learning)
Gathered early feedback to identify usability issues and gaps
This helped validate the information architecture and interaction model before building.
3. Prototype and Iteration
3. Prototype and Iteration
Built a functional prototype to simulate real user flows
Tested transitions between platforms to ensure continuity
Iterated on structure, content, and interactions based on user feedback
The focus was on creating a seamless experience across systems, not just within a single interface.
Key Design Decisions
Key Design Decisions
Several decisions were critical to reducing friction and improving the purchase experience:
Simplified Product Presentation
Replaced complex tab structures with clear, scannable content blocks
Improved readability and reduced cognitive load
Flexible Purchase Entry Points
Introduced multiple “Buy Now” moments:
Immediate purchase for ready users
Secondary CTA for users who need more context
This supports different decision-making behaviours without forcing a single path.
Optimized Checkout Flow
Maintained visual consistency across checkout experiences
Reduced friction when transitioning between WordPress and Shopify
Ensured users understand where they are in the process at all times
Performance and Content Loading
Implemented progressive content loading (“Load More”) to improve speed
Avoided overwhelming users with long lists of modules
Content Recommendations
Added related content suggestions based on topic similarity
Created a foundation for future personalization (e.g., AI-driven recommendations)
Results
Results
The redesigned experience improved both user engagement and business flexibility.
User Experience
Easier to explore and understand available options
Reduced friction in browsing and purchasing
Greater sense of control over the learning journey
Conversion and Revenue Opportunities
Increased likelihood of purchase through lower commitment entry points
Enabled upsell through bundles and related content
Created more opportunities for repeat engagement
Product and Operational Impact
Expanded product offering without increasing complexity
Better alignment between content, commerce, and learning systems
Created a scalable foundation for future features (e.g., personalization, recommendations)
Google Sites
Report abuse