About the project
Legrand is one of the largest global providers for switches, sockets, and light. Before working with Publicis Sapient, Legrand’s B2B arm was using a 1000+ page catalog and mail-order/phone-in order placement. Legrand’s B2C arm had a limited ecommerce experience for its designer switches and outlets. Internally Legrand used a combination of in-house based and licensed tools for client management systems, quote intake and approval, and distribution status management.
This ecommerce experience was unique in that the Home page was more a dashboard and the checkout process needed to encapsulate a complex quote intake and processing flow. The “Portal” would also allow client mangers to login on behalf of their clients and execute entire orders. highly efficient digital experiences covering areas such as: Pricing and Availability, Project Quoting, Account Management, Order Management, Case Management and Returns.
Ultimately we delivered 8 User Journeys, 4 Primary Personas, Over 350 Clickable Prototypes across Responsive Web and Smart Watch, 200+ Visual Designs, with a Design System and Experience Principles to keep everything grounded throughout.
Role
UX Designer
Tools
Protoshare
Home / Dashboard
The initial landing page was designed to function like a “My Account” meets dashboard. The information provided would allow the user to see the most recent and relevant information and activity, allowing them to advance in their work flow or begin working on a new area. Hot links would allow a user to take action and begin starting new tasks without having to dig through menus. The layout would adjust to the user’s access rights and their most frequently used tools.
Account Dashboard
Where the home / dashboard provided a snapshot and quick actions, the My account provides traditional account controls as well as active and historical data.
Full Product Detail Page
The PDP created for Legrand contained a lot of variable parts. Shown to the right was an example of a full PDP utilizing all potential options. The simpler option would sections of content based on available data pulled from the product list database.
Quote Process
The most vital component to Legrand’s entire B2B Portal experience is their Quote Process. From submitting the quote to performing negotiations and approvals to ultimately placing the order, this functionality was the most time consuming element of this project. With over 15 quote types, each of which effected which fields would be present, and line by line discount calculations, the Quote Process was the tool Legrand needed to drive their business into the future as they continue to move further and further away from their mail order catalogue.
Main takeaway
While not the most “hip” or “trendy” client or solution delivery, this project taught me a lot and ultimately has shaped and grown my process and approach for all project’s I’ve worked on since.