View of mobile donation crypto page designed for www.krishnacowsanctuary.com

Project Name
Krishna Cow Sanctuary Donation Page
"The Cow Farm Revolution"
Client Name
N. Higgins
Project Date
3/25/2018 - 5/12/2018

Role
Develop the UI & test the interface through the UX approach

Platforms
Mobile Browser

Design Tools & Methods Used
pencil and paper, Adobe XD, Affinity Designer, A/B testing, competitor research, journey mapping

Key Performance Metrics
engagement time, user feedback

Team Members & Collaborators
UX Designer: Colin Curley (me), Web Design Head: Radhesyam Dasi, CEO: N. Higgins


Overview
Krishna Cow Sanctuary is an organization that rescues cows and provides cruelty free cow products for consumers who want ethically sourced non-GMO products. The organization rescues cows & uses the dairy for ethically sourced goods. The organization was seeking to boost their donations and increase the amount of user awareness of the farm. I collaborated with design, and the technical lead to launch this branch of the website. 





Initial Research
To gain an insight into the users for Krishna Cow Sanctuary I decided to create user profiles and conduct user testing. The users for Krishna Cow Sanctuary spread across the spectrum of age and income. All users were animal lovers and most likely vegan or vegetarian. The sanctuary is also a Hare Krishna organization so there many of the users would be members of this faith. With these characteristics in mind I found two users and asked them to complete a donation on the Krishna Cow Sanctuary Site and a competitors site exclusively. Many users experienced trouble finding the donation page from the home page. They also were frustrated by the amount of dialogue, contrast to the layout of the competitors website. Transparency was also important to users. They sought reassurance that the cows were being properly cared for and also expressed interest in knowing how the donation funds were being allocated for the care of the animals. With these characteristics in mind I returned to the original goals of the project to rework the goals of my study.





Reevaluating the goals
With these observations in mind I returned to my original goal to improve the website. Now I sought to make the website more understandable while reducing the number of clicks to the donation page. On arrival the donation page needed to be easy to digest, offering a sense of transparency to the users. With these goals I rifled through low fidelity wire frames to discover potential design solutions.




The intial wireframe for the cow sanctuary donation page. After conducting user research, I realized having one large page with the form conveyed a better sense of transparency. Thus the first screen of the donation page would start at "3 Personal Info".

What I saw during the user testing was that a longer single form resulted in faster conversions. When the "Monthly Donation" option was placed at the bottom of the page, users would spend more time reviewing their order, contrast to the wire frame where this feature was placed near the form used to input the donation amount. 




​​​​​​​
Design
 With this finding in mind I moved forward with creating a prototype with a style guide with a new proposed typography that I was hoping to implement.

Chosen style guide for prototype

These were some of the designs considered for the homepage. Ultimately, I would remove the blue icons to simply the header image and apply a logo developed by another designer.

Before and after diagram outlining minor design changes made to the mobile format of the donations page. These changes resulted in much faster conversion among tested users.

Findings
I was very surprised by how important transparency was to the overall design of the web page. Users wanted to know how their donations were being used and also preferred more transparency in the actual donation process by preferring one form instead of many. Overall this case study was very enlightening and I am awaiting the implementation of my design on the live website.
Back to Top