Lauren Zemering

Back to projects

Platform redesign & integration

Knowledge Hub revamp

Digital product

Accessibility

Systems

Overview image showing Knowledge Hub as a standalone, uniquely branded platform next to the Circle Economy website.

After image depicting the new Knowledge Hub as a resources page next to the Circle Economy Website.

Context

Built in 2016, Knowledge Hub was a stand-alone open access platform powered by Circle Economy Foundation. It served as the largest library of circular case studies, policies, and frameworks for circular economy practitioners.

Context

Challenge

While attracting nearly 8,000 monthly visitors, the platform was at a breaking point. It was plagued by severe tech debt, a long backlog of UX pain points, and was fragmented from the parent organization.

Challenge

Solution & Impact

Executed a 4-month overhaul integrating Knowledge Hub into the main website, unifying user journeys, while introducing a new responsive design system, UX improvements, platform stability, and EAA accessibility compliance.

Role

Lead product designer

Duration

4 months, 2025

Company

Circle Economy Foundation

Team members

Sophia Chou (product designer)

James Yan Aung (product manager)

Isfaaq Goomany (dev lead)

Wazeer Chadun (full stack developer)

Mahima Ramgolam (front end developer)

Skills

User research

UX/UI

Product management

Accessibility

Design system

Tools

Miro

Figma

Maze

"How might we transform a fragmented, legacy content platform into a secure, cohesive ecosystem that unifies user journeys and captures traffic for the parent organization?"

Tech debt

Legacy architecture (NextJS v9 / Strapi pre-4.8) caused severe security vulnerabilities and blocked routine maintenance.

UX friction

A massive backlog of user complaints highlighted broken search mechanics and painful content contribution workflows.

Brand disconnection

A completely isolated identity confused users and failed to funnel 8k monthly visitors back to the parent organization.

Process

Research and scoping

User feedback & interviews: We reviewed a multi-year backlog of historical user feedback and supplemented it with targeted interviews, focusing specifically on partner organizations looking to publish large, curated content collections on our platform.

Audience surveying: We evaluated the product’s ecosystem positioning by surveying Circle Economy's active audience and followers to gauge three critical metrics:

Baseline platform awareness (whether they knew it existed).
Core usage behaviors (how they interacted with it).
Brand attribution (whether they recognized it was part of the parent organization).

Research findings:

Contributors wanted more recognition for their work, to network with others, and a more efficient way to upload case studies.
Readers wanted to navigate content by industry or region, and wanted to see more practical, on the ground case studies.
Circle Economy wanted to host and promote its own publications while fostering an open platform for sharing circular practices.
60% of survey respondents were not aware of Knowledge Hub's existence.

Research and scoping

Audience surveying: We evaluated the product’s ecosystem positioning by surveying Circle Economy's active audience and followers to gauge three critical metrics:

Baseline platform awareness (whether they knew it existed).
Core usage behaviors (how they interacted with it).
Brand attribution (whether they recognized it was part of the parent organization).

Research findings:

Contributors wanted more recognition for their work, to network with others, and a more efficient way to upload case studies.
Readers wanted to navigate content by industry or region, and wanted to see more practical, on the ground case studies.
Circle Economy wanted to host and promote its own publications while fostering an open platform for sharing circular practices.
60% of survey respondents were not aware of Knowledge Hub's existence.

UX friction

Scoping & MVP definition: Our team was flooded with ideas for platform improvements, but limited time and resources required strict restraint. Collaborating closely with the Product Manager, I introduced an Opportunity Solutions Tree (OST) to help us map out our solution space and prioritize "must-have" from "nice-to-have" features.

Mapping & wireframing: To simplify the bloated architecture, I led an Object Oriented UX (OOUX) exercise to clearly lay out the parts and features of the platform. We used these to structure wireframes that were validated early through internal feedback sessions with circularity consultants and devs.

Designing for uncertainty: During this phase, it had not yet been decided whether the Knowledge Hub would be fully integrated into the main Circle Economy website or remain a standalone platform. We knew the user journey and branding needed to feel cohesive, but the final positioning and organizational approval for a website integration were up in the air. To mitigate this risk, we designed the platform so that it could seamlessly function as an independent site or adapt to a future corporate website integration.

A screenshot of the Opportunity Solution Tree and Object Oriented UX exercises.

Building a system

Design system & UI: Moving into high-fidelity in Figma, we simultaneously developed a unified design system meant to scale across all of Circle Economy’s products. Since the final platform destination was still undecided, this cohesive visual foundation was critical to strengthen brand recognition and ensure Knowledge Hub could be seamlessly integrated into the parent site later without breaking the UI.

*(For more on the design system, see here!)

User research:

