Heroshe: Redesigning the Onboarding & Checkout Experience

Redesigning the onboarding and checkout experience for a cross-border logistics platform to increase user conversion and streamline the customer journey.

Category

UX/UI

Duration

4 weeks

Year

2025

Heroshe: Redesigning the Onboarding & Checkout Experience

Redesigning the onboarding and checkout experience for a cross-border logistics platform to increase user conversion and streamline the customer journey.

Category

UX/UI

Duration

4 weeks

Year

2025

OVERVIEW

Heroshe had a 65% user drop-off rate. To tackle this, I redesigned their onboarding and checkout flows.

The redesign successfully boosted conversion rates and significantly improved the user experience.

THE CHALLENGE

When I began working with Heroshe, the platform had functional capabilities but was struggling with user retention. Through initial discussions and data analysis, we identified several critical issues:

• Complex Onboarding: New users faced a generic, one-size-fits-all signup process with no personalization

• Overwhelming Dashboard: First-time users had no clear direction on what to do after signup

• Complicated Checkout: The multi-step checkout process was causing cart abandonment

• Mobile Usability Issues: Poor form design was particularly problematic on mobile devices

These issues directly impacted business metrics, with the 65% drop-off during onboarding representing a significant loss of potential customers.


RESEARCH + DISCOVERY

Working closely with the product manager, we approached the research phase strategically:

• User Interviews: The PM conducted interviews with existing users across different segments

• Competitive Analysis: I analyzed successful signup and dashboard flows from leading platforms

• Heuristic Evaluation: I conducted a detailed review of the existing UI to identify friction points

• Moodboarding: Created reference boards of successful onboarding experiences to inspire our solution

Key insights

Users had different needs based on how they intended to use the platform, yet everyone received the same experience. Additionally, the dashboard failed to provide clear next steps, leading to confusion about how to begin using the service.

Redefining the onboarding experience

The existing onboarding flow was causing 65% of users to drop off during signup. The primary issue was its generic, one-size-fits-all approach that didn't account for different user needs and goals.

I introduced a 'Who are you primarily?' screen during signup that allowed us to tailor the subsequent experience based on user type (personal shopper, family/friends, client/business).

The signup form itself was completely redesigned with:

• Clear, concise microcopy

• Logical field grouping

• Streamlined form fields (reducing the number of required fields)

• Prominent CTAs with clear next steps

• Google sign-up option for faster onboarding

For new users, I designed a dedicated 'Start Here' section on the dashboard that provided contextual guidance based on their user type. This helped orient first-time users and clearly communicate next steps.

The redesigned signup process featured user type selection for a more personalized experience, with streamlined form fields and clear guidance.

The 'Start Here' page provides contextual guidance based on user type, helping new users understand exactly what to do next.

The redesigned dashboard brought frequently used actions front and center, with a clean layout that makes complex information easy to understand.

Fast & efficient checkout

The checkout experience is a critical touchpoint for Heroshe's business. The original process involved multiple steps and caused confusion, particularly around delivery options and shipping costs.

I redesigned the checkout flow to focus on clarity and efficiency by:

• Reducing the process from multiple steps to a streamlined two-step experience

• Creating a persistent order summary for total transparency

• Simplifying delivery address selection

• Adding clear visual hierarchy to guide users through the process

• Optimizing the mobile experience for on-the-go users

The new checkout flow made it significantly easier for users to complete their orders, reducing abandonment and increasing conversion rates.

The redesigned shipments table presents only essential information at first glance, making it easier for users to manage multiple items.

The streamlined two-step checkout process presents clear choices with transparent pricing, reducing confusion and abandonment.

Secondary flows & page designs

Beyond the core onboarding and checkout experiences, I also redesigned several supporting screens to create a cohesive platform experience:

• Wallet Management: Simplified interface for managing funds and transaction history

• Address Book: Easy creation and management of delivery addresses

• Notifications Center: Consolidated platform updates with clear categorization

• Shipment Tracking: Improved visibility into shipment status and details

Each of these secondary flows was designed with the same attention to usability and clarity as the primary journeys, ensuring a consistent experience throughout the platform.

The wallet and address book interfaces use consistent patterns to help users manage their payment methods and shipping destinations efficiently.

The redesigned notifications center organizes updates by category with clear action items, helping users stay informed about important platform changes and shipment updates.

Form Design Excellence

A particular focus throughout this project was the optimization of form design. I implemented best practices across the platform to improve completion rates and reduce user frustration:

• Logical input grouping and sequencing

• Clear input validation and error states

• Appropriate field sizing and spacing

• Mobile-optimized input methods

• Visual indicators of progress

This attention to detail in form design was particularly important for a platform like Heroshe, where users need to input various types of information throughout their journey.

The Impact

The redesigned experience delivered significant, measurable improvements for both users and the business:

• 42% increase in onboarding completion (reducing drop-off from 65% to 38%)

• 30% improvement in checkout conversion

• 25% decrease in customer support tickets related to signup and checkout issues

User feedback was overwhelmingly positive, demonstrating that the new design successfully addressed the core usability issues while creating a more engaging experience

Real user feedback highlighting the improved interface and user experience following the redesign.

Lessons & Takeaways

This project reinforced several key design principles:

1. User segmentation matters: Understanding different user types allows for more personalized, effective experiences.

2. First impressions are critical: The onboarding experience sets the tone for the entire user relationship with the product.

3. Form design is a craft: Small details in form design can have outsized impacts on completion rates.

4. Clear next steps reduce anxiety: Users need guidance, especially when faced with complex processes like cross-border shipping.

The Heroshe redesign was particularly satisfying because it directly impacted the company's bottom line while also improving the experience for users.


Create a free website with Framer, the website builder loved by startups, designers and agencies.