Case Study - Preserving the Past. Protecting the Future.

Overview

The Mansfield Historical Society was founded in 1985. It is a 501c(3) nonprofit organization that aims to archive documents and photographs of life in Mansfield, Texas.

They strive to preserve the past as much as possible and educate residents and guests in the form of special events, demonstrations, and the like.

What I Did in this Project

Step 1: Define the Problem

The Mansfield Historical Society previously had a website, but it was in need of an update. Navigating the site was difficult, and some stakeholders felt it lacked visual appeal.

The society aimed to make it easier for users to find information about upcoming events and available items for purchase. Most importantly, they wanted the information to be accessible and easy to locate.

The goal was to give the website a modern, refreshed look that would educate both current and potential members about the society’s offerings. Additionally, they wanted to include more "one stop shop" features (such as the ability to donate online) so users can do what they need online on their schedule.

Step 2: Understand the Audience

I was informed that some members in the Society were older and apprehensive about learning a new website and "technology in general." I kept this top of mind in all of my designs and strived to create clean, simple layouts with clear call-to-action buttons.

In our first meeting, I asked the Mansfield Historical Society President to please rank which items were the most important to surface on the website.

• allow people to purchase a membership online
• sign up to volunteer
• make donations online
• create an online store with an ability to purchase right away

Step 3: Starting the Design

After meeting with the President of the Mansfield Historical Society, I organized my notes and iterated designs based on the wants and needs of the target audience.

I created a color palette that was warm and inviting and found typography that was easy to read across various screen sizes.

I realized that several pages would be needed for this website. Rather than design every single page, I decided to design the Homepage, the Memberships page, and the Ways to Get Involved page.

Step 4: Coding the Design

With the design direction approved by the client, I shifted my focus to coding. What codebase would I use? Where would the site be hosted? How would I teach others to make updates?

I decided to host the site on Elementor. It allows multiple users to log in and make updates. I created a new URL—at the Society’s request—and went to work coding the pages and adding content.

Step 5: User Testing

Before launching the site, I gave a staging link to the museum clerk at the Mansfield Historical Museum and Heritage Center. I asked her if she would look at the site and let me know if there was anything unclear or confusing.

I also gave the staging link to two Board Members. One navigated while I observed; the other sent results after testing solo. They uncovered issues I hadn’t previously considered.

Step 6: Launching the Website

After incorporating feedback from user testing, the website was officially launched in July 2024. The project took 7 months to complete.

The site received positive reviews from staff, volunteers, and Board members. Two people applied for membership in the first month—a 50% increase over previous averages.

How did the website do?

Less than 8 months after launch, the Mansfield Historical Society saw the following results:

What I Learned

This was my first time designing and coding a website with an Ecommerce feature. I welcomed the opportunity to tackle something new.

I learned about payment gateways, setting up direct deposits, and—most importantly—the value of user testing before launch.