The UX and UI Redesign of The Non-Profit,

Comfort Crew for Military Kids

Scroll

Problem

The current Comfort Crew for Military Kids (CCMK) website is outdated and does not have the information that the users want easily accessible.

Solution

Redesign the website to bring the mission of the organization to the forefront. Also, we updated their styleguide to create a more up to date feel since users commented that the current colors made it feel outdated.

Insight

During user testing, users stated that they wanted to know mission and impact to feel confident enough to give. Because of that we made it a point to bring the who, what, and why to the homepage. We also wanted to drive more donations on the website so that the organization could have more outreach.

User Research

We started out by creating two proto-personas that could reflect the user of the site. The two different personas were that of someone who would request a kit from the site and one of someone who would donate. We then had an interview with the executive director of CCMK and from that we were able to find out the exact needs of the shareholder. After we met the shareholder and created a survey to find out how and why people give, we met and brainstormed who the user would be and how we could make the site better for each person. We saw the greatest opportunity in focusing on the donor user.

Definition And Synthesis

We wanted to focus on the donor user because we felt that they could do a lot more as a company and be able to have more outreach if they were able to bring in more donations. We felt like we had the opportunity to redesign the website to be a key financial engine for the organization in addition to its current role as a data capture/request tool. During our user testing we found that users wanted to know the mission of organization upfront so that they could better inform themselves. We also found that the current site presents barriers to the very information people are looking for when they visit the site and are ready to give. For our problem statement we thought: How might we redesign the site to retain its core present day functionality (requests and data capture) while satisfying would-be donors’ quest for understanding an organization’s mission and impact so they can feel confident that they are donating (online) to the best organization to help these children build resilience.

Ideation

Based on our user interviews we created a feature prioritization matrix and the main things that we wanted to address were:

  • Declutter the text to increase visual appeal

  • Quickly communicate the organization’s mission, vision, key activities

  • Simplify and highlight path to donate

  • Redesign the UI style guide to give site an updated, more modern feel

Prototyping

We created individual sketches and brought them together to combine ideas. From there we create a low fidelity prototype. After doing that we wanted to make it higher fidelity with actual content. From low to mid we:

  • Simplified the form information in the Request process

  • Considered showing pics of Kits to provide clarity around what their donation is funding

  • Added credit card input flow

  • Created clearer communications about the organization’s mission and the Kits as users are still unable to clearly articulate what CCMK does

  • Clarified social media icons

From there we iterated on to make a high fidelity prototype. Our focus was on the donation and request kit forms. Our goals were to:

  • Simplify the UI

  • Make quick and clear form fields

  • Make simple confirmations

  • Add the ability to share to help grow donation numbers and awareness

User Testing and Outcomes

Users liked the look and feel of the new site and thought it was more inviting and easier to digest the information.

Conclusions and Future Opportunities

Lessons learned:

  • Talk to more users (Specifically past and current users of the site)

  • Dive deeper into social media opportunities

Previous
Previous

Wasteless

Next
Next

FBI Website Redesign