New Beginning for Camp Evergreen // UX Case Study
{Part I of II}
Camp Evergreen is a nonprofit organization serving the special needs and their families in DC/MD/VA area, since 1992. What started out as a summer passion project by a group of college students is now a crucial program for many special needs families. With 80% of the campers returning each year, and some having been with Camp Evergreen since the beginning, this organization is like an extended family to many of them.
“I remember my very first summer camp 24 years ago. Patti was my camper for 4 years — a wheelchair user in need of total care. I had just graduated from college minoring in special education at the time. Patti and I have not only developed a life-long friendship but we’ve also created some unforgettable memories together.” -Anonymous, Volunteer
Although they’ve been around for 28 years, their operation style has stayed in the 90s. Without a properly working website and ever-growing email list, it is time to roll up the sleeves and welcome Camp Evergreen into the 21st century. Alright, let me take you through this journey!
1. WHAT’S THE PROBLEM?
Well, let me tell you. One of the major issues that Camp Evergreen has is that, without a properly working website, their main communication method consists of emails, multiple chat apps, group texts, and individual phone calls.
The volunteers are required to physically attend the training sessions once a week for 12 weeks and the training material is emailed to each volunteer every week. Those who missed a session, or the entire training as they did this year, will have to dig through the emails to locate the training materials — and unfortunately, not everyone takes the time to review it on their own. It is crucial for all volunteers to attend the training and learn the details of each disability.
How can we improve the training experience for the volunteers? It would be a game changer to be able to offer these trainings online and archive the recorded trainings on a website for the volunteers to reference the materials anytime and anywhere.
How might we…
Create a more efficient system to better distribute the training and training materials for the volunteers to easily access?
Here is the Sprint map with the focus area in the dotted line:
2. WHO IS IT FOR?
Initially working with 3 different user personas, I quickly realized that I needed to focus on one type of user first. After creating the Sprint map, my main focus became clear — the volunteers and the trainings.
“When I first heard about Camp Evergreen from a friend, I was surprised to find out that they didn’t have a website — in this day and age! It is a hassle to receive everything as an email attachment, but sadly I’m getting used to the annoyance.” -Anonymous, Volunteer
One of the more specific issues for the volunteers was the fact that there was no training available online, which made it practically impossible to register volunteers that lived far. This was brought up over and over as the initial interview process went on. Basically, if you couldn’t attend the training session, you were on your own to study the PDF material that you received via email. I believe having a website that houses all the trainings will be very helpful. The volunteers will finally be able to access the training whenever and wherever.
3. WHAT ARE THE SCOPES?
The duration of this part of the case study was 8 weeks in total. One constraint that I experienced was that, because these tests were done virtually, I was not able to see the emotions as the users navigated through the prototype. However, all the users were great in verbalizing their thoughts and actions throughout the process. Here are some details of the scope of this testing:
- Method: User interview and prototype testing, 100% remote
- Data Collection: Notes and recordings from Zoom meetings
- Participants: Camp Evergreen volunteers & non-Camp Evergreen participants
- Deliverable: Updated Prototype according to the findings
4. WHAT WAS THE PROCESS?
Now that my goal was clearly defined, I could move forward onto the next step. These are the steps that I followed to create the design solution based on the findings of the previously conducted user research:
Lightning Demo & Crazy 8
Many of the features in these sketches were inspired by other websites — Amazon Music, LinkedIn Learning, and YouTube to name a few. The goal of this study was to figure out the different ways of attending online training that are currently being used. A short research was done to gather the different ideas, and from there, I was able to modify to fit the need of Camp Evergreen. Some of these ideas include subscriptions, featured items, tracking systems, and summarized overviews.
Wireframes & Prototypes
Given the fact that Camp Evergreen’s website had to be built from scratch, the homepage wireframe needed to be created first in order for the other pages to exist. Once the general grid system was put in place, all the other initial contents naturally fell into its own place — including the training page. Utilizing some of the ideas from the previous step and data from the previous studies, the training page would now include all the basic ingredients.
Based on the wireframes, I created the prototypes using the existing branding of Camp Evergreen. A lot of the items on the training page had to be shuffled, added, and modified to fulfill the need of the volunteers and meet the expectations of their training experience. Training tracking system was added back in along with featured course at the top of the page.
Additionally, the training course pages and monthly newsletter email were created to better showcase the mapping of navigation.
Usability Test
With the defined problem statement in mind, I made the following assumptions prior to usability testing:
- Volunteers are not receiving the trainings in the most efficient way. They are having to miss the trainings if they can’t physically make it to the training sessions in person. They are receiving the missed training materials in PDF form via email, having to download and read through on their own.
- Creating a website that can host the recorded trainings and materials will effectively solve the issue and many other ones. They will be able to easily access past/new trainings online at anytime and anywhere. They will be able to easily view the full training session through the recordings.
I tested the prototype website with 2 different user groups — active Camp Evergreen volunteers and non-Camp Evergreen personnel. My goal was to understand the needs of the users when attending trainings online, as well as the behaviors of the users when navigating through the website to locate the trainings. The following are the tasks presented to the users:
- Route 1: You are a registered volunteer and just received a monthly newsletter email from Camp Evergreen regarding a new training material available online. Here is the email. Where do you go? What do you do?
- Route 2: You are a registered volunteer and decided to check the Camp Evergreen website to see if there are any announcements. Here is the link to the homepage. Where do you go? What do you do?
5. WHAT WERE THE CHANGES?
Overall, my assumptions were validated that the volunteers will greatly benefit from having these trainings readily available online. It will give the volunteers the flexibility to view it anywhere, anytime, eliminating the need of having to download these files onto one’s desktop or phone. In addition, the tracking feature and the overview section will add much more value for the volunteers with their training. On the other hand, there were some minor concerns that were raised as well.
Additional CTA has been added to the top of the email, anticipating emails with longer content. The usability test showed that more than half of the users went straight to the CTA button without reading the email.
Homepage
New training announcement popup window has been created to alert the volunteers right away of the new training. The users have options to close the window or click on the CTA to go to the training page. The usability test showed that 50% of the users, upon logging in, expected a new training announcement or an alert window to appear.
The wording on the login CTA has been revised from “Volunteer Login” to “My Training.” The usability test showed that the “Volunteer Login” button was giving away the wrong impression and the users were expecting to land on their volunteer profile page. They were puzzled when they were taken straight to the training page instead. With the CTA button revised to “My Training,” the users can now expect to land directly on the training page.
Profile Page
Profile page has been added as an extra to give the volunteers the freedom to change/update the contact information — and possibly subscription options in the future.
Training Page
Initially, many of the users thought the featured course description and the training video were part of the page header to further explain the training page — and skipped right down to the tracker section. A few revisions needed to be made to solve that issue. The featured course section has now been separated from the page header. A customized welcome message has been added to the page header to give it a more personal touch. The link to the volunteer’s profile page was also added at the top.
The usability test showed that the tracker was a big confusion point for everybody. To solve that problem, I simply added a hover-over feature to show the course title when the user moves the cursor. The completion dates also have been added next to the course titles in the overview section to make the training tracking experience better.
Course Page
As requested by 100% of the users from the usability test, the training tracker has been added onto each course page allowing the users to have a full visibility of where they are in their training. In addition, since the download button no longer needed to be prominent, it has been reduced down to a simple PDF icon.
One thing that was missing, according to 2 users, was the “Previous Training” button. Which now has been added at the bottom of the course page, next to the “Next Training” button for better navigation. The users still have the option to go back to the training page via “Back to My Training” button.
6. WHAT ARE THE OUTCOMES? WHAT’S NEXT?
As I wrap up this case study, I must say that some of the learnings from the usability test were quite interesting. For example, the Camp Evergreen volunteers skipped through the email and went straight to the CTA button and the non-Camp Evergreen users read the entire email, then went back up to click on the new training announcement. When asked, Camp Evergreen volunteers said that these emails are so frequent that a lot of the times, they don’t even read them. I’m hoping that having a website that can offer all the camp related information will reduce the number of newsletters down significantly. The volunteers will be able to receive the announcements in a much more effective way and will be able to navigate the trainings more efficiently. By solving the biggest issue on one type of user, ultimately created answers for other user types as well.
- The permanent staff will be able to efficiently disperse and maintain training sessions and materials without having to email or text the volunteers individually.
- The campers and the family members will be able to attend the events trusting that it is a safe and trustworthy environment for the children.
- More volunteers will be able to train and participate in this meaningful program. Most importantly, they will feel confident and better equipped for the safety and well being of the campers.
With so much information and learnings gathered during this case study, I feel confident to push this project on to the next phase — building the rest of the website and adding details to the prototype to include branding. Most importantly, Camp Evergreen is thrilled at the thought of having a working website again!
