Work

 

Streamlining the brand with a design system

 

Accelerating go-to-market and improving overall service quality

 

Tecnotree's design system was created to accelerate development and enhance the overall design of the services. Leveraging my design and development experience, I played an essential role in creating a cohesive and recognizable design language that also empowered the sales team.

 
Streamlining the brand with a design system – Accelerating go-to-market and improving overall service quality
 

Background

 

Tecnotree is a full-stack digital business management solution provider for telcos, with over 40 years of global domain knowledge and transformation capability. Despite having multiple offerings, each service had a different look and feel. Tecnotree needed a robust design system to unify its portfolio.

 

Project Model

 

Our team consisted of three people: myself, a digital service designer responsible for defining and designing the design system; a full-stack developer responsible for building it; and a product director who supervised the project. We adopted an agile and lean approach, which, along with the small team structure, allowed us to make rapid progress.

 

Objectives & Drivers

 

The following objectives were set for the project:

 
  • Streamline and unify the brand across offerings.
  • Accelerate service development and go-to-market.
 

The following design drivers were guiding the project:

 
  • Prioritize solutions over perfection.
  • Ensure design is simple, feasible, scalable and adaptive.
  • Guarantee design works in all situations and scenarios.
 

Design Process

 

I began by defining the objectives and design drivers for the desired outcome. I audited the existing offerings, mapped all the required components, content, and system states currently in use, and envisioned future needs. Additionally, I wrote a manifesto outlining the goals and representation of the design system, detailing how it would benefit both customers and the company.

 
The final published version of the design system was based on flat design principles and heavily influenced by Google's Material Design.
 

The final published version of the design system was based on flat design principles and heavily influenced by Google's Material Design.

 

Digital Service Design

 

Once the requirements and structure for the design system were established, the rest of the design work was straightforward. The most important aspect was its content, which included topics to guide designers and developers: design principles & drivers, best practices, digital strategies, styles, components & patterns, and resources like brand fonts & design templates.

 
The design system needed to be clearly specified for the developer to build it as intended. Key aspects such as structure and navigation, grid, spacing, colors, typography, responsiveness, and the behavior of menu, search, and scrolling were all detailed.
 

The design system needed to be clearly specified for the developer to build it as intended. Key aspects such as structure and navigation, grid, spacing, colors, typography, responsiveness, and the behavior of menu, search, and scrolling were all detailed.

 

Outcome

 

The outcome was a published design system that streamlined and unified the brand across the portfolio, strengthening the Tecnotree brand by making the offerings easily recognizable. It also supports the sales team by enabling them to present the entire suite of offerings effortlessly to potential clients.

 

Reflection

 

My experience as a frontend developer and seasoned designer was instrumental in achieving the desired outcome, given my familiarity with service architecture, component libraries and modular approaches. In my view, a design system is an extension of these concepts with a stronger incorporation of the company's brand. It was truly fascinating to be part of creating the design system and watching it go live. ▪

 

Methodologies

 

Digital service design, system architecture & customer experience design and project management.