I embarked Ecosia on the design system journey in March 2020 and led it until May 2022. Ecosia faced challenges that required me to adapt quickly, experiment, and learn along the way. At that time, the market offered fewer technical solutions than today, often forcing to be extra creative and flexible when defining a unified language. In 2024 and again in 2025, Ecosia invited me to support projects in the native apps team and help problem-solve design system-related challenges.

During my time as a product designer in the search team, I identified several key pain points within the organisation and potential opportunites for the users and the business.

Identifying needs

• Build users trust and elevate product quality.
• Minimise the appearance of arbitrary decisions & fatigue, decrease onboarding time.
• Improve & speed the designing and prototyping processes.
• Minimise the technical and design debt.
• Scale product cohesively and get on board new talent quicker.
• Get prepared for global design changes & new visual design direction.

Turning pain points into opportunities

→  Flora will provide a scalable base for company's growth.

I set criteria, which I used as a guide for planning, prioritisation, measuring, and evaluation. 

I've been consecutively working on the buy-in among leadership, product, and marketing teams. We have been experiencing frequent push backs. The key when working on the buy-in was to highlight the opportunities from various angles. Showing that the end effect will impact our users & brand. Expressing how it ties to Brand and CLTV, having on the radar stability, stickiness, consistency of the product, but also conversion, retention, and ability to support team and attract talent.

We didn’t have enough resources to establish a solid monitoring system, and due to privacy policies, some tools weren’t an option. Tracking employees’ delivery time directly wasn’t part of the company culture. Instead, we often relied on manual calculations and qualitative user feedback when setting up the system — at least until automation options became available. What was important to monitor to track the success of our system was:

• direct-users satisfaction
• time to market
• system scalability and adaptability
• product quality and performance
• system coverage over time 
  
• adoption & contribution

We went from a side project to a team of 2 (designer-engineer duo). I provided leadership as a designer and manager for this initative (during 2020-2022). Facing challenges we were reformming our collaborative ways.  I focused on establishing design system culture that could enable us to gain contributions coming from product teams.

We kept the collaborative spirit with the teams through: planning, check-ins, user testing, monthly retros, open hours, engineering rotations, studio days & learning sessions, annual evaluations.

I collaborated on establishing a solid direction — vision, principles, KPIs, roadmap, communication channels, feedback loops, versioning, contributor's guide, and ticketing. This has been very important when setting the expectations, keeping others informed, and delegating. Since we've been fully remote, we used Miro to ideate and map the work. We also set up a governance environment in the Confluence, task management in Jira, and dedicated Slack channels for visibility.

From the start, I ran product and marketing audits to identify gaps and define what the Flora system should include. I reviewed the product across web, iOS, and Android, comparing live versions with Sketch files and the Dev Styleskit using an inventory framework: availability, usage, behavior, variants, visibility, and improvements. After building the system, I continued mini-audits alongside engineers and product teams. A key part of driving adoption and system evolution  was running regular feedback loops through interviews, surveys, retrospectives, 1-on-1s, and user testing.

Strategy & Scope

Together with my engineer, we defined the system structure and shared it with product teams. We aligned naming conventions between design and code based on three principles: logical, scalable, and simple. Competitive analysis was especially helpful early on — not to compete with other design systems, but to learn how others solved similar challenges.

Our development scope focused on web only (2020) in order to address critical needs first and provide impact to the biggest audience. We used labels to communicate the status of component development to the product teams.

Limited by dedicated resources and facing  technical challenges, we were only able to start expanding  the system to native apps  prior to the rebrand (2022).

Design tokens

Components from Web to Native Apps

Flora offers a variety of components categorized as global, domain-specific, and platform-specific. The largest range of identified components comes from the product teams working on the web platform. Alongside standard components like buttons, radios, checkboxes, switches, inputs, dialogs, and tooltips, there are also unique components specific to the search environment, such as search results. These libraries are the outcome of a collaborative effort and a contribution model I embedded within the product teams workflow.

White-label approach

When working on the Desktop Browser App and Android App releases, Ecosia forked Chromium to build both apps. This introduced external guidelines that had to inherit Ecosia’s brand language. My role was to act as an interpreter, translating Flora’s tokens into an entirely different and foreign set of variables. This wasn’t the first time Ecosia relied on third-party frameworks — the iOS app also became a mix of custom, native, and Firefox components.

API alignments

Complete API alignment for components in code and design across platforms wasn't fully achievable at Ecosia due to various limitations. However, on the design side, global components were identified. In 2022, I initiated efforts to align color tokens across platforms. Due to several internal challenges, this initiative was likely paused after my resignation. Arriving back in 2025, I helped Ecosia align color tokens in iOS and Android apps where applicable. I collaborated with engineers, reported changes, updated Figma libraries, and filed engineering tickets to implement changes in code.

