Developing Superheroes of Victoria Website
Project information
- Category: WebSite Development
- Project date: Capstone Project
- Project URL: https://superheroesofvictoria.com/
Our Capstone Project involved developing a comprehensive WordPress website for Superheroes of Victoria, a dedicated non-profit organization that focuses on bringing joy and support to children and families in need. The organization needed a user-friendly platform that they could easily update on their own, which made WordPress an ideal choice.
We incorporated several key features to meet their specific requirements. One of the main requests was to integrate a live Facebook feed directly on the homepage, ensuring that visitors can stay connected with the organization’s latest events and activities in real-time.
Beyond the homepage, we also designed sections that highlight the organization's mission, showcase their community events, and provide a clear path for donations and volunteer sign-ups. The site is fully responsive, ensuring an optimal experience across all devices. We paid special attention to the overall aesthetic and usability, aiming to create an engaging and informative online presence that truly represents the spirit and mission of Superheroes of Victoria.
My Role
As the Web Developer and UI/UX Designer for the Superheroes of Victoria website, I collaborated with Max Doak and Jenna Mueller to design and build a fun, engaging, and user-friendly online presence for this local non-profit.
What I Did
-
Designed the User Experience:
-
Developed the Website:
Implemented Key Features:
Collaborated and Iterated:
I created page layouts and user flows in Figma, ensuring that families, donors, and volunteers could easily find information about events, get involved, and make donations. My focus was on accessibility, clarity, and a playful superhero-themed design that reflects the organization’s mission.
I built the site in WordPress using Elementor, customized plugins, and responsive design techniques to deliver a seamless experience across devices.
I added a secure donation/payment system, volunteer sign-up forms, and event pages to help the organization engage with the community.
I worked closely with my teammates, gathered feedback, and refined the site based on user testing. After launch, I continued to support the charity with updates, maintenance, and new content as a casual employee.
Persona
Prototyping and designing
We started by designing the Home and About Us pages with a bold comic-style theme. Our initial vision featured custom layouts and strong superhero visuals.
However, because the organization’s website was already running on an older WordPress theme, we couldn’t fully implement this design without rebuilding the entire site from scratch. To stay within scope, we adapted our design to work with the existing theme.
The result is the current live website, which captures the superhero brand while remaining functional and easy to manage for the client.
The Key Points
One of the key points of this project was integrating a live Facebook feed directly on the homepage. This feature ensured that visitors could instantly see the organization’s latest posts, updates, and upcoming events without needing to leave the site. It helped keep the website fresh and engaging while strengthening the connection between the charity and its community. By embedding real-time social media content, the site became a central hub where families, donors, and volunteers could easily stay informed and involved.
Another key point of the website was the implementation of a secure online donation system. Since fundraising is vital for a non-profit like Superheroes of Victoria, it was essential to make the process simple, safe, and accessible. We integrated a WordPress-powered payment form that allows visitors to donate directly on the site using their credit card. The form is streamlined with fields for card details, email, and donation amount, making it quick for users to contribute without navigating away from the site.
This feature not only saves the organization time by reducing manual handling of donations but also builds trust with donors through secure transactions. By keeping the process mobile-friendly and responsive, supporters can make contributions anytime, from any device. The donation system has become a central part of the site, directly supporting the charity’s ability to fund events, outreach programs, and community activities.