Developing the mid-fidelity prototype gave me the opportunity to refine the behavioural side of the website, not just how it looks, but how it guides, encourages, and supports users in taking meaningful action. For the Participatory Collective, this is especially important because the organisation’s work relies on participation, shared learning, and relational engagement. Every call to action needed to feel welcoming, accessible, ethical, and aligned with the Collective’s tone being warm, human, hopeful, and collaborative.
In this post, I will explore the CTA strategy across the site and explain how my design reflects user-centred thinking, persona insights, accessibility considerations, and inclusive language.
Understanding What Users Want To Do
Before creating any CTAs, I reviewed the personas I created in Assignment 1 of the four stakeholder groups: Community members, Academics, Funders, Policy makers. Each group comes to the website with different motivations. For example, community members might want to join events, see familiar groups, or understand what the Collective actually does. Academics might look for research partnerships or ongoing projects. Funders want to see impact and transparency. Policy makers want evidence and community voices. Because of this, the CTAs needed to be clear, simple, and inviting not pushy or sales driven.
Designing CTAs
I intentionally avoided deceptive or manipulative language like “Don’t miss out!”. These would not only contradict inclusive design principles, but also go against the Collective’s values of trust, honesty, collaboration, and consent. Instead, every CTA uses plain, friendly language such as “Who We Are”, “Be Part of the Story!”, “Learn More”, “Explore”, “Read More”, and “Get Involved”. These are invitations, not demands. They sound like the tone of the organisation being open, supportive, community-focused.
CTA Placement Across the Website
Homepage
The first CTA users see is “Who We Are.” This is placed right under the main headline “We learn, grow, and make change, together.” It acts as a welcoming button that leads directly to the Our Story page. This reflects the logic that most new visitors want to understand the Collective before deciding to participate. Each stakeholder section includes its own CTA, community groups will have “read more” on each card in the carousel, academics is “explore” whereas funders and policy makers have learn more. These CTAs appear after brief context, which supports ethical UX as users never click something without understanding what it is.
Our Story Page
The “Be Part of our Story!” CTA appears at the bottom of the illustrated story-board path. Users follow the characters down the page as they learn about the Collective’s Vision, Mission, Approach, Partners, and Values. By the time they reach the CTA, they have enough context, so being part of the story feels natural, encouraging them to explore upcoming events.
Projects Page
Cards across the Projects page contain “Read More” CTAs to help users explore the details at their own pace. These are particularly important for academics, funders, and policy makers who need more depth.
Navigation Bar
This was one of the most important strategic decisions. The Get Involved CTA is placed permanently in the navigation bar so it is always visible, no matter what page the user is on. It leads to a simple subscription form where users can join the mailing list, get updates about events, and stay connected even when they aren’t visiting the site. This supports user-centred design by giving the user continuous access to the collective’s activity in the most low-effort way.
Accessibility Considerations
Accessibility is central to the Participatory Collective’s values, so I made sure the CTAs were not only visually consistent but accessible in multiple ways. Buttons are large, ensuring they’re easy to use on both desktop and mobile. CTA colours contrast strongly against their backgrounds to support users with visual impairments or low vision. Nothing relies purely on colour as shape, spacing, and text weight also communicate hierarchy. The Accessibility button appears in the top left corner of every page, allowing users to adjust settings such as text size or contrast.
Typography & Text Hierarchy
I standardised text weights using Poppins, which has excellent readability. Page titles have large and bold text, Subtitles have medium size semi-bold text, Body text has regular weight, and Small supporting text has slightly reduced size. This hierarchy ensures that users can scan pages easily. It’s especially helpful for community members who may not be familiar with academic or policy-heavy content.
Tone Of Voice & Language
The tone across all text including CTAs is welcoming, collaborative, and free from jargon. This reflects the Collective’s relational approach and ensures that no group feels excluded. For example, “Who We Are” is inviting and not formal, “Be Part of the Story!” is emotional yet empowering, “Get Involved” is collaborative and clear, and “Learn More” is gentle and informative. The tone helps users feel like they belong, regardless of background.
User- Centred Design Across Pages
The entire CTA strategy is built on clarity, consistency, real motivational needs, ethical design, and accessibility. Consistency is key, every page uses a similar layout, spacing, colour palette, and illustration style. This ensures that all users, regardless of age or digital literacy, always know where they are on the site and what they can do next. The combination of CTA placement, narrative illustrations, simple language, and structured hierarchy keeps users on the right path without confusion or cognitive overload.