Our top 10 Javascript frameworks to use in 2022

JavaScript frameworks make development easy with extensive features and functionalities. Here are our top 10 to use in 2022.
Written by
Alec Whitten
Published on
17 January 2022

Redesigning a Nonprofit Website to Support Engagement and Fundraising

Overview

Image courtesy of Jasmin Chew via Pexels

BHNA is a nonprofit dedicated to preserving early 20th-century homes and Pasadena's architectural history. Ahead of their annual fundraising Home Tour, they needed a refreshed web presence that could support donations, promote events, and engage the local community.

About the client

Bungalow Heaven is a designated landmark district in Pasadena, CA. As a volunteer-led nonprofit, BHNA works to preserve the neighborhood’s unique architectural history while hosting community events and annual home tours.

Problem

The previous website was outdated, difficult to navigate, and not mobile-friendly. Volunteers with limited technical experience struggled to update content, and the site lacked e-commerce functionality needed for virtual fundraising during the pandemic.

Image courtesy of Jasmin Chew via Pexels

The previous site was:

  • Outdated design and needed a refresh. The site was difficult to navigate, which caused 82% bounce rate
  • Not mobile responsive
  • Hard to update (volunteers had limited technical knowledge)


Goal

Create a user-friendly site that allows the team to:

  • Easily update content without technical help
  • Promote events
  • Tell the story of the neighborhood’s historical legacy

UX Approach

To meet BHNA’s goals under tight timelines, I led a lean design sprint with focused priorities:

  • UX Audit: Conducted a heuristic evaluation to identify usability, accessibility, and content structure issues.
  • Brand Refresh: Redesigned the logo to modernize BHNA’s visual identity while preserving its historic charm.
  • Content Strategy: Collaborated with stakeholders to understand goals and reorganized site architecture via card sorting and IA mapping.
  • Design & Prototyping: Created interactive wireframes and mockups focused on usability and clarity.
  • Development: Rebuilt the website using GatsbyJS and WordPress, optimizing for performance and ease of content updates via GraphQL.
  • Training & Handoff: Delivered CMS training and documentation for non-technical volunteers to manage content independently.

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Logo Redesign

The original Bungalow Heaven logo was just text from a font that wasn’t very readable, and the nonprofit didn’t have any original files. So I recreated it by grabbing a photo of the street sign, tracing it in Illustrator, and then refining the letterforms in Glyphs Mini to give it a more organic and geometric feel. The result is a refreshed and historically respectful logo that maintains the spirit of the original signage while improving usability, readability, and adaptability.

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Impact

The redesigned site led to a 40% improvement in performance, significantly reducing load times and enhancing responsiveness across devices. By restructuring the information architecture and improving navigation and content layout, user engagement increased by 35% and bounce rate dropped by 20%. The updated CMS empowered BHNA’s small volunteer team to manage content independently without developer support. As a result, the organization was able to streamline updates, boost community engagement and donations, and maintain a professional-grade web presence with limited resources.

40
%
Improvement in site performance (load time, responsiveness)
Majority of inquiries were not eligible cases
35
%
Increase in user engagement through improved navigation and content layout
Majority of inquiries were not eligible cases
62
%
Decrease in bounce rate after IA restructuring
Majority of inquiries were not eligible cases

Marketing Team

After redesigning the landing pages and form, guided by A/B testing and user behavior insights, we saw a significant spike in leads. In fact, the increase was so dramatic that the sales team became overwhelmed, creating a new challenge around resource allocation.

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Image courtesy of Jasmin Chew via Pexels

Takeaways

This project reinforced how effective UX audits and lean branding updates can significantly improve engagement, even for long-standing community organizations. I learned that empowering non-technical teams with intuitive content systems is just as important as visual polish, and that design can play a critical role in helping mission-driven teams adapt to change.

If I were to do it again, I would push earlier for a more scalable CMS approach and clearer prioritization of content workflows to avoid bottlenecks before launch.

Throughout the project, I strengthened my skills in stakeholder facilitation, information architecture, and designing with both technical constraints and community needs in mind.