In November 2017 I participated in UX hackathon to improve Heroes to Heroes, a non-profit veterans outreach program through spiritual and peer to peer counseling. The objective was to diagnose problem areas, employ user-centered improvements, and ultimately drive enagement.

User research:

Define what the main objectives of the site where:

1. To gain enrollment or support of mentors
2. Supply support services to veterans

After I performed a content inventory I noticed areas for improvement where

1. Make navigation more prominent. Reorganize content and relabel sections to increase findability.
2. Make "Donate" and "Application" process most prominent part of the site
3. Streamline forms for the end users especially for those with cognitive impairments. Show clear steps and give visual cues on progress

After I performed a content inventory I noticed areas for improvement where:

1. Make navgation more prominent. Reorganize content and relabel sections to increase findability.
2. Make "Donate" and "Application" process most prominent part of the site
3. Streamline forms for the end users especially for those with cognitive impairments. Show clear steps and give visual cues on progress

Content map: 

My first objective was improve the findability and taxonomy of the content. I also wanted to streamline content down to what helped us achieve our goals of increasing donations and applicants. To get a sense of how I could reorganize content and create a hierarchy of information I completed a card sorting exercise.

Figure "1" represents the current site design

Figure "2" represents my proposed site hierarchy

Sitemap: 

I reorganized synthesized the results into a sitemap. Sections that where closer to our MVP where placed higher in site map.

Design

Wireframes:

Once in wireframing I began to make improvements to the site by:

1. Placing donate and apply at top of navigation to increase findability
2. Prominently add "Donate" and "Apply" CTAs to landing screen
3. Simplified donation form with clear member levels
4. Intuitive, stepped firms with milestone bar
5. Video testimonial for social media presence

Final UI

Then final design features:

1. Simplfied navigation with clear labels
2. Donate and Apply are featured next to each other in the navigation
3. 2 bold CTA for both Donate and Apply onthe home page
4. Sliding transition to reveal either Sponsor or Applicant on hover/click
5. Simplfied forms for both Donate and Application process