Selazar X, Building and scaling a design system
Overview
When I joined Selezar, my main project was to redesign the complete platform. Seeing the lack of parity between the designs and the shipped versions, a design system became the first order of business
I led the design system and redesign for a complex third-party logistics (3PL) platform used by e-commerce businesses to manage their operations. The platform handles order tracking, multi-warehouse stock management, inventory control, invoicing, returns, integrations, and supports multiple transactions and users with varying permission levels.
The existing platform had grown organically over time. Different designers had built different screens using different patterns. This created inconsistency, confusion, and a steep learning curve for users.
For users, the cognitive load was high. Information was densely packed, hierarchies were unclear, and tasks took longer than they should. Finding a product or understanding an order status required mental effort.
There was no single source of truth
Designers were recreating components, guessing patterns, and unintentionally introducing inconsistency.
Key design decisions were made by developers based only on technical requirements
Developers and QA had no framework to reference or a proper definition of done regarding interactions and front-end. This slowed down work and eroded confidence in the final product.
Reduce cognitive load for users by creating clearer hierarchies, consistent patterns, and more scannable interfaces.
I began by auditing the existing interface. This gave me a clear picture of where the platform was falling short. Common issues included inconsistent controls, poor visibility of system status, and lack of user control and freedom.
I mapped user flows across key tasks: tracking an order, checking warehouse stock levels, processing a return, generating an invoice. I observed where users hesitated, where they clicked incorrectly, and where they gave up.
I worked with the engineering team to understand technical constraints and with stakeholders to prioritise which areas to tackle first.
I built a comprehensive design system from the ground up
A foundational layer of colours, typography, spacing, and elevation designed for clarity and accessibility.
A component library including buttons, tables, forms, cards, navigation elements, and data visualisation components. Every component was documented with usage guidelines, dos and donts, and code snippets.
Pattern libraries for common user flows like searching inventory, updating orders, and managing users.
The design system was built with flexibility in mind. It gave designers the building blocks they needed while ensuring consistency across every screen.
The most impactful features we introduced was the semantic identifier, a custom tag. Previously, users had no way to group, search and select products beyond the default categories
I designed a flexible tagging system that allowed users to create, edit, and apply their own tags to products. They could create groups like “Weekend promotion” or “Fragile items” or “Q4 bestsellers” and use these tags to filter and manage inventory.
The tagging interface was designed to be intuitive. Create a tag, name it, apply it to products. Tags were visible across the platform, in inventory views, order processing, and reporting. This small addition gave users significant power to organise their work on their own terms.
The design system was not just about the final interface. It was about how the design team worked.
The design system was not just about the final interface. It was about how the design team worked
Designers no longer had to guess
They could open the system, find the component they needed, and know it was correct.
This gave them freedom to focus on solving user problems rather than reinventing patterns. It gave them certainty that their designs would be consistent with the rest of the platform
