CASE STUDY
Sharity
Bringing volunteers and organizations together one event at a time
Sharity is a mockup created created as a group project for my Human Computer Interaction Class. In our group of four we aimed to bring non-profits and volunteers together. Non-profits can say when and what they need help with and volunteers can pick and choose what works with their schedule.
This project focuses heavily on the design process itself and truly understanding our audience. We analyzed and dissected every aspect of the design, test, iterate process and kept a more simple design in mind. We used Google Slides as our medium of choice due to the knowledge constraints of our overall group
Role & Team
My Role:
I worked collaboratively on this project with my team on the entire project. I came up with the initial idea and did my best to design and create within the constraints and understandings of my peers such as using a PowerPoint design as our final project. This was the perfect role for me to jump into with my creative background and higher level understanding of the design process & iteration along with one of my peers
The Team:
The team consisted of four members including myself, my lovely group of two college sophomores, and a fellow senior.
The Challenge
Non-Profit organizations need help running events and keeping up with day to day tasks. With limited resources, many organizations rely on word of mouth as a means for reaching out to new members or volunteers. Our challenge was to create a centralized website where non-profits can sign up their organization along with available slots or needs they may have in order to reach the maximum number of individuals in the area who may be able to help as well as promote their organization within the community.
Research
Each project group member conducted focus group interviews and ran a demo with five people who ranged in age from 19-52 and fell into one of the following three categories:
The Avid Volunteer - someone who volunteers multiple times in a week
The Occasional Volunteer - someone who volunteers once or twice a month or primarily special events
The Non-User - someone who has little to no familiarity with volunteering for organizations within the community
Wireframes
Based on our user interviews, we found that the features that users wanted most from sharity were the ability to find organizations based on location and type, save events for personal access, ability to sign up for multiple shifts at once, and donate through the site.
Each Group member focused on building out one feature from list of possible features that we gathered during our research. My focus was on volunteer time slot functionality.
First Iteration
We conducted a usability test with our audience asking them to do specific tasks and give their overall impressions in specific categories as shown below
_edited.jpg)
_edited.jpg)
Our usability tests revealed a number of problems with the website's navigation and phrasing. We chose to add the Home Page option within the navigation bar when exiting the home page after running focus groups where people showcased higher ease.
Through this feedback, we decided to make carrying changes to the volunteer sign up page. First, we added a highlight feature when users click on an option allowing them to know which button they have selected while also giving the option to deselect as indicated when the highlight is erased. We also allowed users to choose more than one volunteer slot at a time. This allows the user to more efficiently sign up if they wish to do so for multiple slots and have them added to their calendar.
I also chose to change our brand colors to reflect the environment and invoke a sense of calmness. In an effort to make the wording and function behind each page clearer and more inviting to the user, I also chose to clean up the design by adding shadows showcasing specific elements as closer to the person and to make the website more visually appealing and visual changes once a volunteer time was clicked. I also moved the about us section from the home page to a separate page to make the experience less overwhelming for people using the website.
Final Iteration
Click here to see the updated prototype
We learned through our audience, that our project as a whole lacked dialogue. It did not have many instructional or explanatory words to guide the user causing unnecessary confusion.
We decided to add more clarifying texts in areas such as adding volunteering time-slots to their schedule. Our feedback questioned how far in advance someone could sign up for. By stating “All available slots given by the organization,” we hoped to show that there is no right or wrong answer for how little or far in advance slots would reach as they are created based on the organizations needs and when they must be met.
What would we do differently?
In conclusion, there were many limitations given the medium used of Google Slides.
One of the complaints from audience #2 was that it was tedious to have to click every time to enter a box’s information for credit card data. In a real website, a user can either click or press the Tab key to move to the next cell, and the user above may be one who does not prefer having to click. However, we could not implement a way to “move forward” using a Tab key press in the interface, but we do predict that the user’s comment wouldn’t be a pain point if we had the time and resources available to program a physical HTML website for our interface, as we would be able to implement other strategies to move between boxes besides having to click on the boxes themselves.
Overall, the majority of user frustrations were caused by the limitations in using Google Slides to implement this interface, and the changes we made between our initial prototype to this updated prototype were helpful for users.
In the future - transferring this project into a medium such as Adobe XD would create a more accurate user experience for our audience.