Project Catalyst

Overview

Project Catalyst is a community-led innovation and funding programme built on the Cardano blockchain. It enables users to propose ideas, vote on projects, and help shape how treasury funds are allocated to grow the Cardano ecosystem.

When I joined the project, the site was hosted on Ideascale – a third-party tool that was difficult to navigate, visually outdated, and inaccessible. It didn’t reflect the values of a decentralised, fast-growing global community.

The goal was to design a custom, scalable, and inclusive platform that could grow alongside the Catalyst ecosystem while supporting multiple user types – ADA holders, proposers, and community advisors.

Project Scope

Project Catalyst was originally hosted on a third-party platform that lacked usability, accessibility, and visual coherence. I was brought in to redesign the experience from the ground up – creating a custom, mobile-first platform tailored to the needs of the Catalyst community.

Alongside the UX and UI work, I also led a full brand refresh. This included refining the logo, updating the visual style, and developing a complete brand system with accessibility-focused colour updates, modern gradients, typography, motion guidelines, and a set of social media templates to ensure consistency across channels.

This work laid the foundation for a platform that’s not only user-friendly and scalable, but also visually aligned with Catalyst’s position as a global, decentralised innovation programme.

Original Brief

The original objectives provided by the client were:

Create a more publicly facing website
Cater to three main personas: ADA holders, proposers, and community advisors
Promote key achievements and data with clear visuals
Help users understand Catalyst, how to get involved, and what benefits are available
Improve onboarding and encourage deeper community participation
Provide access to tools such as the Catalyst Voting App, proposal submission, and newsletter sign-up
Ensure users can track project funding outcomes and register at key moments

Community and Client Collaboration

I didn’t conduct formal user research. Instead, I worked closely with the client, who had direct relationships with their community across social channels and forums. Their insights shaped the direction of the design and helped identify key pain points and priorities for different user types.

This feedback helped ensure the new design aligned with real community needs and improved the overall user experience.

Competitor Analysis and Benchmarking

To understand the broader landscape, I reviewed similar Web3 funding platforms including:

This helped identify best practices in presenting funding data, guiding user flows, and highlighting global impact. It also gave insight into how Catalyst could differentiate itself visually and structurally.

Visual Design and Branding

Catalyst had a basic brand presence when I joined the project. The existing logo was already in place, but I gave it a more modern, refined look. This involved adjusting the symmetry, closing visual gaps, and improving overall balance to create a cleaner and more cohesive version.

The updated logo forms the letter “C” through layered shapes that reflect the many parts of the Catalyst ecosystem. It’s clean, scalable, and symbolic of connection, depth, and unity.

The visual system also included:

A new accessible colour palette (WCAG-compliant)
Modernised gradients and use of space
A full set of brand guidelines for colour, typography, imagery, and motion
Modular layout systems to support scalability across breakpoints and content types

Brand Guidelines

Below are example pages from the brand guidelines, outlining how the refreshed brand should be applied in practice.

Object mapping

Object mapping was conducted to help the client, myself, and the development team gain a clear understanding of what content was required, what was missing, and where further input from the client was needed. It also served as an effective tool for defining the site map, clarifying key information, and identifying any additional components or content that should be included – along with how and where they would sit within each “object” page in terms of structure and hierarchy.

The client was able to comment directly within the FigJam file, making the object map a central source of truth throughout the process. It also provided a useful opportunity to make suggestions, such as “It would be great if we could also add this…” helping to shape each page with a more structured, narrative-driven hierarchy.

By conducting object mapping early in the process, it laid a solid foundation for the next phase of UX wireframing, ensuring that layouts were informed by clearly defined content needs, page structure, and user priorities.

Low Fidelity Designs

UX Structure and Wireframing

After gathering requirements and completing competitor research, I began designing low-fidelity wireframes using a mobile-first approach. Since the site needed to display large amounts of structured data – including fund numbers, categories, graphs, and project results – it was important to prioritise clarity and responsiveness.

To design a clear user journey, I needed to understand how Catalyst funds are structured. Each funding round (Fund 8, 9, etc.) includes multiple categories, and within each category are hundreds of proposals. These are voted on by the community, and only selected projects receive funding.

The site needed to allow users to:

Navigate by fund number
Explore challenge categories
See funded and unfunded proposals
View voting results and project status
Explore key statistics and project data in a clear, visual format

Data Visualisation and Dashboard Design

The client had already supplied a detailed Excel document containing a large set of project data. My role was to help translate this raw information into a clear and accessible experience for users across the site.

The dataset included figures and context around project details, country of origin, milestones, ADA distribution, and fund performance, to name a few. I worked closely with the client to identify which data was most important to surface and how best to display it. Together, we defined the content and structure of a user-friendly dashboard that could clearly communicate the key insights.

The final solution allowed users to interact with key statistics, explore funding outcomes, and understand the global scale of Catalyst’s impact. By turning a complex spreadsheet into a clean, visual experience, the dashboard helped make the platform more transparent, informative, and engaging.

Client Approval and Design Iteration

Once the wireframes were approved by the client, we conducted small-scale A/B testing to test key user journeys, language, and layout. This helped identify friction points early on and refine the structure.

High Fidelity Designs

After testing, I produced high-fidelity designs in Figma, focusing on accessibility, clarity, and scalability. I designed a flexible set of UI components that could be reused across the site, making it easy to support future funding rounds and new content without needing to redesign layouts from scratch.

Final Desktop Prototype

Figma was used to design and build this prototype, making it easier for the client to visualise the experience in context. The prototype also supported user testing and helped identify and resolve UX issues early.

Final Mobile Prototype

The software Figma was used to design and create this prototype, along with Adobe After effects, Photoshop and Illustrator.

The updated site has been live since 2024. The client manages all content independently, and I continue to support any UX or UI design updates as needed.

New Features: Global Insights and Fund 15 Update

As the site evolved, new features were added. In May 2025, one of the most impactful updates was the launch of Global Insights – an interactive map that allows users to explore Catalyst’s reach and see which countries have funded projects.

More recently, for Fund 15, the design was updated again to support Midnight – a stablecoin pegged to the US Dollar on the Cardano blockchain. The site now displays amounts in ADA, USD, and Midnight, offering greater clarity and transparency for a global user base.

Developer Collaboration and Motion Design

I worked closely with the development team to ensure a smooth handoff. This included reviewing responsive breakpoints, layout details, and integrating subtle animations to improve user feedback and create a smoother experience. Animations were used carefully to guide attention, reinforce interactivity, and enhance hierarchy.

View live site