Skip to content

Celebrate Children

improving user experience

WHO I AM

Kate Thomfohrda

I am a web designer currently in my final semester at Madison College. I am a creative problem solver who loves a challenge. Working with Celebrate Children allowed me to put my skills to practice.

what is The Celebrate Children Foundation?

The Celebrate Children Foundation serves as a means to receive donations to help fund the Child Abuse and Neglect Prevention Board. They generate most of their donations through their license plate campaign and direct donations using the Donate Now button on their website. 

Project overview

After meeting with my client we narrowed down the main objective of the project- streamline navigation and update the look and feel of the site. The goal of this project was to redesign the look and feel of the already existing website while maintaining the feel of the organization’s branding. Every element should feel inten­tional, functional and aesthetically satisfying. The refresh should also clarify the charity’s in­tentions by making it easier for supporters to donate. 

The Problem(s)

Outdated

The current Celebrate Children site is oversaturated, uses outdated imagery, and is hard to read.

Cluttered

There is a lot of information on the site for people to get through. It does not utilize hierarchy and the layout is confusing. 

Repetitive

A lot of information is shared multiple times throughout the site. There is excessive use of the donate button, and it is not placed intuitively. 

the Solution

Streamlined Navigation

After spending time with the current site, I picked apart the navigation and created a card sort.  I shared this card sort with others. Using what I learned, I created a new site map with cleaner navigation.

Updated Visuals

One of the biggest pain points of the current site is the poor use of hierarchy. I went through the site and established an informational hierarchy. This made information easier to find and read. I also updated a majority of the images as they were pixelated. 

The Process

For this project, we put our UX skills to work.

I started by auditing the site and determining what information was essential and what could be consolidated. In addition to the site audit, sent a questionnaire to the client asking them to outline what outcome they expected from the project. 

After auditing the site, I created a card sort. I shared this with others who were unattached to the project to get a better understanding of how the information should be laid out. 

After gaining some insights from the card sort I put together a new site map and sent that to the client for review.

After the sitemap was approved, I moved forward with wireframing the site. This helped me understand how the content would be displayed and also helped me envision how I would clean up the layout. Once finished with this step, I sent it to the client for approval.

Once I established how the site would be organized and got the OK from my client, I dug into the design portion of the project. I put together a style sheet and worked on bringing the site to life.

Before sending the design to the client, I set it up as prototype in Adobe XD. This allowed me to set it up as it would function and the client to see how certain interactions would feel on the finished site. After completing the prototype, I sent it to the client for review. 

Bringing it all together

Below are some of the assets I created and sent to the client. I used all of these assets to help inform the final design. Please look through to get a better understanding of my work. 

updated site map

User Personas

WireFrames

The results

Below are the before and after images of the site. This is the result of my UX work. The site feels clean and stayed true to the Celebrate Children branding guidelines. The goal of the project was to clean up navigation and update the look and feel of the site. 

Before

The final Prototype

Below is the interactive prototype of the design. Hierarchy is established, content is easier to read, and it is much easier to navigate to the donation page.