During this design stage, we ran rapid prototyping feedback loops to validate core elements. Specifically, we ran A/B usability tests on two versions of the content card (the platform's foundational UI component) with internal colleagues who are regular users of the tool. Their feedback stressed the critical need for immediate scannability and explicit content-type labeling, which directly shaped our final component designs.

Overview image of design system components

Building a system

*(For more on the design system, see here!)

User research:

Integration

The integration decision: Before final handover, we officially committed to integrating the Knowledge Hub into Circle Economy’s main website. Fortunately, a series of broader corporate website improvements were slated for rollout, allowing us to combine launches efficiently. This strategic move would also enhance user value to website visitors, as it placed a massive library of high-traffic resources directly in front of the parent organization's primary audience.

Sitemap finalization: To validate the positioning and new sitemap proposals, we balanced internal business goals with user data. We ran multiple rounds of cross-functional stakeholder sessions with the communications team while simultaneously facilitating unmoderated Maze tests to observe how users navigated the proposed taxonomy and set up of the integration.

Research findings:
An online Maze test of the sitemaps showed that the term “Knowledge Hub” did not clearly communicate what the section contains, and that the entry points for searching by region, framework, and industry were not prominent enough. Our solution was to label Knowledge Hub as “Resources” in the main navigation and provide additional entry points on the Knowledge Hub landing page to explore content via regions, framework, or industry.

Sitemap of Knowlege Hub integrated into Circle Economy's website.

Integration

Solutions

The integration

Unified journeys: Strategically placed resource entry points across the main corporate site to cross-pollinate traffic.

Frictionless discovery: Rebuilt the filtering schema from scratch, allowing users to slice data by region, industry, or sustainability framework instantly.

Before and after of the landing page of Knowledge Hub and how it relates to the Circle Economy and CGR websites.

Built for the community (UX improvement)

Contextual guidance: Transformed a tedious, multi-field upload form into a focused wizard with inline tips and a live submission preview.

Simplified taxonomy: Revamped the confusing tagging system and introduced a collaborative "invite-to-author" feature to incentivize organic platform growth.

Before and after, showcasing the contribution form, with the after showing the modals for focused writing sections.

Refined readability (UX improvement)

Optimized layouts: Refactored and introduced new content types, designing bespoke page layouts tailored specifically to maximize reading comprehension and content intake for each type.

Citations: Streamlined the citation process for users by building an automated reference engine that instantly generates clean, standardized citations.

Increased engagement: Engineered a "Related Content" recommendation logic to naturally expose users to deeper resources, boosting time-on-site and content discovery.

A before and after image of the Knowledge Hub case study page, with the after showcasing related articles and citations.

Knowledge Hub, for everyone (Process improvement)

EAA & WCAG compliance: Prioritized platform accessibility by establishing strict new guidelines aligned directly with the European Accessibility Act (EAA) and WCAG 2.2 standards.

Shared workflows: Institutionalized a new design-to-dev framework featuring mandatory compliance checklists and quality checkpoints at every stage of the development sprint cycle.

Rigorous documentation: Delivered airtight accessibility handover blueprints, created a transparent public accessibility statement, and cataloged a prioritized backlog for future enhancements.

Example of accessibility documentation in figma including tab order, header labels, and alt text.

The “reputation hub” (New feature)

Searchable profiles: Introduced user profiles, turning anonymous contributors and authors into discoverable industry experts.

Networking-ready: Equipped users with dedicated spaces to showcase external project links, contact methods, published articles, and curated saved posts.

Were the challenges met?

Tech debt

The platform backend was upgraded to the latest release of Strapi and content and user data was secured.

UX friction

Many important UX pain points were improved and feedback points from the backlog implemented.

Brand disconnection

The platform was integrated directly into the corporate website, creating a distinct connection between the platforms.

Reflections

My role: Leveraging my background as a former interim PM, I bridged the gap between design vision and technical constraints. I spearheaded every phase, from consolidating user feedback and facilitating OOUX mapping to building the design system and setting accessibility standards.

What went well

Foundation-first: Established a robust design infrastructure using OOUX, wireframing, responsive variables, and a strong design system to ensure the platform was scalable before moving to high-fidelity.

Documentation: Delivered clear, structured Figma documentation covering components, interactions, responsiveness, and accessibility. This reduced developer handover time and, by establishing documentation habits early, helped the team stay consistent even under time pressure.

What could be better

Centralization: Product requirements and decision-making were spread across multiple tools, making it difficult to trace decisions over time. A single source of truth documenting all decisions, even small ones, would have improved clarity and continuity.

What could be better

Centralization: Product requirements and decision-making were spread across multiple tools, making it difficult to trace decisions over time. A single source of truth documenting all decisions, even small ones, would have improved clarity and continuity.