Design @ Copperleaf

October 16, 2019 Ian Muirhead

At Copperleaf, we believe design is one of the key differentiators that will keep us at the forefront of innovation in the enterprise software space. Our Design @ Copperleaf blog series will explore how we leverage design thinking to drive new ideas, empower our people to take risks, validate assumptions, and retain our competitive advantage.

In the first article of the series, Ian Muirhead, Copperleaf Director of Product Design, shares his perspective on how the company has evolved, his experience leading the design team, and the exciting launch of the Copperleaf Design System.
 



A Brief History of Copperleaf Design

I joined Copperleaf’s product development team in 2016 as a front-end developer with a focus on controlling design consistency through code. I directed my efforts on curating a collection of shared CSS code which reduced duplicate code between three separate products.

In 2017, I moved from a development role into a design leadership role which allowed me to increase my focus on system design. As we added more product user interface (UI) and user experience (UX) designers and engineers to the team, we were able to broaden our initiatives. For example, we created UI libraries which enabled designers across the company to access consistent, reusable components and therefore minimize the need to repeatedly build similar components from scratch. With this newfound bandwidth, our team could focus on innovation, solving the more complex design problems, and delivering a delightful user experience. We also created our first shared components, enabling developers on separate teams to use the same code to make their designs a reality.

Through 2018 and 2019 we continued to iterate and expand the libraries used by the entire product development team—connecting our designers and developers through a common language and greatly increasing cross-functional collaboration.

The Catalyst

As one of Canada’s Fastest-Growing Companies, we recognized that a design system was needed for scale, efficiency, and consistency. The key driving factors were to:

  • Scale and innovate product development
  • Retain consistency within interaction, visual design, and development patterns
  • Increase efficiency in the product design process
  • Accelerate onboarding of new designers and developers
  • Help align team members and increase communication between teams

In a nutshell, the Copperleaf Design System allows for our product development teams to focus on what’s important—delivering delightful, useful, and robust experiences to our users.

The Launch

Today, we’re excited to announce the public launch of the Copperleaf Design System! The design system is part of the heart and soul of the user experience with Copperleaf. It includes the essential building blocks that enable innovation, strengthen our brand, and help us develop superior user experiences. Our patterns will be public and showcase the amazing work the design and product development teams at Copperleaf have accomplished.

The Copperleaf Design System is the result of a distributed effort, but would have been impossible without the focus and commitment of key individuals within the design team:

Bob Sampson
Bob is the DesignOps Lead and a Senior Product Designer with two decades of experience creating enterprise web applications. He is the owner of the system and has ensured its success with his exhaustive focus on the details.

Simon Nodel
Simon is a Senior Engineer and Team Lead for engineering design on the small team dedicated to the creation of the system. His propensity to always look for new ways to solve old problems keeps us on our toes and ensures our design system is at the forefront of technologies and patterns.

Sam MacKinnon
Sam is an Intermediate UX Developer and the key architect of how we build new, complex components. He pushes everyone on the team for clean 60 frames per second (fps) animations and will always be the first in line to build something new.

Christo Coetzee
Christo is our Senior Front-end Architect and is a master of semantics and repeatable patterns within HTML and Sass.

Matthew Ridderikhoff
Matthew is our current software development co-op and has been working on the design system and other projects during his 8-month term.

Last but not least
We have had several past co-ops work on the design system, and we have been impressed with the energy and enthusiasm they brought when approaching a daunting project or task.

Outside of the core design system team, other product teams and product designers have contributed greatly to the shared code and documentation.

What’s next?

Stay tuned for the continuation of the Design @ Copperleaf blog series, where our design team will explore various topics about design at large. We are excited to make a splash in the design community and showcase why innovative design at Copperleaf helps us deliver extraordinary user experiences to our customers.


We are always looking for creative individuals to join our rapidly expanding team. Check out our careers page and see if Copperleaf is the right place for you.

 

About the Author

Ian Muirhead

Ian is the Director of Product Design at Copperleaf. He is an experienced leader skilled in design thinking, user-centered design, and frontend architecture with a passion for the creation of cohesive design and product experiences.

Follow on Linkedin More Content by Ian Muirhead
Previous Article
Copperleaf Welcomes the International Water Association to Vancouver | Copperleaf
Copperleaf Welcomes the International Water Association to Vancouver | Copperleaf

The International Water Association (IWA) recently held two specialty conferences back-to-back in Vancouver...

Next Article
Innovate East
Innovate East

Copperleaf™ was excited to participate in the successful launch of the first-ever Innovate East event, whic...