Virtual Shopping Platform - Messaging for Modern Retail
B2B Platform
Web & Mobile
London, UK
As Lead Designer at Hero, I spearheaded the development of a seamless messaging experience that bridged the gap between consumers and retail businesses, offering real-time communication and personalized service.
Led UI/UX design for Hero's digital platforms.
Developed a scalable design system for consistent branding and experience.
Collaborated closely with product and engineering teams to ensure smooth functionality and a compelling user experience.
Role Overview & Results
My Role
Lead Product Designer
Established and scaled HERO®’s Design System
Developed new UI/UX strategies for real-time messaging and social shopping
Results
🛍️ +40% in-store engagement via real-time chat
🧠 +35% usability & adoption boost among retailers
🚀 +50% enterprise activation pre-Klarna acquisition
What is HERO®?
HERO® was a retail technology startup that enabled real-time messaging between online shoppers and in-store sales associates, bridging the gap between digital and physical retail. It allowed customers browsing a brand’s website to connect directly with store staff via text, video, or chat, creating a more personalized shopping experience.
HERO® was acquired by Klarna in July 2021 to enhance Klarna’s shopping app with in-store expertise and improve omnichannel retail experiences.
The Problem & Market Pain Points
In retail, communication between staff and customers was fragmented and inefficient—spread across outdated tools like emails, phone calls, and siloed platforms.
Store teams were facing slow response times, leading to missed opportunities and delays in customer service. Managers lacked real-time visibility into store activity and performance, which affected decision-making and team coordination.
Our solution tackled these challenges head-on with a modern, retail-focused messaging experience that unified communication, improved response speed, and enhanced visibility—empowering teams on the floor and improving customer satisfaction.
UX Approach
I reimagined the messaging experience at HERO® by applying a structured UX process—shaped by frontline retail realities, direct user feedback, and rapid experimentation in a high-pressure environment.
Research & Discovery
Conducted interviews with retail staff to understand the unique communication pain points across stores and customer touchpoints.
Audited legacy tools and workflows post-acquisition to identify feature gaps, latency issues, and usability flaws in both web and mobile.
Definition & Ideation
Mapped core messaging scenarios: customer-to-store, store-to-store, and internal broadcasts to ensure clarity and immediacy.
Introduced modular chat cards, rich media replies, and AI-driven suggestions to support faster conversations and better engagement.
Deployment & Iteration
Collaborated closely with engineering and support teams to deliver lightweight, performant messaging features across mobile and desktop.
Released improvements via phased rollouts and real-time analytics, using customer and partner feedback to drive continuous iteration.
Design Challenges & Solutions
1. Integrating Real-Time Messaging
At HERO®, our goal was to make customer-business interactions feel as natural as a conversation with a friend. To achieve this, I led the redesign of the app’s messaging interface with a focus on simplicity, usability, and immediate connectivity.
By introducing features like one-tap messaging, instant notifications, and read receipts, the app enabled consumers to reach out to businesses with a single click, eliminating friction and encouraging users to engage directly for quick answers or personalized advice on products. This enhanced sense of immediacy fostered greater trust between users and businesses.
Moreover, I worked closely with our engineering team to incorporate elements like rich media support, enabling businesses to share images, videos, and links seamlessly. This allowed consumers to get a richer, more interactive experience when seeking product details or assistance, creating a digital environment that mimicked the best of in-store interactions.
The redesign successfully balanced functionality and aesthetics, ensuring the chat interface was intuitive for all users, regardless of tech-savviness. This approach not only deepened the connection between brands and consumers but also led to a significant improvement in customer satisfaction metrics, with users citing the ability to receive swift, human-centered responses as a standout feature of the HERO® app.
2. Enhancing Social Shopping
In today’s retail landscape, customers crave both personalized assistance and a sense of community around their shopping experiences. At HERO®, I collaborated closely with product teams to introduce features that transformed our app into a social shopping hub, blending the best elements of in-store and online shopping.
One of our key enhancements was the integration of interactive product displays, allowing customers to view products in a dynamic, engaging format. From live product demos to immersive image carousels, these displays made browsing feel more personalized and engaging, capturing the essence of in-store browsing right on the app. This feature provided users with a hands-on view of products and helped build their confidence in purchasing items they hadn’t physically encountered.
Another major component was developing personalized shopping assistance, enabling customers to receive one-on-one guidance from sales associates directly through the app. By embedding real-time messaging with rich media options, associates could share photos, videos, and expert insights tailored to each shopper’s unique needs and preferences. This not only bridged the digital-physical gap but also brought a human touch to the online shopping experience, fostering deeper relationships between consumers and brands.
These features aligned seamlessly with Klarna’s mission of merging the in-store experience with the convenience of social shopping, contributing significantly to HERO®’s acquisition. The result was an app experience that didn’t just allow shopping but encouraged community, discovery, and connection, setting a new standard in the retail tech space.
Key Metrics & Achievements
| Metric | Value | What It Means | How It’s Calculated |
|---|---|---|---|
| Message Response Time | −60% | Faster replies thanks to streamlined chat UX and intuitive interface. | Average time between receiving and responding to a message |
| Daily Active Users | +45% | Increased engagement with the communication platform post-redesign. | Total unique users active per day / Total user base |
| Feature Adoption Rate | +55% | Wider usage of new tools like broadcast messages and pinned chats. | Users using new features / Total active users |
| Retail Staff NPS | +20pts | Improved satisfaction and usability sentiment across staff. | (Promoters - Detractors) / Total respondents × 100 |