Project 2 title

A UX Overhaul of Raisely’s Templates

Molding templates to flex easily and lead users to the perfect fit.

The Challenge

Raisely’s customisable website templates are the backbone of the platform. They are the starting point for chairities to launch their fundraising campaigns, supporting diverse needs like Appeals, Giving Days, Peer-to-Peer (P2P) campaigns, DIY fundraising, and ticketed events. In 2023, I was given the reigns for releasing new templates and designed and launched six templates, each tailored to specific campaign types as well as some new components like feed blocks and donation displays. While these were flexible and visually appealing, they leaned too heavily on opinionated aesthetics, leading users to choose templates based on style rather than purpose—e.g., picking an Appeal template for a P2P campaign.

That template framework, as well as some existing inconsistent UX experiences in the page builder (like with unexpected styling inheritance), needed to change. So in 2024, I teamed up with James, Raisely's Customer Enablement Specialist to rethink what customers need from our templates. The challenge was to redesign the templates to prioritize function, simplify setup for charities (even those new to Raisely), and ensure a seamless experience for donors and fundraisers, all while minimising user error and boosting efficiency.

As a UX/UI Designer and Front-End Developer, I tackled this project with a design thinking mindset, empathizing with users, iterating based on feedback, and balancing aesthetics with functionality.

The Solution, 4 Key Ideas

Templates needed to be unopinionated in design

Templates shouldn't begin branded, or make design decisions on the behalf of the user, but be a well structured site to suit the needs of the campaign function. That doesn't mean it couldn't look pretty

Templates must have everything you need, but nothing else

Templates should serve the primary purpose of that campaign, extra pages, nice-to-have sections, just make a template more daunting. Fundraisers trust Raisely's templates to be an example of what they need for a successful campaign, so we must give them what is neccessary for success, and nothing more.

Templates need to have predictable stlying

Raisely's page builder is very flexible, by tweaking different settings you can make a page look however you'd like. Previously, Raisely took advantage of this by making very unique looking templates. New templates needed to stay away from this, users shouldn't have to know the ins and outs of the page builder to understand how the template is set up. Templates needed to offer a great out of the box solution, that was easy to understand and predict.

Templates need to follow best practice conversion rate design

Ultimately, campaigns have one main purpose, to convert a page visitor to a donor (or to sign up and fundraise for a P2P campaign). Templates MUST be optimised for this, through user testing, and following best-practice CRO, the structure of a template had to ensure that this was acheived.

Stage 1: Research & Ideation

The process began with understanding the users—charity administrators, donors, and fundraisers—and their needs. I reviewed feedback from the sales and support teams to identify pain points: users were choosing templates for their look rather than their fit, and styling issues were causing delays. I reached out to our agency partners, who build campaigns on Raisely as their job, meeting in person when possible, chatting over coffee about the future of templates. After gathering insights, I put together the above key principles and got to wireframing.

Starting with low-fidelity wireframes, I focused on layout and flow for each campaign type, like how an Appeal page should differ from a P2P setup. I kept aesthetics out of it to prioritize function. The support team reviewed these wireframes, offering practical input based on their daily customer interactions. Their feedback helped me adjust the designs, ensuring each template’s structure aligned with its purpose.

Project 1 title

Stage 2: Prototyping

With a clear direction, I moved into Figma to develop high-fidelity prototypes. I refined the templates and designed new components, such as a donation feed for P2P campaigns and a copy-to-clipboard button for easy sharing. These needed to work across different page types—landing pages, FAQs—and on mobile devices. I tested the prototypes with the support team and a few customers, observing how they navigated and customised them. Their input showed a need for flexibility balanced with limits to protect key elements, like donation forms. I updated the designs based on this feedback, simplifying customisation options while maintaining usability and consistency.

Stage 3: Development & Testing

Next, I coded the templates and components, (Raisely is based in React) integrating them into Raisely’s page builder. Much of my work was rethinking the styling system. Things like like inconsistent font color application or blocks inheriting styles in ways that were unexpected for the user had been persistent problems. I reworked the CSS to ensure predictable behavior and protected critical elements from user overrides. On top of these changes, we made the decision to ensure that templates now share the same stylesheet, this means that the design experience between templates is the same. Now users can expect the same page building and style experience across templates. Before launch, I deployed the updates to a staging environment and tested them with the engineering and support teams. We identified and resolved issues, confirming the templates functioned well across devices and use cases. This step ensured the designs translated effectively into a working product.

Project 1 title

Stage 4: Evaluating Success & Roadmapping the Future

After launching the 2024 redesign with James, we assessed its impact against our 4 core principles: templates should be unopinionated, lean, predictable, and conversion-optimised.

And how did we do?

Users began selecting templates like Appeals or P2P for their function, not aesthetics, thanks to neutral designs and better naming / communcation of templates. Feedback highlighted the streamlined setup, with only essential elements included, empowering fundraisers to focus on campaign goals without distraction. Predictable styling eliminated confusion, users no longer wrestled with the page builder’s quirks, as customisation was intuitive and safe.

Metrics reinforced this: setup-to-launch time dropped by eight days, support requests fell, and adoption grew. As a Raisely user myself, these changes were great, building templates just made more sense. Our sales team who recommended templates as a conversation starter with clients shared that they felt more confident recomending these templates now that their forms and function were better defined.

It was a success, James and I communicated these principles across Raisely and begun our plan to replace all legacy templates with this model.

What are the people saying?

Incredible work @Josh and @James, these are a phenomenal evolution of templates.

Project 1 title

Tom Maitland

CEO

This is really incredible work @Josh and @James - massive kudos to you. A super clear example of how putting ourselves in our customers shoes leads to a better product for them.

Project 1 title

Martin Burgess

Head of Data

This makes me super happy.
Thank you, @Josh and @James. This is super exciting! Great job as I know when the end result looks straightforward and easy, a lot of thinking and hard work has gone into it. I’m going to reach out to a few customers who have struggled with our template and tell them the good news!

Project 1 title

Helga Wientjes

Senior Customer Success Manager