top of page

SureWerx: UX e-commerce platform redesign for one of Canada’s largest suppliers of specialized safety and industrial work gear

Updated: 3 days ago


 

Background

SureWerx has a long-standing presence in traditional industrial supply but has recently been shifting toward a more modern, digital-forward strategy. Their goal was to improve how they engage with both distributors and end users online. This transition sparked the need for a full rebrand and redesign of their e-commerce website to better align with evolving customer expectations and digital commerce standards.

 

Role: UX/UI Designer

Scope: UX strategy, UI design, prototyping, style guide creation, Agile collaboration


 

The Challenge

Sitemap by Vini Avila

With a product inventory exceeding 45,000 SKUs, SureWerx needed a platform that could deliver a seamless, intuitive experience for industrial buyers while supporting scalability, marketing campaigns, and future product expansion. The previous site was outdated, hard to navigate, and lacked the flexibility and brand polish needed for a modern e-commerce experience.

 

My Approach

As the lead UX/UI designer, I was tasked with redesigning the platform from the ground up. I worked closely with cross-functional teams in an Agile environment, attending daily scrum meetings to ensure alignment and continuous delivery throughout the project lifecycle.

 

Key Activities & Deliverables


1. Discovery & Strategy

  • Collaborated with product owners and business stakeholders to define objectives, user personas, and key user journeys

  • Conducted a UX audit, analytics review, and competitive analysis to benchmark best practices

  • Developed user flow diagrams to clarify user journeys, validate requirements, and inform IA and UX decisions for a responsive B2B e-commerce platform




2. UX & UI Design

  • Created detailed wireframes, user flows, and navigation systems to support search-ability across 45,000+ products

  • Developed a high-fidelity, clickable prototype using InVision for stakeholder presentations and internal testing

  • Designed modular, responsive UI components for both mobile and desktop environments




3. Design System & Handoff

  • Built a comprehensive style guide and component library to maintain consistency across all teams

  • Supported developers with annotated design specs and pixel-perfect QA reviews

  • Designed promotional banners, landing pages, and digital marketing assets to support product launches and seasonal campaigns

 


Results & Impact

  • Dramatically improved site navigation and product discoverability for industrial buyers

  • Created a scalable design system that future-proofed the platform for ongoing expansion

  • Strengthened alignment between product, marketing, and development teams through shared design documentation and sprint planning

  • Successfully translated a traditional B2B brand into a modern digital experience that engages both distributors and end users

 

Tools Used

  • Sketch

  • InVision

  • Adobe Creative Suite

  • Jira

  • Google Workspace

  • Microsoft Sharepoint

 


Key Takeaways

  • Agile processes and daily scrum meetings were essential to maintaining clear communication and rapid iteration

  • Designing for scale requires modularity, clarity, and brand consistency at every touchpoint

  • A rebrand isn’t just visual—it's about shifting how a company connects with its users, and design plays a critical role in bridging that transition


DESKTOP GALLERY


MOBILE GALLERY


 
 
 

Comments


Lesagna brand mark logo in white on a blue background

© 2025 by Leslie Ma, LESAGNA

Leslie Ma, is a multidisciplinary designer​ that specializes in UX/UI, graphic design and art direction — bringing ideas to life, beautifully and strategically.

bottom of page