Adopting Flora

Documentation

When working on components, we aimed to provide guidelines, but this wasn’t always feasible due to competing responsibilities. The rebrand forced a complete overhaul of those guidelines. Through monitoring adoption, I realized that design documentation needed to focus on purpose, show-don’t-tell principles, do's and don’ts, contextual examples, impacts on the user journey, and status (e.g., done, in progress). I initially tested tools like Zeroheight, but due to limited resources and team preferences, we didn’t proceed. On the marketing side, the team used Adobe Cloud and began relying on Figma shortly before the rebrand.

Evolution, education & engagement

Simply delivering libraries and documentation isn’t a recipe for adoption — I understood that from day one. My priority has always been fostering a strong design and engineering culture. To support this, I practiced adoption-focused rituals with system users, including strengthening design–engineering collaboration, contributing to teams' OKR planning to embed the design system into their roadmap, and driving adoption through collaborative sessions and playful interactions.

Design — Our journey started with Sketch and Zeplin. On the marketing side we used Adobe. To coordinate contributions I've used Abstract. In the mid of 2021 we hit significant milestone → I migrated the team and the design system to Figma. 

Engineering — Following my suggestion, my engineer explored and tested Storybook. He provided the integration with Vue.js and got the buy in from the rest of the FE guild. Ability to test components in isolation was a big selling point. The excitement on the engineering side started to pick up. When it comes to the native apps currently components are stored only in Github repo.

Migrations — Beside from tool migration in design, during 2020 to 2021, Ecosia went through major infrastructure changes and code migrations. I worked closely with the Search team, which was impacted by these changes, ensuring that engineers' contributions supported the evolution of the Flora system.

Every journey comes with its own challenges — and that’s what makes it interesting. During the first two years, many moving parts within the company directly impacted the navigation and development of the design system.

Operational - At the company level, there was constant business pressure to keep developing new features, even though the design system foundation hadn’t been fully established. Limited engineering availability and knowledge gaps made it difficult to accelerate implementation, slowing down adoption in the first year. Facing staffing challenges on the design side I would often be pulled to other initiatives beyond my lead role (e.g. hiring).

Rebrand - During the work with the agency, I had to split my time between design system lead role and additional brand responsibilities. Adopting the new visual language became a true test for both the system and the processes I had been setting up. It was a rewarding challenge for the entire design system workstream.

Technical  -  The design & tech debt, combined with the product scope, was disproportionate to the people dedicated to the design system. Migrating to new tools shortly before the rebrand added extra pressure. The biggest challenge, however, was Ecosia’s reliance on third-party providers, which added complexity, reduced stability, and made it harder to unify and adopt shared language.

Return on investment:

• product scalability → design system has proven to be a successful infrastructure for hosting rebrand
• delivery speed increased → designer who uses libraries is proven to be 50% more effective with their time; engineering team was able to re-build another product website 6x faster when using design system
  
• cognitive load reduced  → for the end-user and for the direct-users (consistency boost)
• code performance improved →  better testing opportunities, cleaner code guidelines, faster page load
• organisation scalability → sharing  guidelines with other engineers, new designers, and external companies minimises the time investment from weeks of work into minutes of work, while expanding the audience reach
• accessibility score boosted
  
• brand and UX cohesion achieved

Coverage (2021)

• Design libraries: 90% coverage for Web & Apps (based on planning).
• Code libraries: 80 components exist, 61 have unit tests, 17 provide component-specific documentation (Web); Mobile Apps starts adopting design tokens.
• Documentation: 70% for Web, Mobile Apps missing.
  

Adoption (2022)

• Product Design: 5 product teams
• Engineering: 4 product teams
• Marketing design: 4 creative designers & content creators

Shared ownership

I changed Ecosia team from fearful and resentful of contribution to a team of advocates. The first shift happened during engineering rotation, the next during Abstract integration, another right after design migration to Figma.

#1 / Setting and maintaining design system is a team sport.

#2 / Accessibility or brand cohesion doesn't sit only within design system responsibility.

#3 / The more you talk about the needs and show the value, the more positive response you may receive. 

#4 / Meet people where they are, be gentle, responsive, and remain flexible.

#5 / Start small and work on adoption as early as situation allows you.

#6 / Buy in is not enough, a willingness to adjust could be the first step.

#7 / Someone's enthusiasm doesn't mean their direct engagement, someone's enthusiasm doesn't mean lack of fear or doubt. 

Or learnings and processes when leading  →  Nudging a culture