Designing Centr's First Digital Storefront
Unifying their app rebrand with a cohesive shopping experience that drives product sales and app trial signups.
Scope
I led the design of Centr's first digital storefront on a two-month timeline. As the rebrand launched alongside their first physical products, the store had to turn shoppers into app subscribers while maintaining brand consistency. I ran competitive analysis with stakeholders to shape the approach, then designed and shipped the full store.
Role
Timeline
Product Designer
2 Months
Contributions
UX and Visual Design
Design System Components
Accessibility
Impact
12% increase in app subscriptions
21% increase in total sales
17% in free membership sign ups
Approach
Creating The Product Vision
I created a product vision for a storefront that would drive both product sales and app engagement. I mapped out the customer journey showing how product discovery would lead to conversions while promoting free trial offers throughout the shopping experience. Wireframes and high-fidelity prototypes communicated how the experience would maintain Centr's brand identity while optimizing for conversion.
With only two months to design and launch, I worked closely with Centr stakeholders to establish a streamlined process. We focused on leveraging Shopify's existing capabilities where possible to accelerate development, while custom-designing key touchpoints like product comparison tools and trial callouts that would differentiate the experience. Rapid iteration with stakeholders ensured we stayed aligned while moving fast.
Designing The Solution
Homepage
We focused on the product line is aligned with the 3 core pillars of the Centr experience, movement, meals, and mind and demonstrating how they are interwoven into the app experience.
Designing The Solution
Navigation
In designing the navigation, it was quite simple we utilized UX best practices and focused customers to explore the product categories.
Designing The Solution
Project List Page
With a smaller product list and working within limitations we focused users to visually browse the products and shop by categories.
Designing The Solution
Project Detail Page
Centr’s team chose a traditional layout for the product detail page but we were able to implement cross sell product functionality increasing total sales.
Designing The Solution
Mini Cart
The shopify theme natively had cross sell features built into the mini cart and checkout pages. Prime opportunities for increasing average order value.
Design The Solution
Scaling The Design System
The UI Kit organizes a range of elements from type, color, buttons and components across the site. All designed with ADA compliance and developers in mind to make a seamless handoff to build the site.
Results
Metrics
12% increase in app subscriptions
21% increase in total sales
17% increase in free membership sign ups
Conclusion
Centr's first storefront launched on time and on brand. I designed a connected ecosystem between the app and store that moved the business forward. The success built trust with the client and led our relationship into an ongoing retainer, with continued work focused on refining the experience and resolving edge cases that surfaced post launch.
Challenges
Prioritizing which features to custom design versus leveraging native Shopify components required constant negotiation between design ambition and technical feasibility
Ensuring the storefront felt like a natural extension of the app rebrand without direct access to the app's design system or established component patterns
Lessons Learned
Competitive analysis early in the process gave the team a shared reference point that made stakeholder alignment faster and reduced back and forth during reviews
Earning stakeholder trust through the quality of the work and reliability of the process matters as much as the design itself, sometimes more
Future Recommendations
Trial Conversion Analysis
Audit how effectively the free trial callouts throughout the storefront are converting shoppers into app subscribers
Expanded Product Connection
Develop richer product detail page content that connects each product to specific training programs, helping customers understand how their product fits into their fitness routine
Deepen App-to-Store Integration
Explore personalized product recommendations driven by a customer's in-app activity, connecting what they train with to what they shop for and creating a more seamless experience
App Experience Audit
As the Centr ecosystem grows across both digital touchpoints, an audit of the app would ensure every feature feels as refined and intentional as the storefront, strengthening the overall product experience