THE CHALLENGE
The platform had evolved through multiple transitions and rebranding initiatives, resulting in fragmented UI patterns and heavy reliance on legacy and third-party component libraries. This created inconsistencies across products, slowed down development workflows, and made it difficult to maintain a cohesive user experience.
The organization needed a scalable design foundation that could:
- Standardize UI patterns across products
- Improve consistency and usability
- Streamline design-to-development workflows
- Support future product scalability
- Align digital experiences with TELUS Digital’s brand identity
MY ROLE
As part of the product design team, I focused on:
- Designing reusable UI components
- Building scalable component foundations in Figma
- Writing usage and implementation guidelines
- Improving responsiveness and accessibility
- Collaborating closely with developers for implementation alignment
- Facilitating design feedback and iteration sessions
My work primarily focused on navigation, layouts, and input control components.
DISCOVERY AND EXPLORATION
Before building the system, our team conducted extensive benchmarking and analysis of established enterprise design systems to identify best practices for scalability, usability, and documentation.
My main references for Design Systems:
- IBM Carbon Design System
- Dell Design System
- Google Material Design
This exploration helped us define principles for consistency, modularity, accessibility, and component scalability while ensuring alignment with TELUS Digital’s visual identity.
STRUCTURE
To improve organization and scalability, the library was structured into core categories:
- Style Tokens
- Input Controls
- Data Display
- Information Components
- Navigation
- Layouts
This structure helped both designers and developers navigate the system efficiently and enabled future expansion as the platform evolved.
BUILDING THE COMPONENTS
I contributed to the foundation of the design system by creating reusable, scalable UI components and defining detailed usage guidelines for designers and developers.
My contributions included:
- Navigation components
- Layout structures
- Input controls
- Responsive behavior improvements
- Interaction and state definitions
- Documentation for implementation consistency
A strong focus was placed on:
- Scalability
- Consistency
- Responsiveness
- Pixel-perfect execution
- Design-to-development alignment
These standards improved collaboration between teams and reduced inconsistencies across the platform.
COLLABORATION AND ITERATIONS
A key part of the process was maintaining close collaboration between design and engineering teams.
To support alignment, I organized collaborative review sessions where designers and developers:
- Validated component behavior
- Reviewed implementation feasibility
- Iterated on interactions and responsiveness
- Shared feedback in real time
These sessions improved communication, accelerated implementation, and helped establish shared ownership of the design system.
OUTCOME
The result was a scalable and comprehensive UI library with:
- Reusable components
- Well-defined design standards
- Clear implementation guidelines
- Improved visual consistency across the platform
- Faster and more efficient workflows for design and development teams
The library became a foundational resource that supported product scalability and enabled teams to create more cohesive user experiences.
Learnings AND Reflection
This project strengthened my expertise in:
- Design systems and component thinking
- Creating scalable UI foundations
- Writing design documentation and guidelines
- Cross-functional collaboration
- Design-to-development workflows
- Facilitating feedback and alignment sessions
It also reinforced the importance of balancing consistency with flexibility when building systems that need to evolve across multiple products and teams.
One of the most valuable aspects of this experience was learning how strong communication and collaboration practices are just as important as the components themselves when building successful design systems.