Client | Skills | Project Dates | What is | URL |
---|---|---|---|---|
Uniting Distant Stars | UX/UI DesignWeb Design/Development | June 1, 2023 | What is Uniting Distant Stars? Uniting Distant Stars™, Inc. links future leaders and global innovators to educational resources and vocational training to influence positive changes in the world. |
Uniting Distant Stars Website Redesign - 2021 to Present
Since the new UDS website launch in 2017, a lot of changes have happened with WordPress and their improvements to the front and back end experience for users and developers.
Our site became bloated with different plug ins and features, and we wanted the design of the site to be polished up to reflect newer, cleaner, faster loading web interfaces.
Challenges
To further enhance and streamline the online presence and performance of the Uniting Distant Stars website.
Design Process
Since I was updating a responsive website, I based my design process on the Design Thinking approach and followed the below process:
- Problem
- Discovery
- Iteration
- Solution
Crash! goes our Wordpress Theme and Site (Problem)
In Summer 2021, during our shift to making our own WordPress theme, ThemeIsle, the agency that made Zerif Pro (our 2016 theme), had pulled the plug on the Zerif suite of WordPress products without our knowledge (or prior warning) and left our site in a lurch, with blog posts
As a result, in Late July, I had to throw together a simple landing page (left) in about 2 hours using Divi/Elegant Themes.
As part of patching up the site after the Wordpress theme crash, I devoted some time to analyzing how various pages on the site could be improved by updating the sites design and theme:
How can we better improve the giving experience for supporters?
Both the Give app and Wordpress’s Gutenburg editor made it a challenge for us to design giving news and information in a way that would make it easy for visitors to support UDS.
By improving the Donation page layout and giving forms, donating to UDS will be seamless across all devices!
Improving the User Experience for those Visiting and Supporting Uniting Distant Stars (Discovery)
By revamping the Uniting Distant Stars website, our goal is enliven our online presence and better serve people who are
Visiting the site and discovering program impact and updates
![image](/_next/image?url=https%3A%2F%2Fassets.super.so%2F3893d41c-9531-4b34-b502-8e99886a8f0c%2Fimages%2Faf53d69d-2442-47f2-a86c-8c3eb277e16f.jpg&w=2048&q=90)
Eager to receive email newsletters or connect on Social Media
![image](/_next/image?url=https%3A%2F%2Fassets.super.so%2F3893d41c-9531-4b34-b502-8e99886a8f0c%2Fimages%2Fb3d921ef-925c-4978-b352-c6d422f7c90d.jpg&w=2048&q=90)
Wanting to donate money or their skills to UDS
and Young Liberians who want to get technical education, training, or certifications through UDS
Defining New Goals for UDS’s Site and Drawing Inspiration from Other Nonprofits (Discovery)
As a UDS web design volunteer, I stay up to date with current or potential problems with the UDS site and, upon seeing that the website would need an overhaul, I had a few follow up Stakeholder Interviews/Discussions with Heather Cannon. In Summer 2021, we shared ideas and features found on other nonprofit websites that Heather bookmarked, analyzed the technical pros and cons in updating and keeping the UDS site on Wordpress, compared different themes and features, and streamlined current plugins, thus reducing bloat and site loading time, and further modernizing the site.
In the search for finding inspiration for redesigning the new WordPress theme and elevating UDS’s nonprofit goals, Heather looked to these nonprofits for their impactful layouts:
Oxfam (Ways to Give/Donations)
Girl Dreamer (About Us)
Charity Water (Our Work/Impact)
World Wildlife Fund (Annual Reports)
The Nature Conservancy (Who We Are)
Open Door Legal (Stories/Imapct)
Building a Custom Theme using Divi - 2021-2023 (Iteration)
In the journey to revamp the UDS site, I sketched out an updated version of the UDS site. In creating some quick sketches, I was able to quickly get feedback from Heather on the overall layout, functions, features, and further materializing the design ideas from contemporary nonprofit websites.
UDS Homepage and About Us Sketch with annotations - Summer 2021
UDS Our Community and Sponsors Sketch with annotations - Summer 2021
After getting feedback from Heather, gathering inspiration from other nonprofit websites, and sketching some refined layouts, I worked in selecting various themes to customize and improve the UDS website. The few Wordpress themes selected didn’t allow me to customize and build pages the way I wanted to (or had many hoops to jump through in creating pages).
Seeing how powerful Elegant Themes/Divi is in creating custom Wordpress themes, we went with them to make our own, without having to rely on agency-made themes which are subject to change or being dropped altogether.
Divi allowed me to build custom themes and responsive pages from scratch or by using templates (right, a Food Shelf Donation layout page) with UDS’s colors, icons, content and other assets to make the pages reflect our mission, vision, and nonprofit objectives.
Divi Donation Template Page - Summer 2021
UDS Cosmetology Fundraiser Page - Fall 2021
In late Summer/Early Fall 2021, Heather, members of the UDS Board, and I planned to launch a web and social media campaign for visitors to give to a Fall Cosmetology Fundraiser.
This exciting fundraiser gave me an opportunity to see how Divi could work for Uniting Distant Stars! By customizing a Divi Donation Template page with body copy and fundraising tiers from a Google Doc detailing specific goals for the fundraiser, and improving the Give Plugin, the page served as a good template for improving the main UDS Donate page.
Because of the Divi redesign, we reached our fundraising goal of $2,500 for the UDS Cosmetology program!
"Thank you for all your (continued) hard work!"
- Heather Cannon and other UDS Board Members
Kadence Theme in Wordpress (2023-Present) (One of Two Solutions)
Even though Divi is highly customizable, it can be bloated. Throughout 2022, more work was being poured into finding and applying different solutions which both efficiently loaded images and logos and reduced overall site loading times rather than maintaining the site.
In early 2023, I explored alternatives to Divi that would provide the design and technical features Heather and I had seen on other nonprofit websites, provide more comprehensive Wordpress support, and shave off (or even eliminate) time spent patching up the backend issues with our custom theme. In using Kadence WP for the UDS site, Saving digital bloat and reducing load time in using Kadence to customize a new theme.
Matt Manning’s SquareSpace Design (Another Great Solution!)
In June 2023, Heather and I met with Matt Manning of Gumbo Media, who had begun redesigning the UDS site using SquareSpace which envisioned us leaving Wordpress behind and streamlining our site’s look and feel and reducing digital bloat.
UI Design
As part of Matt’s design work, he also lent his dynamic visual designs skills which polished UDS’s branding. We’re thrilled to be using the assets as we unveil our new UDS web presence!
Adopting the SquareSpace Design to convey UDS as a Thriving, Impactful Nonprofit (Solution)
Taking all of the assets and everything else worked on so far, I continued the work Matt started and customized even more pages, added a few more design assets using the new branding, designing impact and annual report templates, and transferring our current Wordpress blog and photos over to SquareSpace.
The shiny, new, updated UDS site will be online in early June 2024!
The new UDS site built using SquareSpace
![image](/_next/image?url=https%3A%2F%2Fassets.super.so%2F3893d41c-9531-4b34-b502-8e99886a8f0c%2Fimages%2F54f1a29e-612c-417c-be4d-35caca0ddce2%2Ffd810f16-e0ee-4be3-a600-c435963f7d73.png&w=3840&q=90)
The mobile UDS site built using SquareSpace
The new UDS donation page built using SquareSpace
![image](/_next/image?url=https%3A%2F%2Fassets.super.so%2F3893d41c-9531-4b34-b502-8e99886a8f0c%2Fimages%2F9508f12c-5b9c-44ad-b0b1-6ba94168dd8c%2F31b3dfe4-a8ad-455e-8645-4fd8c1c220c5.png&w=3840&q=90)
The mobile UDS donation page built using SquareSpace
Takeaways
The journey to streamline Uniting Distant Star’s online presence has been a winding and highly rewarding one. Yet, we’ve only just begun to fully utilize SquareSpace to our advantage and reach goals including • Further customizing SquareSpaces pages, sections, and features to broadcast news and program impact • Growing our social media audience and newsletter recipient list • Increasing our monetary donations and volunteers offering their time and talent, helping UDS continue to make even more of an impact!